diff --git a/src/App.css b/src/App.css index 74b5e05..013350c 100644 --- a/src/App.css +++ b/src/App.css @@ -1,38 +1,6 @@ .App { - text-align: center; -} - -.App-logo { - height: 40vmin; - pointer-events: none; -} - -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } -} - -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; -} - -.App-link { - color: #61dafb; -} - -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } +display: flex; +flex-direction: column; +width: 700px; +margin: 50px auto; } diff --git a/src/Button.css b/src/Button.css new file mode 100644 index 0000000..3d97a44 --- /dev/null +++ b/src/Button.css @@ -0,0 +1,9 @@ +.Button { + width: 25%; + text-align: center; + font-size: 20px; + font-weight: bold; + color: black; + height: 100% + +} diff --git a/src/ButtonPanel.css b/src/ButtonPanel.css new file mode 100644 index 0000000..05b1a24 --- /dev/null +++ b/src/ButtonPanel.css @@ -0,0 +1,3 @@ +.ButtonPanel .group { + height: 100px; +} diff --git a/src/Display.css b/src/Display.css new file mode 100644 index 0000000..ba53965 --- /dev/null +++ b/src/Display.css @@ -0,0 +1,9 @@ +.Display { + background: grey; + height: 100px; + color: white; + font-weight: bold; + font-size: 80px; + padding: 10px; + text-align: right; +} diff --git a/src/components/App.js b/src/components/App.js index b84ac74..5df3fa4 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -11,7 +11,7 @@ class App extends React.Component { render() { return ( -