Skip to content

Commit c5281da

Browse files
committed
docs: Fix breadcrumb
1 parent 2e8fc0b commit c5281da

2 files changed

Lines changed: 6 additions & 6 deletions

File tree

docs/navs.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,10 @@
2525
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;Link&lt;/<b>a</b>&gt;&lt;/<b>li</b>&gt;
2626
&lt;/<b>ul</b>&gt;
2727
&lt;/<b>nav</b>&gt;
28-
&lt;/<b>aside</b>&gt;</code></pre></footer></article><p>With <code><i>aria-label</i>=<u>"breadcrumb"</u></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><i>aria-current</i>=<u>"page"</u></code>.</p><article aria-label="breadcrumb nav example"><nav aria-label="breadcrumb"><ul><li><a href="#">First link</a></li><li><a href="#">Second link</a></li><li><a aria-current="page">Last link</a></li></ul></nav><footer class="code"><pre><code>&lt;<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>&gt;
28+
&lt;/<b>aside</b>&gt;</code></pre></footer></article><p>With <code><i>aria-label</i>=<u>"breadcrumb"</u></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><i>aria-current</i>=<u>"page"</u></code>.</p><article aria-label="breadcrumb nav example"><nav aria-label="breadcrumb"><ul><li><a href="#" onclick="event.preventDefault()">First link</a></li><li><a href="#" onclick="event.preventDefault()">Second link</a></li><li><a href="#" onclick="event.preventDefault()" aria-current="page">Last link</a></li></ul></nav><footer class="code"><pre><code>&lt;<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>&gt;
2929
&lt;<b>ul</b>&gt;
3030
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;First link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
3131
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;Second link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
32-
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>aria-current</i>=<u>"page"</u>&gt;Last link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
32+
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u> <i>aria-current</i>=<u>"page"</u>&gt;Last link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
3333
&lt;<b>/ul</b>&gt;
3434
&lt;/<b>nav</b>&gt;</code></pre></footer></article></section><footer><hr><p><small>Code licensed <a href="https://github.com/picocss/pico/blob/master/LICENSE.md" class="secondary">MIT</a></small></p></footer></div></main><script src="js/commons.min.js"></script></body></html>

docs/src/navs.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -123,13 +123,13 @@ <h2>The essential navbar component in pure semantic HTML.</h2>
123123
<nav aria-label="breadcrumb">
124124
<ul>
125125
<li>
126-
<a href="#">First link</a>
126+
<a href="#" onclick="event.preventDefault()">First link</a>
127127
</li>
128128
<li>
129-
<a href="#">Second link</a>
129+
<a href="#" onclick="event.preventDefault()">Second link</a>
130130
</li>
131131
<li>
132-
<a aria-current="page">
132+
<a href="#" onclick="event.preventDefault()" aria-current="page" >
133133
Last link
134134
</a>
135135
</li>
@@ -142,7 +142,7 @@ <h2>The essential navbar component in pure semantic HTML.</h2>
142142
&lt;<b>ul</b>&gt;
143143
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;First link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
144144
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u>&gt;Second link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
145-
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>aria-current</i>=<u>"page"</u>&gt;Last link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
145+
&lt;<b>li</b>&gt;&lt;<b>a</b> <i>href</i>=<u>"#"</u> <i>aria-current</i>=<u>"page"</u>&gt;Last link&lt;<b>/a</b>&gt;&lt;<b>/li</b>&gt;
146146
&lt;<b>/ul</b>&gt;
147147
&lt;/<b>nav</b>&gt;</code></pre>
148148

0 commit comments

Comments
 (0)