Add WAI permalink structure part 1 of 2

w3c · May 12, 2022 · b33c782 · b33c782
1 parent 56c4529
commit b33c782
Show file tree

Hide file tree

Showing 310 changed files with 2,047 additions and 1,220 deletions.
diff --git a/.../APG/example-index/accordion/accordion.md → .../APG/example-index/accordion/accordion.md b/.../APG/example-index/accordion/accordion.md → .../APG/example-index/accordion/accordion.md
@@ -1,14 +1,14 @@
 ---
 # This is a generated file
 title: "Accordion Example"
-ref: /WAI/ARIA/APG/example-index/accordion/accordion
+ref: /ARIA/APG/example-index/accordion/accordion
 
 github:
   repository: w3c/aria-practices
   branch: main
   path: examples/accordion/accordion.html
 feedbackmail: [email protected]
-permalink: /WAI/ARIA/APG/example-index/accordion/accordion
+permalink: /ARIA/APG/example-index/accordion/accordion
 
 sidebar: true
 
@@ -26,9 +26,15 @@ lang: en
 <link rel="stylesheet" type="text/css" href="css/accordion.css" />
 
 
-<link rel="stylesheet" href="/content-assets/wai-aria-practices/styles.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/content-assets/wai-aria-practices/styles.css' | relative_url }}"
+>
 <!-- Code highlighting styles -->
-<link rel="stylesheet" href="/WAI/ARIA/APG/example-index/css/github.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/ARIA/APG/example-index/css/github.css' | relative_url }}"
+>
 
 <script>
 const addBodyClass = undefined;
@@ -48,8 +54,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     <ul>
     <li>
         There may be support gaps in some
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#browser_and_AT_support">browser and assistive technology combinations</a>,
-        especially for <a href="/WAI/ARIA/APG/practices/read-me-first/#mobile_and_touch_support">mobile/touch devices</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#browser_and_AT_support' | relative_url }}">browser and assistive technology combinations</a>,
+        especially for <a href="{{ '/ARIA/APG/practices/read-me-first/#mobile_and_touch_support' | relative_url }}">mobile/touch devices</a>.
         Testing code based on this example with assistive technologies is essential before considering use in production systems.
     </li>
     <li>
@@ -60,12 +66,12 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         Robust accessibility can be further optimized by choosing implementation patterns that
         <a href="https://www.w3.org/TR/using-aria/#rule1">maximize use of semantic HTML</a>
         and heeding the warning that
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria">No ARIA is better than Bad ARIA</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria' | relative_url }}">No ARIA is better than Bad ARIA</a>.
     </li>
     </ul>
 </details>
           <img alt=""
-          src="/content-images/wai-aria-practices/img/accordion.svg"
+          src="{{ '/content-images/wai-aria-practices/img/accordion.svg' | relative_url }}"
           class="example-page-example-icon"
         >
 
@@ -74,7 +80,7 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
   <p>
     The below example section contains a simple personal information input form divided into 3 sections
     that demonstrates the
-    <a href="/WAI/ARIA/APG/patterns/accordion/">design pattern for accordion</a>.
+    <a href="{{ '/ARIA/APG/patterns/accordion/' | relative_url }}">design pattern for accordion</a>.
   </p>
   <section>
     <div class="example-header">
@@ -335,4 +341,6 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     }
   };
 </script>
-<script src="/content-assets/wai-aria-practices/skipto.min.js"></script>
+<script 
+  src="{{ '/content-assets/wai-aria-practices/skipto.min.js' | relative_url }}"
+></script>
diff --git a/...example-index/accordion/css/accordion.css → ...example-index/accordion/css/accordion.css b/...example-index/accordion/css/accordion.css → ...example-index/accordion/css/accordion.css
diff --git a/...G/example-index/accordion/js/accordion.js → ...G/example-index/accordion/js/accordion.js b/...G/example-index/accordion/js/accordion.js → ...G/example-index/accordion/js/accordion.js
diff --git a/WAI/ARIA/APG/example-index/alert/alert.md → ARIA/APG/example-index/alert/alert.md b/WAI/ARIA/APG/example-index/alert/alert.md → ARIA/APG/example-index/alert/alert.md
@@ -1,14 +1,14 @@
 ---
 # This is a generated file
 title: "Alert Example"
-ref: /WAI/ARIA/APG/example-index/alert/alert
+ref: /ARIA/APG/example-index/alert/alert
 
 github:
   repository: w3c/aria-practices
   branch: main
   path: examples/alert/alert.html
 feedbackmail: [email protected]
-permalink: /WAI/ARIA/APG/example-index/alert/alert
+permalink: /ARIA/APG/example-index/alert/alert
 
 sidebar: true
 
@@ -27,9 +27,15 @@ lang: en
 <script src="js/alert.js" type="text/javascript"></script>
 
 
-<link rel="stylesheet" href="/content-assets/wai-aria-practices/styles.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/content-assets/wai-aria-practices/styles.css' | relative_url }}"
+>
 <!-- Code highlighting styles -->
