diff --git a/src/components/Home.js b/src/components/Home.js index 4463d26..66c2643 100644 --- a/src/components/Home.js +++ b/src/components/Home.js @@ -5,7 +5,7 @@ import hero from "./assets/img/olympian_hero.png"; export default function Home(props) { return ( - +

 Potentia 

@@ -22,23 +22,23 @@ export default function Home(props) { alt="" />
- {/*

hello

place this in the section, relative is only to the parent div */} - {/*
-
-
-

Who are we?

-

- Content -

-
-
-

Our mission

-

- Content -

-
+
+
+

Who are we?

+

+ Potentia Robotics is the first high school team to design and build a fully-functional humanoid robot entirely from scratch. + It's run by students from the Thomas Jefferson High School for Science and Technology (TJHSST).



+ We're building Olympian: our low-cost, 6-foot tall, bipedal humanoid robot with a human-like dynamically stable gait, limb mobility, and balance capabilities, that can be controlled effectively and efficiently from afar.

-
*/} +
+
+

Our mission

+

+ At Potentia Robotics, we want to push the boundaries of what high-school students can achieve. + Our ultimate goal is to further STEM knowledge in the K-12 community while leading by example and showing other students that age isn't a limiting factor for any project, no matter how large-scale. +

+
+
); } diff --git a/src/components/Sponsors.js b/src/components/Sponsors.js index 43aaafc..cd44d5a 100644 --- a/src/components/Sponsors.js +++ b/src/components/Sponsors.js @@ -25,7 +25,7 @@ class Sponsors extends Component { return ( <> -
+

Our amazing sponsors help make Potentia Robotics' projects possible!

Contact us to learn more about sponsorship.

diff --git a/src/components/assets/Blog.scss b/src/components/assets/Blog.scss index c982aa0..7f78285 100644 --- a/src/components/assets/Blog.scss +++ b/src/components/assets/Blog.scss @@ -129,28 +129,3 @@ $desktop-small: 1250px; } } } - -.intro-wrapper { - // position: relative; - justify-content: center; - - -} - -.intro-section { - position: absolute; - top: 50vw; - min-height: 50vh; - min-width: 100%; - background: rgb(235, 235, 235); -} - -.intro-content { - background: rgb(235, 235, 235); - float: left; -} - -.mission-statement { - background: rgb(235, 235, 235); - float: right; -} \ No newline at end of file diff --git a/src/components/assets/Events.scss b/src/components/assets/Events.scss index c982aa0..7f78285 100644 --- a/src/components/assets/Events.scss +++ b/src/components/assets/Events.scss @@ -129,28 +129,3 @@ $desktop-small: 1250px; } } } - -.intro-wrapper { - // position: relative; - justify-content: center; - - -} - -.intro-section { - position: absolute; - top: 50vw; - min-height: 50vh; - min-width: 100%; - background: rgb(235, 235, 235); -} - -.intro-content { - background: rgb(235, 235, 235); - float: left; -} - -.mission-statement { - background: rgb(235, 235, 235); - float: right; -} \ No newline at end of file diff --git a/src/components/assets/Home.scss b/src/components/assets/Home.scss index a2c60e9..89b4f21 100644 --- a/src/components/assets/Home.scss +++ b/src/components/assets/Home.scss @@ -1,6 +1,7 @@ @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Inter:wght@600&display=swap"); -$mobile-small: 575px; +$mobile-small: 530px; $mobile: 768px; $tablet: 1024px; $desktop-small: 1250px; @@ -34,10 +35,11 @@ $desktop-small: 1250px; @content; } } - -// .test { -// position: relative; -// } +.main-content { + display: flex; + flex-direction: column; + font-family: Poppins, sans-serif; +} * { padding: 0; @@ -47,8 +49,27 @@ $desktop-small: 1250px; .hero { pointer-events: none; - // position:relative - // height: 86vh; + position: relative; + + @include mobile-small { + min-height: 41.5vw; + } + + @include mobile { + min-height: 44vw; + } + + @include tablet { + min-height: 45vw; + } + + @include desktop-small { + min-height: 46vw; + } + + @include desktop { + min-height: 47.5vw; + } } .landing-header { @@ -109,8 +130,6 @@ $desktop-small: 1250px; z-index: 999 !important; width: 45%; - - @include desktop-small { margin-top: 40vh; } @@ -138,26 +157,61 @@ $desktop-small: 1250px; } .intro-wrapper { - // position: relative; + position: relative; + display: flex; + flex-direction: row; justify-content: center; + width: 100%; + padding-bottom: 20px; + font-family: Inter, sans-serif; + margin-top: 3em; + // border-style: solid; - -} - -.intro-section { - position: absolute; - top: 50vw; - min-height: 50vh; - min-width: 100%; - background: rgb(235, 235, 235); + // background: rgb(235, 235, 235); } .intro-content { - background: rgb(235, 235, 235); - float: left; + margin: 0 auto; + width: 47%; + margin-left: 2vw; + padding-left: 2vw; + padding-right: 2vw; + padding-top: 1vw; + padding-bottom: 1vw; + background: rgb(243, 243, 243); + } .mission-statement { - background: rgb(235, 235, 235); - float: right; -} \ No newline at end of file + margin: 0 auto; + width: 47%; + margin-right: 2vw; + padding-right: 2vw; + padding-left: 2vw; + padding-top: 1vw; + padding-bottom: 1vw; + background: rgb(233, 247, 253); + +} + +.intro-space { + background: white; +} + +.intro-header { + // margin-left: 10vw; + text-align: center; + font-size: 2.6vw; + padding-bottom: 1vw; + font-family: Poppins, sans-serif; +} + +.intro-text { + font-size: 1.3vw; + line-height: 1.75em; +} + +.text-blue { + color: #009dff; +} + diff --git a/src/components/assets/Navbar.scss b/src/components/assets/Navbar.scss index ffa7bf7..ea18f48 100644 --- a/src/components/assets/Navbar.scss +++ b/src/components/assets/Navbar.scss @@ -113,9 +113,9 @@ nav { } } -// body { -// overflow-x: hidden; -// } +body { + overflow-x: hidden; +} @media (max-width: $desktop-small) { diff --git a/src/components/assets/Olympian.scss b/src/components/assets/Olympian.scss index c982aa0..7f78285 100644 --- a/src/components/assets/Olympian.scss +++ b/src/components/assets/Olympian.scss @@ -129,28 +129,3 @@ $desktop-small: 1250px; } } } - -.intro-wrapper { - // position: relative; - justify-content: center; - - -} - -.intro-section { - position: absolute; - top: 50vw; - min-height: 50vh; - min-width: 100%; - background: rgb(235, 235, 235); -} - -.intro-content { - background: rgb(235, 235, 235); - float: left; -} - -.mission-statement { - background: rgb(235, 235, 235); - float: right; -} \ No newline at end of file diff --git a/src/components/assets/Sponsors.scss b/src/components/assets/Sponsors.scss index 19600b2..f38bdf5 100644 --- a/src/components/assets/Sponsors.scss +++ b/src/components/assets/Sponsors.scss @@ -4,7 +4,7 @@ //background: linear-gradient(to right, #ee6c4d, #3d5a80, #293241); } -.intro-wrapper { +.sponsor-intro-wrapper { margin-top: 3em; }