mirrors/picocss
1
0
Fork 0
mirror of https://github.com/picocss/pico.git synced 2025-04-22 17:36:15 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

docs(nav): Add role=button example

Browse source
This commit is contained in:
Lucas Larroche 2022-03-06 16:44:29 +07:00
parent 6cbc258a0d
commit 43cacb0b93
15 changed files with 36 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

5
css/pico.classless.css
View file

@ -1887,6 +1887,11 @@ nav :where(a, [role="link"]) {
nav :where(a, [role="link"]):is([aria-current], :hover, :active, :focus) { nav :where(a, [role="link"]):is([aria-current], :hover, :active, :focus) {
text-decoration: none; text-decoration: none;
} }
nav [role=button] {
margin-right: inherit;
margin-left: inherit;
padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
}
aside nav, aside nav,
aside ol, aside ol,

2
css/pico.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

5
css/pico.css
View file

@ -2085,6 +2085,11 @@ nav :where(a, [role="link"]) {
nav :where(a, [role="link"]):is([aria-current], :hover, :active, :focus) { nav :where(a, [role="link"]):is([aria-current], :hover, :active, :focus) {
text-decoration: none; text-decoration: none;
} }
nav [role=button] {
margin-right: inherit;
margin-left: inherit;
padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
}
aside nav, aside nav,
aside ol, aside ol,

2
css/pico.css.map
View file

File diff suppressed because one or more lines are too long

5
css/pico.fluid.classless.css
View file

@ -1857,6 +1857,11 @@ nav :where(a, [role="link"]) {
nav :where(a, [role="link"]):is([aria-current], :hover, :active, :focus) { nav :where(a, [role="link"]):is([aria-current], :hover, :active, :focus) {
text-decoration: none; text-decoration: none;
} }
nav [role=button] {
margin-right: inherit;
margin-left: inherit;
padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
}
aside nav, aside nav,
aside ol, aside ol,

2
css/pico.fluid.classless.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.fluid.classless.min.css.map
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css vendored
View file

File diff suppressed because one or more lines are too long

2
css/pico.min.css.map
View file

File diff suppressed because one or more lines are too long

4
docs/navs.html
View file

File diff suppressed because one or more lines are too long

4
docs/src/navs.html
View file

@ -28,7 +28,7 @@
<ul> <ul>
<li><a href="#" onclick="event.preventDefault()">Link</a></li> <li><a href="#" onclick="event.preventDefault()">Link</a></li>
<li><a href="#" onclick="event.preventDefault()">Link</a></li> <li><a href="#" onclick="event.preventDefault()">Link</a></li>
<li><a href="#" onclick="event.preventDefault()">Link</a></li> <li><a href="#" onclick="event.preventDefault()" role="button">Button</a></li>
</ul> </ul>
</nav> </nav>
<footer class="code"> <footer class="code">
@ -40,7 +40,7 @@
&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;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>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>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> <i>role</i>=<u>"button"</u>&gt;Button&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>

8
scss/components/_nav.scss
View file

@ -62,6 +62,14 @@ nav {
text-decoration: none; text-decoration: none;
} }
} }
// Minimal support for role="button"
[role="button"] {
margin-right: inherit;
margin-left: inherit;
padding: var(--nav-link-spacing-vertical) var(--nav-link-spacing-horizontal);
}
} }
// Vertical Nav // Vertical Nav