-<link rel="stylesheet" href="/WAI/ARIA/APG/example-index/css/github.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/ARIA/APG/example-index/css/github.css' | relative_url }}"
+>
 
 <script>
 const addBodyClass = undefined;
@@ -49,8 +55,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     <ul>
     <li>
         There may be support gaps in some
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#browser_and_AT_support">browser and assistive technology combinations</a>,
-        especially for <a href="/WAI/ARIA/APG/practices/read-me-first/#mobile_and_touch_support">mobile/touch devices</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#browser_and_AT_support' | relative_url }}">browser and assistive technology combinations</a>,
+        especially for <a href="{{ '/ARIA/APG/practices/read-me-first/#mobile_and_touch_support' | relative_url }}">mobile/touch devices</a>.
         Testing code based on this example with assistive technologies is essential before considering use in production systems.
     </li>
     <li>
@@ -61,19 +67,19 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         Robust accessibility can be further optimized by choosing implementation patterns that
         <a href="https://www.w3.org/TR/using-aria/#rule1">maximize use of semantic HTML</a>
         and heeding the warning that
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria">No ARIA is better than Bad ARIA</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria' | relative_url }}">No ARIA is better than Bad ARIA</a>.
     </li>
     </ul>
 </details>
           <img alt=""
-          src="/content-images/wai-aria-practices/img/alert.svg"
+          src="{{ '/content-images/wai-aria-practices/img/alert.svg' | relative_url }}"
           class="example-page-example-icon"
         >
 
     <div>
 
     <p>
-      The below example demonstrates the <a href="/WAI/ARIA/APG/patterns/alert/">design pattern for alert</a>.
+      The below example demonstrates the <a href="{{ '/ARIA/APG/patterns/alert/' | relative_url }}">design pattern for alert</a>.
       Activating the <q>Trigger Alert</q> button causes a message to be inserted into the example alert element.
     </p>
     <p>Similar examples include:</p>
@@ -198,4 +204,6 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     }
   };
 </script>
-<script src="/content-assets/wai-aria-practices/skipto.min.js"></script>
+<script 
+  src="{{ '/content-assets/wai-aria-practices/skipto.min.js' | relative_url }}"
+></script>
diff --git a/...RIA/APG/example-index/alert/css/alert.css → ARIA/APG/example-index/alert/css/alert.css b/...RIA/APG/example-index/alert/css/alert.css → ARIA/APG/example-index/alert/css/alert.css
diff --git a/WAI/ARIA/APG/example-index/alert/js/alert.js → ARIA/APG/example-index/alert/js/alert.js b/WAI/ARIA/APG/example-index/alert/js/alert.js → ARIA/APG/example-index/alert/js/alert.js
diff --git a/...ample-index/breadcrumb/css/breadcrumb.css → ...ample-index/breadcrumb/css/breadcrumb.css b/...ample-index/breadcrumb/css/breadcrumb.css → ...ample-index/breadcrumb/css/breadcrumb.css
diff --git a/...RIA/APG/example-index/breadcrumb/index.md → ARIA/APG/example-index/breadcrumb/index.md b/...RIA/APG/example-index/breadcrumb/index.md → ARIA/APG/example-index/breadcrumb/index.md
@@ -1,14 +1,14 @@
 ---
 # This is a generated file
 title: "Breadcrumb Example"
-ref: /WAI/ARIA/APG/example-index/breadcrumb/index
+ref: /ARIA/APG/example-index/breadcrumb/index
 
 github:
   repository: w3c/aria-practices
   branch: main
   path: examples/breadcrumb/index.html
 feedbackmail: [email protected]
-permalink: /WAI/ARIA/APG/example-index/breadcrumb/index
+permalink: /ARIA/APG/example-index/breadcrumb/index
 
 sidebar: true
 
@@ -26,9 +26,15 @@ lang: en
 <link href="css/breadcrumb.css" rel="stylesheet" />
 
 
-<link rel="stylesheet" href="/content-assets/wai-aria-practices/styles.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/content-assets/wai-aria-practices/styles.css' | relative_url }}"
+>
 <!-- Code highlighting styles -->
-<link rel="stylesheet" href="/WAI/ARIA/APG/example-index/css/github.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/ARIA/APG/example-index/css/github.css' | relative_url }}"
+>
 
 <script>
 const addBodyClass = undefined;
@@ -48,8 +54,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     <ul>
     <li>
         There may be support gaps in some
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#browser_and_AT_support">browser and assistive technology combinations</a>,
-        especially for <a href="/WAI/ARIA/APG/practices/read-me-first/#mobile_and_touch_support">mobile/touch devices</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#browser_and_AT_support' | relative_url }}">browser and assistive technology combinations</a>,
+        especially for <a href="{{ '/ARIA/APG/practices/read-me-first/#mobile_and_touch_support' | relative_url }}">mobile/touch devices</a>.
         Testing code based on this example with assistive technologies is essential before considering use in production systems.
     </li>
     <li>
@@ -60,18 +66,18 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         Robust accessibility can be further optimized by choosing implementation patterns that
         <a href="https://www.w3.org/TR/using-aria/#rule1">maximize use of semantic HTML</a>
         and heeding the warning that
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria">No ARIA is better than Bad ARIA</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria' | relative_url }}">No ARIA is better than Bad ARIA</a>.
     </li>
     </ul>
 </details>
           <img alt=""
