Adding hero-curve

app/config/wp/scripts-and-styles.php

@@ -7,7 +7,6 @@ function base_camp_scripts_and_styles()
 {
     // Register styles
     wp_register_style('slick-style', '//cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.css', [], '', 'all');
-    wp_register_style('slick-style-theme', '//cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick-theme.min.css', [], '', 'all');
     wp_register_style('base-camp-styles', assets('app.css'), [], '', 'all');
 
     // Register scripts
@@ -18,7 +17,6 @@ function base_camp_scripts_and_styles()
     wp_enqueue_script('base-camp-scripts');
     wp_enqueue_script('base-camp-vendor');
     wp_enqueue_style('slick-style');
-    // wp_enqueue_style('slick-style-theme');
     wp_enqueue_style('base-camp-styles');
 
     // comment reply script for threaded comments

resources/assets/sass/sections/_hero-home.sass

@@ -3,11 +3,15 @@
     background: $blue center / cover no-repeat
     display: flex
     align-items: center
+    height: 275px
+    position: relative
+    overflow: hidden
 
-    min-height: 275px
+    +tablet
+        height: 388px
 
     +desktop
-        min-height: 538px
+        height: 538px
         background-color: $blue
 
     &__item
@@ -57,3 +61,21 @@
 
         .icon-cart
             margin-right: 20px
+
+    &__curve
+        position: absolute
+        bottom: -2px
+        left: 50%
+        transform: translateX(-50%)
+        width: 102%
+        max-width: 102%
+        height: auto 
+
+        +tablet
+            bottom: -15px
+
+        +desktop
+            bottom: -50px
+
+        +fullhd
+            bottom: -64px

resources/views/front-page.twig

@@ -16,10 +16,9 @@
             </div>
             <div class="hero-home__controls"></div>
         </div>
-
     </div>
 
-    <div class="hero-home__line"></div>
+    <img src="{{ theme.link }}/resources/assets/images/hero-curve.svg" class="hero-home__curve">
 
 </section>
 

static/css/app.904ba23a2d29d6e70599.css → static/css/app.5e99732754762fdf1a58.css

@@ -7310,10 +7310,15 @@ nav.navbar .navbar-menu {
   background: #2376B3 center/cover no-repeat;
   display: flex;
   align-items: center;
-  min-height: 275px; }
+  height: 275px;
+  position: relative;
+  overflow: hidden; }
+  @media screen and (min-width: 769px), print {
+    .hero-home {
+      height: 388px; } }
   @media screen and (min-width: 1024px) {
     .hero-home {
-      min-height: 538px;
+      height: 538px;
       background-color: #2376B3; } }
   .hero-home__item {
     width: 100%; }
@@ -7357,6 +7362,23 @@ nav.navbar .navbar-menu {
       padding-right: 28px; }
     .hero-home__cta .icon-cart {
       margin-right: 20px; }
+  .hero-home__curve {
+    position: absolute;
+    bottom: -2px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 102%;
+    max-width: 102%;
+    height: auto; }
+    @media screen and (min-width: 769px), print {
+      .hero-home__curve {
+        bottom: -15px; } }
+    @media screen and (min-width: 1024px) {
+      .hero-home__curve {
+        bottom: -50px; } }
+    @media screen and (min-width: 1408px) {
+      .hero-home__curve {
+        bottom: -64px; } }
 
 .featured-boxes.section {
   padding-top: 56px;

static/manifest.json

@@ -1,10 +1,12 @@
 {
-  "admin.css": "css/admin.904ba23a2d29d6e70599.css",
-  "admin.js": "js/admin.904ba23a2d29d6e70599.js",
-  "app.css": "css/app.904ba23a2d29d6e70599.css",
-  "app.js": "js/app.904ba23a2d29d6e70599.js",
-  "login.css": "css/login.904ba23a2d29d6e70599.css",
-  "login.js": "js/login.904ba23a2d29d6e70599.js",
-  "vendor.js": "js/vendor.904ba23a2d29d6e70599.js",
+  "admin.css": "css/admin.5e99732754762fdf1a58.css",
+  "admin.js": "js/admin.5e99732754762fdf1a58.js",
+  "app.css": "css/app.5e99732754762fdf1a58.css",
+  "app.js": "js/app.5e99732754762fdf1a58.js",
+  "login.css": "css/login.5e99732754762fdf1a58.css",
+  "login.js": "js/login.5e99732754762fdf1a58.js",
+  "vendor.js": "js/vendor.5e99732754762fdf1a58.js",
+  "images/icon-cart-white.png": "images/icon-cart-white.png",
+  "images/texture-blue-carnival.jpg": "images/texture-blue-carnival.jpg",
   "images/base-camp-logo.png": "images/base-camp-logo.png"
 }