Page d'accueil

templates/frontOffice/custom/assets/src/css/custom.css

@@ -79,6 +79,31 @@ div.container {
     font-size: 1.72rem;
 }
 
+.navbar-default .navbar-nav > .open > a,
+.navbar-default .navbar-nav > .open > a:hover,
+.navbar-default .navbar-nav > .open > a:focus {
+    background-color: #95c11e;
+    color: #fff;
+}
+@media (max-width: 991px) {
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
+        color: #707070;
+    }
+
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
+    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
+        color: #fff;
+        background-color: #f49a17;
+    }
+
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a,
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
+    .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
+        color: #fff;
+        background-color: #f49a17;
+    }
+}
+
 .nav>li {
     text-transform: uppercase;
 }
@@ -89,6 +114,7 @@ div.container {
 }
 .navbar-customer > li > a {
     text-transform: none;
+    padding: 10px;
 }
 .header__content .container-fluid {
     padding-left: 0;
@@ -159,8 +185,7 @@ div.container {
     color: white;
 }
 .breadcrumb {
-    text-align: center;
+    text-align: left;
-    font-size: large;
     margin-bottom: 30px;
 }
 .checkout-progress .btn-step.active {
@@ -351,36 +376,102 @@ span.product-categorie {
 
 
 /*   Mise en page de la page d'accueil   */
-div.header__main {
+@media (min-width: 768px) {
-    display: inline-grid !important;
+    div.header__main {
-    align-items: center;
+        display: inline-grid !important;
-    margin: auto;
+        grid-template: 150px / 3fr 250px 1fr 1fr 1fr;
-    grid-template-columns: 2fr 200px 1fr 1fr;
+        column-gap: 5px;
-    grid-template-rows: 150px;
+        align-items: center;
+        margin: auto;
+    }
+
+    div.custom-grid-one {
+        margin: auto;
+        width: 100%;
+        grid-column: 1;
+        grid-row: 1;
+    }
+    div.custom-grid-one > div {
+        float: right !important;
+    }
+
+    div.custom-grid-two {
+        margin: auto 40px auto 40px;
+        grid-column: 2;
+        grid-row: 1;
+    }
+    div.custom-grid-three {
+        grid-column: 3;
+        grid-row: 1;
+        width: max-content;
+        white-space: nowrap;
+    }
+    div.custom-grid-four {
+        margin: 0 25px 0 auto;
+        grid-column: 4;
+        grid-row: 1;
+        white-space: nowrap;
+    }
+    div.custom-grid-five {
+        margin-right: auto;
+        grid-column: 5;
+        grid-row: 1;
+        white-space: nowrap;
+    }
+
 }
-div.custom-grid-one {
+@media (max-width: 768px) {
-    margin: auto;
+    div.header__main {
-    grid-column: 1;
+        display: grid !important;
-    grid-row: 1;
+        grid-template-rows: 1fr 60px 1fr;
+        grid-template-columns: 1fr 1fr;
+        text-align: center;
+        margin: auto;
+        width: max-content;
+        line-height: normal;
+    }
+    div.custom-grid-one {
+        grid-row: 1;
+        grid-column: 1 / 3;
+    }
+    .glyphicon-search:before {
+        display: none !important;
+    }
+    div.custom-grid-three {
+        grid-row: 3;
+        grid-column: 1 / 3;
+    }
+    div.custom-grid-four {
+        grid-row: 2;
+        grid-column: 1;
+    }
+    div.custom-grid-five {
+        grid-row: 2;
+        grid-column: 2;
+    }
 }
-div.custom-grid-two {
+
-    margin: auto;
+.menu-recettes {
-    grid-column: 2;
+    list-style: none;
-    grid-row: 1;
+    text-transform: uppercase;
+    font-size: 1.72rem;
+    line-height: 20px;
 }
-div.custom-grid-three {
+.menu-recettes > a {
-    margin: 0 25px 0 auto;
+    padding: 15px;
-    grid-column: 3;
+    color: #3c3c3b !important;
-    grid-row: 1;
-    white-space: nowrap;
 }
-div.custom-grid-four {
+.menu-recettes > a:hover {
-    margin-right: auto;
+    text-decoration: none;
-    grid-column: 4;
+    background-color: #95c11e;
-    grid-row: 1;
+    color: white !important;
-    white-space: nowrap;
 }
+
 .header__secondary {
     width: 90%;
     justify-content: center;
 }
+
+div.header__bottom {
+    text-align: center;
+}

templates/frontOffice/custom/layout.tpl

@@ -135,6 +135,9 @@ GNU General Public License : http://www.gnu.org/licenses/
                                     </a>
                                 </h1>
                             </div>
+                            <div class="custom-grid-three">
+                                <span class="menu-recettes"><a href="/nos-recettes.html">Nos recettes</a></span>
+                            </div>
                             {hook name="main.navbar-secondary"}
                         </div>
 

templates/frontOffice/custom/modules/HookCart/main-navbar-secondary.html

@@ -1,4 +1,4 @@
-<div class="custom-grid-four">
+<div class="custom-grid-five">
     <ul class="nav navbar-nav navbar-cart navbar-right">
         {hook name="mini-cart"}
     </ul>

templates/frontOffice/custom/modules/HookCustomer/main-navbar-secondary.html

@@ -1,4 +1,4 @@
-<div class="custom-grid-three">
+<div class="custom-grid-four">
     <ul class="nav navbar-nav navbar-customer navbar-right">
         {loop type="auth" name="customer_info_block" role="CUSTOMER"}
         <li><a href="{url path="/logout"}" class="logout">{intl l="Log out!" d="hookcustomer.fo.default"}</a></li>

templates/frontOffice/custom/modules/HookNavigation/main-navbar-primary.html

@@ -26,9 +26,6 @@
                     <li><a href="{$URL}">{$TITLE}</a></li>
                 {/if}
                 {/loop}
-
-                <li><a href="/nos-recettes.html">Nos recettes</a></li>
-
             </ul>
         </div>
     </div>

templates/frontOffice/custom/product.html

@@ -230,6 +230,11 @@
                             {/if}
                         </span>
                         {/elseloop}
+
+                        <div class="prix-au-kilo">
+                            <label>{intl l="Price per kg"}</label>
+                            <span>{format_money number=0 symbol={currency attr="symbol"}}</span>
+                        </div>
                     </div>
                     <!-- Affichage de l'unité (au kg, à l'unité) //-->
                     {if $pse_count == 1}