Replaced emoji for special page nav link with text (#12728)

* Replaced emoji for special page nav link with text * Created a template fragment to render notes for menu link to special page
MozillaFoundation · Aug 28, 2024 · 2eef82e · 2eef82e
1 parent 1f30b2a
commit 2eef82e
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 18 deletions.
diff --git a/network-api/networkapi/templates/tags/horizontal_nav.html b/network-api/networkapi/templates/tags/horizontal_nav.html
@@ -5,7 +5,7 @@
     {% for entry in menu_pages %}
         {% pageurl entry.page as entry_page_url %}
         {% if entry.depth < 2 %}
-            <a class="multipage-link {% if current_page_url == entry_page_url %}active{% endif %} {% if entry.restriction != None %}multipage-{{ entry.restriction }}-restricted{% endif %} {% if not entry.page.live %}multipage-draft{% endif %}" href="{% pageurl entry.page %}">{{ entry.menu_title }}</a>
+            <a class="multipage-link {% if current_page_url == entry_page_url %}active{% endif %}" href="{% pageurl entry.page %}">{{ entry.menu_title }} {% include "tags/multipage_menu_link_note.html" with menu_entry=entry %}</a>
         {% endif %}
     {% endfor %}
 </div>
diff --git a/network-api/networkapi/templates/tags/multipage_menu_link_note.html b/network-api/networkapi/templates/tags/multipage_menu_link_note.html
@@ -0,0 +1,18 @@
+{% load i18n %}
+
+{% with class="tw-text-red-80 tw-text-sm tw-ml-1" %}
+    {% comment %}These notes are internal facing only. Only logged in users can see them.{% endcomment %}
+
+    {% if menu_entry.restriction == "login" %}
+        <span class="{{ class }}">(logged in users only)</span>
+    {% elif menu_entry.restriction == "groups" %}
+        <span class="{{ class }}">(restricted to specific groups)</span>
+    {% elif menu_entry.restriction == "password" %}
+        <span class="{{ class }}">(password protected)</span>
+    {% endif %}
+
+    {% if not menu_entry.page.live %}
+        <span class="{{ class }}">(draft)</span>
+    {% endif %}
+
+{% endwith %}
diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/mini_site_sidebar.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/mini_site_sidebar.html
@@ -7,7 +7,7 @@
             {% for entry in menu_pages %}
                 {% pageurl entry.page as entry_page_url %}
                 <div class="multipage-link-wrapper">
-                    <a class="multipage-link {% if current_page_url == entry_page_url %}active{% endif %} {% if entry.restriction != None %}multipage-{{ entry.restriction }}-restricted{% endif %} {% if not entry.page.live %}multipage-draft{% endif %}" href="{% pageurl entry.page %}">{% if entry.depth == 2 %}→ {% endif %}{{ entry.menu_title }}
+                    <a class="multipage-link {% if current_page_url == entry_page_url %}active{% endif %} {% if entry.restriction != None %}multipage-{{ entry.restriction }}-restricted{% endif %} {% if not entry.page.live %}multipage-draft{% endif %}" href="{% pageurl entry.page %}">{% if entry.depth == 2 %}→ {% endif %}{{ entry.menu_title }} {% include "tags/multipage_menu_link_note.html" with menu_entry=entry %}
                     </a>
                 </div>
             {% endfor %}

diff --git a/source/sass/components/multipage-nav.scss b/source/sass/components/multipage-nav.scss
@@ -36,20 +36,4 @@
       @apply tw-mb-12;
     }
   }
-
-  .multipage-login-restricted::after {
-    content: "🙈";
-  }
-
-  .multipage-groups-restricted::after {
-    content: "👥";
-  }
-
-  .multipage-password-restricted::after {
-    content: "🔒";
-  }
-
-  .multipage-draft::after {
-    content: "🐣";
-  }
 }