Aaaaaaaaaaaaaaaaaaaa

Author: steph1111

_includes/comp-showcase.html

@@ -1,12 +1,16 @@
 <section class="hero" id="comp-showcase">
-    <figure class="hero-background" style="background-image: url('{{page.hero-image}}');">
+    <figure class="hero-background" style="background-image: url('{{page.hero-bkg}}');">
         <div class="overlay">
             <div class="container">
-                <div class="title-text">
+                <div class="hero-content">
+                    <img src="{{page.full-logo}}" alt="Logo" class="hero-logo">
+                </div>
+                <!-- <div class="title-text">
                     <h1 class="title has-text-white-ter is-size-1 has-text-weight-bold">
                         {{page.title}}
                     </h1>
-                </div>
+                </div> -->
             </div>
         </div>
+        <div class="wave-overlay" style="background: url('{{page.hero-overlay}}') no-repeat bottom center;"></div>
 </section>

_site/assets/css/style.css

@@ -1333,4 +1333,23 @@ body { background-color: var(--background); }
     .title-text {
         text-align: center;
     }
+
+    .wave-overlay {
+        position: absolute;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 40%;
+        background-size: cover;
+    }
+    .container {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+        text-align: center;
+    }
+    .hero-logo {
+        max-width: 300px;
+    }
 }

assets/css/style.scss

@@ -4,5 +4,6 @@ title: "MATE"
 full-logo: "https://raw.githubusercontent.com/CabrilloRoboticsClub/cabrillorobotics.github.io/what-a-theme-test/assets/images/comps/mate-logo.webp"
 title-logo: 
 hero-bkg: "https://raw.githubusercontent.com/CabrilloRoboticsClub/cabrillorobotics.github.io/what-a-theme-test/assets/images/support-us-hero.webp"
+hero-overlay: 
 description: "The MATE ROV Competition is an international robotics competition in which teams create underwater Remotely Operated Vehicles (ROVs).  ROVs are piloted, and are typically used for ocean exploration and precise manipulation of objects in hazardous areas. MATE ROV's competition attempts to mirror these missions, with tasks involving coral restoration, mooring array maintenance, and sample collections."
 ---

assets/images/comps/robosub-hero-bkg.jpg

@@ -4,5 +4,6 @@ title: "RoboSub"
 full-logo: "https://raw.githubusercontent.com/CabrilloRoboticsClub/cabrillorobotics.github.io/what-a-theme-test/assets/images/comps/robosub-logo.webp"
 title-logo:
 hero-bkg:  "https://raw.githubusercontent.com/CabrilloRoboticsClub/cabrillorobotics.github.io/what-a-theme-test/assets/images/comps/robosub-hero-bkg.webp"
+hero-overlay: "https://raw.githubusercontent.com/CabrilloRoboticsClub/cabrillorobotics.github.io/what-a-theme-test/assets/images/comps/robosub-hero-overlay.webp"
 description: "RoboSub is an international robotics competition in which teams compete to create Autonomous Underwater Vehicles (AUVs). These AUVs are completely unmanned, and must use sensor data to navigate and complete various tasks in a live competition. The competition tasks mirror real-world AUV missions, such as seafloor mapping and sonar localisation."
 ---