diff --git a/src/AboutUs/AboutUs.css b/src/AboutUs/AboutUs.css index 5a6f83f..4e1ad7b 100644 --- a/src/AboutUs/AboutUs.css +++ b/src/AboutUs/AboutUs.css @@ -2,7 +2,6 @@ display: flex; flex-direction: column; padding: 4svh 2svw; - row-gap: 4svh; justify-content: center; align-items: center; @@ -11,6 +10,11 @@ font-size: larger; } +#AboutUs p { + padding: 0svh 0svw; + margin: 1.5svh 0svw; +} + #AboutUs h2 { padding-bottom: 0.5svh; font-size: 36px; @@ -24,11 +28,26 @@ justify-content: flex-start; align-items: flex-start; padding: 2svh 2svw; - + max-width: 65svw; border-radius: 1rem; border: 1px solid white; } +#AboutEvents ul { + display: flex; + flex-flow: row wrap; + list-style-type: none; + margin: 0px; + padding: 0px; + justify-content: space-evenly; +} +#AboutEvents ul li:first-child { + width: 100%; + display: flex; + flex-direction: column; + align-items: center; +} + #AboutUs div { display: flex; flex-flow: row wrap; @@ -39,7 +58,7 @@ #AboutUs img { width: 400px; - + aspect-ratio: 1; border-radius: 1rem; } @@ -96,3 +115,15 @@ border-radius: 1rem; border: 1px solid white; } + +@media only screen and (max-width: 800px) { + #AboutEvents { + max-width: 80svw; + } + + #AboutUs img { + width: 300px; + + border-radius: 1rem; + } +} diff --git a/src/AboutUs/AboutUs.js b/src/AboutUs/AboutUs.js index ef5211e..43bc9cb 100644 --- a/src/AboutUs/AboutUs.js +++ b/src/AboutUs/AboutUs.js @@ -20,18 +20,32 @@ const AboutsUs = () => {

Upcoming Events

-

Baja SAE April

- Wish Us Luck!

} - /> -

Baja SAE May

- Ready! Set! Go!

} - /> +
    +
  • +

    Recuitment Opens

    + Link to google form

    } + /> +
  • +
  • +

    Baja SAE April

    + Wish Us Luck!

    } + /> +
  • +
  • +

    Baja SAE May

    + Ready! Set! Go!

    } + /> +
  • +
diff --git a/src/Footer/Ender.css b/src/Footer/Ender.css index 05313c1..22a57de 100644 --- a/src/Footer/Ender.css +++ b/src/Footer/Ender.css @@ -35,5 +35,8 @@ } #ender a img { - height: 3svh; + height: 30px; + width: 30px; + aspect-ratio: 1; + filter: invert(); } diff --git a/src/Footer/Ender.js b/src/Footer/Ender.js index 3a36504..362f365 100644 --- a/src/Footer/Ender.js +++ b/src/Footer/Ender.js @@ -1,6 +1,4 @@ import "./Ender.css"; -import linkedInLogo from "./InBug-White.png"; -import instagramLogo from "./instagram-white-icon.png"; /** * @param {null} null - requires onthing @@ -25,13 +23,13 @@ export default function Ender() {
Linkedin Logo Intragram Logo @@ -45,7 +43,7 @@ export default function Ender() { Facebook Logo diff --git a/src/Footer/InBug-White.png b/src/Footer/InBug-White.png deleted file mode 100644 index 627f6b5..0000000 Binary files a/src/Footer/InBug-White.png and /dev/null differ diff --git a/src/Footer/instagram-white-icon.png b/src/Footer/instagram-white-icon.png deleted file mode 100644 index fe326bf..0000000 Binary files a/src/Footer/instagram-white-icon.png and /dev/null differ diff --git a/src/Home/Home.css b/src/Home/Home.css index 106bb7b..6d51ec4 100644 --- a/src/Home/Home.css +++ b/src/Home/Home.css @@ -22,7 +22,8 @@ /* height: clamp(200px, 100%, 55svh); */ /* height: 100%; */ /* max-width: 40%; */ - height: 52svh; + height: 350px; + width: 350px; align-self: center; } @@ -72,7 +73,7 @@ border: solid 2px white; padding: 30px; - max-width: 800px; + max-width: 80svw; } #HomeSponsors h2 { @@ -111,6 +112,7 @@ min-width: 200px; max-width: inherit; max-height: 80px; + width: auto; } #HomeSponsors div div div h3 { @@ -129,17 +131,13 @@ #HomeSponsorLinks a { margin-top: auto; padding: 1svh 4svw; - /* padding-left: 5svw; */ - /* padding-right: 5svw; */ margin: 0px 2svw; - width: 8svw; text-wrap: nowrap; text-align: center; } #HomeBottomGallery { width: 70svw; - height: 60svh; } @@ -147,3 +145,18 @@ width: inherit; height: inherit; } + +@media only screen and (max-width: 800px) { + .HomePageLayout div { + padding: 0svh 4svw; + } + .HomePageLayout div img { + width: 275px; + height: 275px; + } + + #HomeBottomGallery { + width: 80svw; + height: 60svh; + } +}