Squashed 'template/pages/' changes from 4437182..2dc9250

2dc9250 Update with @ecomplus/storefront-template v2.0.0-beta.164

git-subtree-dir: template/pages
git-subtree-split: 2dc925018e72830a4904dd0f2c1d824e95d9c86c

Author: actions-user

@/layout/header.ejs

@@ -43,6 +43,7 @@ if (header.categories_list) {
   }
   isCategoriesNavFull = header.categories_list.full_width
 }
+const hasMegamenu = header.desktop_megamenu
 %>
 
 <div id="overlay" class="fade"></div>
@@ -123,7 +124,7 @@ if (header.categories_list) {
     <div class="header__row row">
       <div class="col-auto p-0">
         <button
-          class="btn header__toggler"
+          class="btn header__toggler<%= hasMegamenu ? ' d-lg-none' : '' %>"
           type="button"
           onclick="toggleSidenav()"
           aria-label="Toggle side navigation"
@@ -254,10 +255,38 @@ if (header.categories_list) {
       <% if (categories && categories.length) { %>
         <div class="d-none d-lg-block <%= isCategoriesNavFull ? 'col-12 order-lg-last' : 'col' %>">
           <nav class="header__nav<%= isCategoriesNavFull ? ' header__nav--full' : '' %>">
-            <% categories.forEach(({ slug, name }) => { %>
-              <a href="javascript:;" onclick="toggleSidenav('<%= slug %>')">
-                <%= ` ${name} ` %>
-              </a>
+            <% categories.forEach(({ slug, name}) => { %>
+              <% let $categoryLink %>
+              <div class="d-inline-block">
+                <a
+                  href="javascript:;"
+                  class="header__category"
+                  <%- hasMegamenu
+                    ? `onmouseover="toggleSubmenu('${slug}', this)" onclick="toggleSubmenu('${slug}', this, true)"`
+                    : `onclick="toggleSidenav('${slug}')"` %>
+                >
+                  <%= name %>
+                </a>
+                <%- $categoryLink %>
+                <%  if (slug && hasMegamenu) { %>
+                  <% const subcategories = _.categories.filter(({ parent }) => parent && parent.slug === slug) %>
+                  <% if (subcategories.length) { %>
+                    <nav class="header__submenu" id="<%= `s-${slug.replace(/\//g, '_')}` %>">
+                      <% subcategories.forEach(subcategory => { %>
+                        <div>               
+                          <a href="<%= subcategory.slug %>"><%= subcategory.name %></a>
+                          <% const thirdCategories = _.categories.filter(({ parent }) => parent && parent.slug === subcategory.slug) %>
+                          <% thirdCategories.forEach(thirdCategory => { %>
+                            <a class="header__submenu-subcategory" href="<%= thirdCategory.slug %>">
+                              <%= thirdCategory.name %>
+                            </a>
+                          <% }) %>
+                        </div>
+                      <% }) %>
+                    </nav>
+                  <% } %>
+                <% } %>
+              </div>
             <% }) %>
           </nav>
         </div>

@/layout/menu.ejs

@@ -178,3 +178,4 @@ if (mainCategories) {
     <% } %>
   </footer>
 </aside>
+  

admin/index.ejs

@@ -32,9 +32,9 @@
   <% if (!_.settings.repository || !_.settings.repository.startsWith('ecomplus-stores/')) { %>
     <script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
   <% } %>
-  <script src="https://unpkg.com/netlify-cms-app/dist/netlify-cms-app.js"></script>
+  <script src="https://unpkg.com/@ecomplus/storefront-cms/dist/storefront-cms.min.js"></script>
   <script>
-    window.CMS = NetlifyCmsApp;
+    window.CMS = StorefrontCMS;
   </script>
 
   <%- await include('@/json', { _ }) %>