From 01ece7845e0f0b1d4e75f853ad0fbdf87d70097f Mon Sep 17 00:00:00 2001 From: Hossein Date: Tue, 17 Oct 2023 10:36:43 -0700 Subject: [PATCH 01/17] set css for the App.js --- react-front-end/src/App.css | 33 ----------- react-front-end/src/style/App.css | 67 +++++++++++++++++++++++ react-front-end/src/{ => style}/index.css | 0 3 files changed, 67 insertions(+), 33 deletions(-) delete mode 100644 react-front-end/src/App.css create mode 100644 react-front-end/src/style/App.css rename react-front-end/src/{ => style}/index.css (100%) diff --git a/react-front-end/src/App.css b/react-front-end/src/App.css deleted file mode 100644 index b41d297cab..0000000000 --- a/react-front-end/src/App.css +++ /dev/null @@ -1,33 +0,0 @@ -.App { - text-align: center; -} - -.App-logo { - animation: App-logo-spin infinite 20s linear; - height: 40vmin; - pointer-events: none; -} - -.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); - } -} diff --git a/react-front-end/src/style/App.css b/react-front-end/src/style/App.css new file mode 100644 index 0000000000..560a8ceb25 --- /dev/null +++ b/react-front-end/src/style/App.css @@ -0,0 +1,67 @@ +.rectangle-button { + width: 300px; + height: 100px; + background-color: #ffff00; + color: #000000; + border: 8px solid #000000; + border-radius: 5px; + font-size: 30px; + font-family: "Pixelify Sans", sans-serif; + margin: 10px; + cursor: pointer; +} + +.rectangle-button:hover { + background-color: #e0e000; +} + +.score-box { + background-color: #ffff00; + color: #000000; + border: 8px solid #000000; + border-radius: 5px; /* Add rounded corners */ + width: 800px; + padding: 40px; + font-family: "YourFontFamily", sans-serif; + font-size: 18px; + text-align: center; +} + +.score-columns { + display: flex; + justify-content: space-between; + margin-top: 20px; + flex-direction: column; + flex-wrap: wrap; + max-height: 140px; + gap: 5px; +} + +.score-column { + width: 30%; +} + +.score-row { + display: flex; + justify-content: space-around; + align-items: center; +} + +.player-name { + /* width: 50%; */ + text-align: left; +} + +.player-score { + /* width: 40%; */ + text-align: right; +} + +.div-style { + background-color: purple; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; +} diff --git a/react-front-end/src/index.css b/react-front-end/src/style/index.css similarity index 100% rename from react-front-end/src/index.css rename to react-front-end/src/style/index.css From 7bc6befab73225c565e1136bcdeecb257d63759d Mon Sep 17 00:00:00 2001 From: Hossein Date: Tue, 17 Oct 2023 10:51:26 -0700 Subject: [PATCH 02/17] add new font --- react-front-end/public/index.html | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/react-front-end/public/index.html b/react-front-end/public/index.html index 75980d58e2..a5da99ef5a 100644 --- a/react-front-end/public/index.html +++ b/react-front-end/public/index.html @@ -2,12 +2,17 @@ - + + + + + + - +