add team image

FRC-1721 · Aug 31, 2024 · d124ee0 · d124ee0
1 parent 4f4f6c6
commit d124ee0
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 3 deletions.
diff --git a/src/index.html b/src/index.html
@@ -30,6 +30,11 @@
             share the same interest—STEM! Everyone is welcome to join, and there
             are no prerequisites.
           </div>
+
+          <div class="team">
+            <img src="asset/team2024.jpg" alt="Image of Team 1721" />
+            <span>at 2024 New England Districts</span>
+          </div>
           <h2>What is FIRST?</h2>
           <div>
             FIRST For Inspiration and Recognition of Science and Technology was

diff --git a/src/index.scss b/src/index.scss
@@ -5,7 +5,6 @@
   margin: 0;
   padding: 0;
   font-family: "HKGrotesk", Geneva, Verdana, sans-serif;
-  font: optional;
 }
 
 main {
@@ -29,8 +28,13 @@ main {
     max-width: 1200px;
     color: #ebdbb2;
     position: relative;
-    padding: 64px 48px;
     border-radius: 32px;
+    padding: 64px 0;
+
+    & > * {
+      margin-right: 48px;
+      margin-left: 48px;
+    }
 
     .splash {
       position: absolute;
@@ -81,12 +85,36 @@ main {
       margin-top: 32px;
       font-size: 26px;
     }
+
+    .team {
+      margin: 32px 0;
+      position: relative;
+
+      img {
+        width: 100%;
+        display: block;
+      }
+
+      span {
+        position: absolute;
+        bottom: 8px;
+        left: 50%;
+        transform: translateX(-50%);
+        color: #1d2021;
+        font-size: 20px;
+        font-weight: 400;
+        font-style: italic;
+      }
+    }
   }
 }
 
 @media (width <= 600px) {
   .content {
-    padding: 32px 20px !important;
+    & > * {
+      margin-right: 20px;
+      margin-left: 20px;
+    }
     .splash {
       top: -60px !important;
       font-size: 50px !important;
@@ -95,5 +123,8 @@ main {
         font-size: 40px !important;
       }
     }
+    .team span {
+      font-size: 16px !important;
+    }
   }
 }