-          src="/content-images/wai-aria-practices/img/breadcrumb.svg"
+          src="{{ '/content-images/wai-aria-practices/img/breadcrumb.svg' | relative_url }}"
           class="example-page-example-icon"
         >
 
     <div>
 
-    <p>The following example demonstrates the <a href="/WAI/ARIA/APG/patterns/breadcrumb/">breadcrumb design pattern</a>.</p>
+    <p>The following example demonstrates the <a href="{{ '/ARIA/APG/patterns/breadcrumb/' | relative_url }}">breadcrumb design pattern</a>.</p>
     <section>
       <div class="example-header">
         <h2 id="ex_label">Example</h2>
@@ -84,10 +90,10 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
               <a href="../../">WAI-ARIA Authoring Practices</a>
             </li>
             <li>
-              <a href="undefined">Design Patterns</a>
+              <a href="{{ '/ARIA/APG/patterns/' | relative_url }}">Design Patterns</a>
             </li>
             <li>
-              <a href="/WAI/ARIA/APG/patterns/breadcrumb/">Breadcrumb Pattern</a>
+              <a href="{{ '/ARIA/APG/patterns/breadcrumb/' | relative_url }}">Breadcrumb Pattern</a>
             </li>
             <li>
               <a href="index.html" aria-current="page">Breadcrumb Example</a>
@@ -196,4 +202,6 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     }
   };
 </script>
-<script src="/content-assets/wai-aria-practices/skipto.min.js"></script>
+<script 
+  src="{{ '/content-assets/wai-aria-practices/skipto.min.js' | relative_url }}"
+></script>
diff --git a/WAI/ARIA/APG/example-index/button/button.md → ARIA/APG/example-index/button/button.md b/WAI/ARIA/APG/example-index/button/button.md → ARIA/APG/example-index/button/button.md
@@ -1,14 +1,14 @@
 ---
 # This is a generated file
 title: "Button Examples"
-ref: /WAI/ARIA/APG/example-index/button/button
+ref: /ARIA/APG/example-index/button/button
 
 github:
   repository: w3c/aria-practices
   branch: main
   path: examples/button/button.html
 feedbackmail: [email protected]
-permalink: /WAI/ARIA/APG/example-index/button/button
+permalink: /ARIA/APG/example-index/button/button
 
 sidebar: true
 
@@ -27,9 +27,15 @@ lang: en
 <script src="js/button.js"></script>
 
 
-<link rel="stylesheet" href="/content-assets/wai-aria-practices/styles.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/content-assets/wai-aria-practices/styles.css' | relative_url }}"
+>
 <!-- Code highlighting styles -->
-<link rel="stylesheet" href="/WAI/ARIA/APG/example-index/css/github.css">
+<link 
+  rel="stylesheet"
+  href="{{ '/ARIA/APG/example-index/css/github.css' | relative_url }}"
+>
 
 <script>
 const addBodyClass = undefined;
@@ -49,8 +55,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     <ul>
     <li>
         There may be support gaps in some
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#browser_and_AT_support">browser and assistive technology combinations</a>,
-        especially for <a href="/WAI/ARIA/APG/practices/read-me-first/#mobile_and_touch_support">mobile/touch devices</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#browser_and_AT_support' | relative_url }}">browser and assistive technology combinations</a>,
+        especially for <a href="{{ '/ARIA/APG/practices/read-me-first/#mobile_and_touch_support' | relative_url }}">mobile/touch devices</a>.
         Testing code based on this example with assistive technologies is essential before considering use in production systems.
     </li>
     <li>
@@ -61,12 +67,12 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         Robust accessibility can be further optimized by choosing implementation patterns that
         <a href="https://www.w3.org/TR/using-aria/#rule1">maximize use of semantic HTML</a>
         and heeding the warning that
-        <a href="/WAI/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria">No ARIA is better than Bad ARIA</a>.
+        <a href="{{ '/ARIA/APG/practices/read-me-first/#no_aria_better_bad_aria' | relative_url }}">No ARIA is better than Bad ARIA</a>.
     </li>
     </ul>
 </details>
           <img alt=""
-          src="/content-images/wai-aria-practices/img/button.svg"
+          src="{{ '/content-images/wai-aria-practices/img/button.svg' | relative_url }}"
           class="example-page-example-icon"
         >
 
@@ -75,7 +81,7 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
 
     <p>
-      The following command and toggle button examples demonstrate the <a href="/WAI/ARIA/APG/patterns/button/">button design pattern.</a>
+      The following command and toggle button examples demonstrate the <a href="{{ '/ARIA/APG/patterns/button/' | relative_url }}">button design pattern.</a>
     </p>
 
     <p>Similar examples include:</p>
@@ -271,4 +277,6 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
     }
   };
 </script>
-<script src="/content-assets/wai-aria-practices/skipto.min.js"></script>
+<script 
+  src="{{ '/content-assets/wai-aria-practices/skipto.min.js' | relative_url }}"
+></script>