From c1bcc55be1ada49e63a7cfd49c36695019e36658 Mon Sep 17 00:00:00 2001 From: 9308233900 Date: Sat, 17 Apr 2021 01:59:47 -0700 Subject: sidebar contrast bug fixed, landing page started --- react-frontend/src/css/Landing.css | 202 +++++++++++++++++++++++++++++++++++++ react-frontend/src/css/Modal.css | 2 +- 2 files changed, 203 insertions(+), 1 deletion(-) create mode 100644 react-frontend/src/css/Landing.css (limited to 'react-frontend/src/css') diff --git a/react-frontend/src/css/Landing.css b/react-frontend/src/css/Landing.css new file mode 100644 index 0000000..5a39bfe --- /dev/null +++ b/react-frontend/src/css/Landing.css @@ -0,0 +1,202 @@ +.nav-bar{ + position: fixed; + top: 0px; + left: 0px; + width: 100vw; + height: 70px; + background-color: rgb(7, 7, 44); + z-index: 100; +} + +.topnav { + background-color: rgb(7, 7, 44); + overflow: hidden; + margin-right: 30px; +} + +.topnav a { + float: right; + color: #f2f2f2; + text-align: center; + padding: 14px 16px; + text-decoration: none; + font-size: 17px; + height: 30px; + padding-top: 25px; +} + +.topnav a:hover { + background-color: rgb(17, 11, 99); + color: white; +} + +.topnav a.active { + background-color: #4CAF50; + color: white; +} + +body { + background-color: #f3f3f3; + font-family:Verdana, Geneva, Tahoma, sans-serif; + overflow-y: scroll; + overflow-x: hidden; + position: relative; + left: 0px; + +} +main { + margin-top: 65px; + display: flex; + flex-direction: column; + position: relative; + left: 0px; +} + +.intro { + height: 120vh; + width: 100vw; + background-color: rgb(3, 2, 24); + color: white; + +} + +.app-preview { + height: 90vh; + width: 100vw; + background-color: #b7ffb9; + color: white; +} + +section { + width: 100vw; + overflow: hidden; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +#app-intro{ + padding-top: 160px; +} + +.s-i { + width: 100%; + max-width: 1600px; + display: flex; + flex-direction: row; + justify-content: space-evenly; + padding-top: 0px; +} + +.s-i-p { + display: flex; + flex-direction: column; + justify-content: center; +} + +.s-i-p-heading{ + font-size: 45px; + margin: 10px 0 0 0; + text-align: center; + font-weight: bold; +} + +.s-i-p-text{ + color: rgba(0,0,0, 0.6); + font-size: 18px; + display: flex; + justify-content: center; + align-items: center; + text-align: center; + max-width: 700px; + margin: 10px 0 20px 0; +} + +.s2-i-s { + padding-top: 0px; + width: 80%; + max-width: 1600px; + min-height: 500px; + align-items: center; +} + +#team { + width: 100vw; + padding: 50px 0 200px 0; + justify-content: flex-start; + background-color: #cccccc; +} + +#s-i-p-heading-team{ + margin-bottom: 0px; +} + +#s-i-p-heading-text { + color: rgba(0,0,0, 1); + font-size: 18px; + display: flex; + justify-content: center; + align-items: center; + text-align: center; + width: 100%; + margin: 0; +} + +#s3-i-t-p { + flex-direction: column; + max-width: 1000px; + max-height: 500px; + height: 500px; +} + +#s-i-p-team-c{ + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + width: 100%; +} + +.s-i-p-team-person-c{ + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-top: 50px; +} + +.s-i-p-team-person{ + border-radius: 100px; + overflow: hidden; + margin: 20px; + height: 200px; + width: 200px; + box-shadow: 0 0 2px 2px rgba(0,0,0,0.15); +} + +.s-i-p-team-text{ + color: rgba(0,0,0, 1); + font-size: 18px; + display: flex; + justify-content: center; + align-items: center; + text-align: center; + max-width: 700px; + margin: 0; +} + +#footer { + width: 100vw; + background: rgb(7, 7, 44); + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + } + +.footer-item{ + color: white; + font-size: 20px; +} + diff --git a/react-frontend/src/css/Modal.css b/react-frontend/src/css/Modal.css index 7ee5045..96f9066 100644 --- a/react-frontend/src/css/Modal.css +++ b/react-frontend/src/css/Modal.css @@ -70,7 +70,7 @@ width: 150px; } -span { +.span { font-weight: bold; color:rgba(10, 9, 71); } -- cgit v1.2.3-70-g09d2