diff options
author | Geoffrey Eisenbarth <geoffrey.eisenbarth@gmail.com> | 2024-10-29 07:31:09 -0500 |
---|---|---|
committer | Geoffrey Eisenbarth <geoffrey.eisenbarth@gmail.com> | 2024-10-29 07:31:09 -0500 |
commit | de89ab8b6c2cfdbc632fcbe10425139b612ff959 (patch) | |
tree | 7b3edcc91766e921bc95b437bd32a6b6d55086e8 | |
parent | 4bb5e633d5bfef45e866e506d6effe680ebb3c27 (diff) | |
parent | 97451eaafcd147a5e9d74ac6ff30969bc299c7fd (diff) | |
download | missing-de89ab8b6c2cfdbc632fcbe10425139b612ff959.tar.gz missing-de89ab8b6c2cfdbc632fcbe10425139b612ff959.zip |
Merge branch 'dev' of github.com:bigskysoftware/missing into dev
-rw-r--r-- | www/demos/feed.html | 38 | ||||
-rw-r--r-- | www/docs/40-aria.md | 20 | ||||
-rw-r--r-- | www/docs/B0-js.md | 4 |
3 files changed, 31 insertions, 31 deletions
diff --git a/www/demos/feed.html b/www/demos/feed.html index 18990a7..fef16b7 100644 --- a/www/demos/feed.html +++ b/www/demos/feed.html @@ -6,7 +6,7 @@ name: Feed <main> <h1>Feeds</h1> - <script type="module" src="/missing-js/feed.js"></script> + <script type="module" src="/dist/js/feed.js"></script> <p> Keyboard navigation: @@ -21,18 +21,18 @@ name: Feed </p> <a href="#">A focusable element before the feeds</a> <div role="feed"> - <article class="box"> - <h2>Article 1</h2> + <article class="box" aria-labelledby="f1-a1-label"> + <h2 id="f1-a1-label">Article 1</h2> <p>Some content for the article.</p> <a href="#">A focusable link</a> </article> - <article class="box"> - <h2>Article 2</h2> + <article class="box" aria-labelledby="f1-a2-label"> + <h2 id="f1-a2-label">Article 2</h2> <p>Some content for the article.</p> <a href="#">A focusable link</a> </article> - <article class="box"> - <h2>Article 3</h2> + <article class="box" aria-labelledby="f1-a3-label"> + <h2 id="f1-a3-label">Article 3</h2> <p>Some content for the article.</p> <a href="#">A focusable link</a> </article> @@ -41,35 +41,35 @@ name: Feed <a href="#">A focusable element betweeen feeds</a> <div role="feed"> - <article class="box"> - <h2>Article 1</h2> + <article class="box" aria-labelledby="f2-a1-label"> + <h2 id="f2-a1-label">Article 1</h2> <p>Some content for the article.</p> <a href="#">A focusable link</a> <div role="feed"> - <article class="box ok"> - <h3>Comment #1</h3> + <article class="box ok" aria-labelledby="f2-a1-c1-label"> + <h3 id="f2-a1-c1-label">Comment #1</h3> <p>Some content for the comment.</p> <a href="#">Link 1</a> <a href="#">Link 2</a> </article> - <article class="box ok"> - <h3>Comment #2</h3> + <article class="box ok" aria-labelledby="f2-a1-c2-label"> + <h3 id="f2-a1-c2-label">Comment #2</h3> <p>Some content for the comment.</p> <a href="#">Link 1</a> <a href="#">Link 2</a> </article> </div> </article> - <article class="box"> - <h2>Article 2</h2> + <article class="box" aria-labelledby="f2-a2-label"> + <h2 id="f2-a2-label">Article 2</h2> <p>Some content for the article.</p> <a href="#">A focusable link</a> <div role="feed"> - <article class="box ok"> - <h3>Comment #1</h3> + <article class="box ok" aria-labelledby="f2-a2-c1-label"> + <h3 id="f2-a2-c1-label">Comment #1</h3> <p>Some content for the comment.</p> <a href="#">Link 1</a> <a href="#">Link 2</a> </article> - <article class="box ok"> - <h3>Comment #2</h3> + <article class="box ok" aria-labelledby="f2-a2-c2-label"> + <h3 id="f2-a2-c2-label">Comment #2</h3> <p>Some content for the comment.</p> <a href="#">Link 1</a> <a href="#">Link 2</a> </article> diff --git a/www/docs/40-aria.md b/www/docs/40-aria.md index 92da6f3..6c02abd 100644 --- a/www/docs/40-aria.md +++ b/www/docs/40-aria.md @@ -173,30 +173,30 @@ To get the actual behavior of an accessible feed, you can use [Missing.js § ~~~ html <div role="feed"> - <article class="box"> - <h2>Article Title 1</h2> + <article class="box" aria-labelledby="article-1-label"> + <h2 id="article-1-label">Article Title 1</h2> <p>Article content</p> </article> - <article class="box"> - <h2>Article Title 2</h2> + <article class="box" aria-labelledby="article-2-label"> + <h2 id="article-2-label">Article Title 2</h2> <p>Article content</p> </article> </div> ~~~ <div> - <script type="module" src="/missing-js/feed.js"></script> + <script type="module" src="/dist/js/feed.js"></script> <div role="feed"> - <article class="box"> - <h2>Article Title 1</h2> + <article class="box" aria-labelledby="article-1-label"> + <h2 id="article-1-label">Article Title 1</h2> <p>Article content</p> </article> - <article class="box"> - <h2>Article Title 2</h2> + <article class="box" aria-labelledby="article-2-label"> + <h2 id="article-2-label">Article Title 2</h2> <p>Article content</p> </article> </div> </figure> -[WAI: Menu]: https://www.w3.org/WAI/ARIA/apg/patterns/feed/ +[WAI: Feed]: https://www.w3.org/WAI/ARIA/apg/patterns/feed/ diff --git a/www/docs/B0-js.md b/www/docs/B0-js.md index 910afaf..ffc81aa 100644 --- a/www/docs/B0-js.md +++ b/www/docs/B0-js.md @@ -97,7 +97,7 @@ _See [ARIA § feed](/docs/aria/#feed)_ <figure> ~~~ html - <script type="module" src="https://unpkg.com/missing.css@{{ version }}/js/feed.js"> + <script type="module" src="https://unpkg.com/missing.css@{{ version }}/dist/js/feed.js"> ~~~ </figure> @@ -107,7 +107,7 @@ or <figure> ~~~js - import { menu, menuButton } from "https://unpkg.com/missing.css@{{ version }}/js/feed.js"; + import { feed } from "https://unpkg.com/missing.css@{{ version }}/dist/js/feed.js"; ~~~ </figure> |