Clear naming

Author: RoyalIcing

assets/js/customElements/enhanced-navigation.js

@@ -16,7 +16,7 @@ customElements.define('enhanced-navigation', class extends HTMLElement {
       const aside = this.querySelector('aside');
       aside.hidden = false;
 
-      const navItemsSlot = this.querySelector('slot[name=nav-items]');
+      const navItemsSlot = this.querySelector('slot[name=article-navigation-items]');
       const navItemsTemplates = navItemsSlot.querySelector('template').content;
       const linkTemplate = navItemsTemplates.querySelector('a');
       const ulTemplate = navItemsTemplates.querySelector('ul');

assets/js/customElements/navigable-article.js

@@ -14,7 +14,7 @@ customElements.define('navigable-article', class extends HTMLElement {
     const aside = this.querySelector('aside');
     aside.hidden = false;
 
-    const navItemsSlot = this.querySelector('slot[name=nav-items]');
+    const navItemsSlot = this.querySelector('slot[name=article-navigation-items]');
     const navItemsTemplates = navItemsSlot.querySelector('template').content;
     const linkTemplate = navItemsTemplates.querySelector('a');
     const ulTemplate = navItemsTemplates.querySelector('ul');

lib/components_guide_web/templates/accessibility_first/index.html.heex

@@ -11,7 +11,7 @@
     <aside class="sticky top-0 h-screen hidden xl:block" hidden>
       <nav class="pt-16 text-gray-200">
         <div class="pl-5 pb-2 font-bold uppercase text-white">On this page</div>
-        <slot name="nav-items">
+        <slot name="article-navigation-items">
           <template>
             <ul class="list-none">
               <li class="border-l-4 border-gray-800 hover:border-blue-400"></li>

lib/components_guide_web/templates/react_typescript/index.html.eex

@@ -11,7 +11,7 @@
     <aside class="sticky top-0 h-screen hidden xl:block" hidden>
       <nav class="pt-16 text-gray-200">
         <div class="pl-5 pb-2 font-bold uppercase text-white">On this page</div>
-        <slot name="nav-items">
+        <slot name="article-navigation-items">
           <template>
             <ul class="list-none">
               <li class="border-l-4 border-gray-800 hover:border-blue-400"></li>

lib/components_guide_web/templates/robust_javascript_interactivity/index.html.eex

@@ -11,7 +11,7 @@
     <aside class="sticky top-0 h-screen hidden xl:block" hidden>
       <nav class="pt-16 text-gray-200">
         <div class="pl-5 pb-2 font-bold uppercase text-white">On this page</div>
-        <slot name="nav-items">
+        <slot name="article-navigation-items">
           <template>
             <ul class="list-none">
               <li class="border-l-4 border-gray-800 hover:border-blue-400"></li>