docs: Style of code snippets

This commit is contained in:
Lucas Larroche 2022-09-11 14:00:44 +07:00
parent 22767f6361
commit 132b499db2
2 changed files with 4 additions and 3 deletions

View file

@ -25,7 +25,7 @@
&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; &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;
&lt;/<b>ul</b>&gt; &lt;/<b>ul</b>&gt;
&lt;/<b>nav</b>&gt; &lt;/<b>nav</b>&gt;
&lt;/<b>aside</b>&gt;</code></pre></footer></article><p>With <code><b>aria-label="breadcrumb"</b></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><b>aria-current="page"</b></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; &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;
&lt;<b>ul</b>&gt; &lt;<b>ul</b>&gt;
&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; &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;
&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; &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;

View file

@ -117,7 +117,7 @@
</footer> </footer>
</article> </article>
<p>With <code><b>aria-label="breadcrumb"</b></code>, you can turn a nav into a breadcrumb, specifying the current page with: <code><b>aria-current="page"</b></code>.</p> <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"> <article aria-label="breadcrumb nav example">
<nav aria-label="breadcrumb"> <nav aria-label="breadcrumb">
@ -138,13 +138,14 @@
<footer class="code"> <footer class="code">
<pre><code>&lt;<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>&gt; <pre><code>&lt;<b>nav</b> <i>aria-label</i>=<u>"breadcrumb"</u>&gt;
&lt;<b>ul</b>&gt; &lt;<b>ul</b>&gt;
&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; &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;
&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; &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;
&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; &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;
&lt;<b>/ul</b>&gt; &lt;<b>/ul</b>&gt;
&lt;/<b>nav</b>&gt;</code></pre> &lt;/<b>nav</b>&gt;</code></pre>
</footer> </footer>
</article> </article>