[object Object]

← back to Dw Theme Frontpage Cta

auto-save: 2026-07-20T16:33:10 (1 files) — snippets/mobile-nav.liquid

6a22e98162f5dd1b2c1d13ec3aac947644db80f3 · 2026-07-20 16:33:16 -0700 · Steve Abrams

Files touched

Diff

commit 6a22e98162f5dd1b2c1d13ec3aac947644db80f3
Author: Steve Abrams <steve@designerwallcoverings.com>
Date:   Mon Jul 20 16:33:16 2026 -0700

    auto-save: 2026-07-20T16:33:10 (1 files) — snippets/mobile-nav.liquid
---
 snippets/mobile-nav.liquid | 135 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 135 insertions(+)

diff --git a/snippets/mobile-nav.liquid b/snippets/mobile-nav.liquid
new file mode 100644
index 0000000..2cb5782
--- /dev/null
+++ b/snippets/mobile-nav.liquid
@@ -0,0 +1,135 @@
+<nav class="navigation navigation-mobile navigation-has-mega-nav" data-navigation-content>
+  <ul class="navigation-menu">
+    <li class="mobile-link mobile-link--utility mobile-link--primary">
+      <a href="/pages/custom">Custom Walls</a>
+    </li>
+    <li class="mobile-link mobile-link--utility mobile-link--primary">
+      <a href="/pages/trade-only-benefits">Apply for a Trade Account</a>
+    </li>
+    <li class="mobile-link mobile-nav-divider" aria-hidden="true"></li>
+
+    {% for link in linklists[section.settings.menu].links %}
+      {% assign first_tier_link = link %}
+      {% assign uses_blocks = true %}
+      {% comment %}Inject is-dropdown-or-meganav begin{% endcomment %}
+      {% comment %}
+        A helper snippet for detecting if a link has a mega nav
+        or dropdown associated with it.
+      
+        @param first_tier_link
+      
+        @param uses_blocks
+      {% endcomment %}
+      
+      {% assign is_dropdown = false %}
+      {% assign is_meganav = true %}
+      
+      {% if first_tier_link.links == blank %}
+        {% assign is_meganav = false %}
+      {% else %}
+        {% assign is_dropdown = true %}
+      {% endif %}
+      
+      {% for second_tier_link in first_tier_link.links %}
+        {% if second_tier_link.links == blank %}
+          {% assign is_meganav = false %}
+        {% else %}
+          {% assign is_dropdown = true %}
+        {% endif %}
+      {% endfor %}
+      
+      {% if is_meganav %}
+        {% assign is_dropdown = false %}
+      {% endif %}
+      
+      {% if uses_blocks %}
+        {% assign found_mega_item_handle = false %}
+        {% if section != blank and section.blocks != blank %}
+          {% for block in section.blocks %}
+            {% if block.type == 'mega_menu' %}
+              {% assign menu_item_handle = block.settings.menu_item | handle %}
+              {% if first_tier_link.handle == menu_item_handle %}
+                {% assign found_mega_item_handle = true %}
+              {% endif %}
+            {% endif %}
+          {% endfor %}
+        {% endif %}
+      
+        {% if found_mega_item_handle %}
+          {% if is_dropdown %}
+            {% assign is_meganav = true %}
+            {% assign is_dropdown = false %}
+          {% endif %}
+        {% elsif found_mega_item_handle == false %}
+          {% if is_meganav %}
+            {% assign is_meganav = false %}
+            {% assign is_dropdown = true %}
+          {% endif %}
+        {% else %}
+          {% if is_meganav %}
+            {% assign is_meganav = false %}
+            {% assign is_dropdown = true %}
+          {% endif %}
+        {% endif %}
+      {% endif %}
+      {% comment %}Inject is-dropdown-or-meganav end{% endcomment %}
+
+
+      <li
+        class="{% if is_dropdown %}has-dropdown{% elsif is_meganav %}has-mega-nav{% endif %}"
+        {% if is_meganav %}data-mega-nav="true"{% endif %}
+      >
+        <a
+          id="mobile-navigation-{{ link.handle }}"
+          class="navigation-menu-link"
+          href="{{ link.url }}"
+          {% if is_dropdown or is_meganav %}aria-haspopup{% endif %}
+        >
+          {{ link.title }}
+          {% if is_dropdown or is_meganav %}
+            <span
+              class="navigation-submenu-toggle"
+              tabIndex="0"
+              role="button"
+              aria-controls="navigation-{{ link.handle }}"
+              aria-expanded="false"
+              aria-label="{{ 'general.accessibility.toggle' | t }}"
+              data-subnav-toggle
+            >
+              {{- arrow_right -}}
+            </span>
+          {% endif %}
+        </a>
+
+        {% if is_dropdown %}
+          {% assign direction = 'right' %}
+          {% assign halfway = linklists[section.settings.menu].links.size | divided_by: 2 %}
+          {% if forloop.index0 > halfway %}
+            {% assign direction = 'left' %}
+          {% endif %}
+
+          {%- render 'mobile-dropdown', direction: direction, link: link -%}
+        {% elsif is_meganav %}
+          {%- render 'mega-nav', link: link -%}
+        {% endif %}
+      </li>
+    {% endfor %}
+
+    {% if shop.customer_accounts_enabled %}
+      {% if customer %}
+        <li class="mobile-link">
+          <a href="{{ routes.account_url }}">
+            {{ 'layout.header.my_account' | t }}
+          </a>
+        </li>
+        <li class="mobile-link">
+          {{ 'layout.header.logout' | t | customer_logout_link }}
+        </li>
+      {% else %}
+        <li class="mobile-link">
+          <a class="customer-login-link" href="{{ routes.account_login_url }}">{{ 'layout.header.account' | t }}</a>
+        </li>
+      {% endif %}
+    {% endif %}
+  </ul>
+</nav>
\ No newline at end of file

← 23db9fe hero: promote lone Sign Up Now pill to filled primary button  ·  back to Dw Theme Frontpage Cta  ·  (newest)