figbertmath

commit 25d6c1497f4c489108291e8d9ff4c62d5c89ca0a
parent 27b9499e61e75483703b58d6e241b828dc9c724b
Author: therealFIGBERT <figbertwelner@gmail.com>
Date:   Thu, 21 Nov 2019 21:49:13 -0800

Add calculator output screen

Diffstat:
M
src/App.css
 | 
14
++++++++++++++
M
src/App.js
 | 
3
++-
A
src/components/calculator.js
 | 
26
++++++++++++++++++++++++++
M
src/index.css
 | 
4
++++

4 files changed, 46 insertions(+), 1 deletion(-)
diff --git a/src/App.css b/src/App.css
@@ -0,0 +1,13 @@
+@import url('https://fonts.googleapis.com/css?family=Tomorrow&display=swap');
+
+#calcOut {
+    background: #ac1a2d;
+    color: rgba(255, 255, 255, .7);
+    font-family: 'Tomorrow', -apple-system, sans-serif;
+    font-size: xx-large;
+    text-align: right;
+    line-height: 75%;
+    padding: 3vh 10vw 3vh 10vw;
+    border: 1vw solid #1d1d1d;
+    border-radius: 1.5vw;
+}
+\ No newline at end of file
diff --git a/src/App.js b/src/App.js
@@ -1,8 +1,9 @@
 import React from 'react';
+import { Calculator } from "./components/calculator";
 import './App.css';
 
 export class App extends React.Component {
   render() {
-    return <div>Hello world!</div>;
+    return <Calculator/>;
   }
 }
 \ No newline at end of file
diff --git a/src/components/calculator.js b/src/components/calculator.js
@@ -0,0 +1,25 @@
+import React from 'react';
+import '../App.css';
+
+export class Calculator extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            mode: 'basic',
+            output: '000000',
+            input: '0000'
+        };
+    }
+
+    render() {
+        return (
+            <div>
+                <div id='calcOut'>
+                    {this.state.output}
+                    <br/>
+                    <span style={{fontSize: 'large'}}>{this.state.input}</span>
+                </div>
+            </div>
+        );
+    }
+}
+\ No newline at end of file
diff --git a/src/index.css b/src/index.css
@@ -1,4 +1,8 @@
 body {
     width: 100%;
     background: #7e1221;
+    font-family: -apple-system, sans-serif;
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
 }
 \ No newline at end of file