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

refactor: Buttons

Browse source
This commit is contained in:
Lucas Larroche 2022-12-29 17:53:16 +07:00
parent dccee093a6
commit f8e5f28613
1 changed files with 17 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

29
scss/content/_button.scss
View file

@ -23,9 +23,9 @@
// Correct the inability to style buttons in iOS and Safari // Correct the inability to style buttons in iOS and Safari
button, button,
[type="button"], input[type="submit"],
[type="reset"], input[type="reset"],
[type="submit"] { input[type="button"] {
-webkit-appearance: button; -webkit-appearance: button;
} }
@ -34,19 +34,19 @@
button { button {
display: block; display: block;
width: 100%;
margin-bottom: var(#{$✨}spacing); margin-bottom: var(#{$✨}spacing);
} }
[role="button"] { input[type="submit"],
display: inline-block; input[type="reset"],
text-decoration: none; input[type="button"] {
width: 100%;
} }
button, button,
input[type="submit"], input[type="submit"],
input[type="button"],
input[type="reset"], input[type="reset"],
input[type="button"],
[role="button"] { [role="button"] {
#{$✨}background-color: var(#{$✨}primary-background); #{$✨}background-color: var(#{$✨}primary-background);
#{$✨}border-color: var(#{$✨}primary-border); #{$✨}border-color: var(#{$✨}primary-border);
@ -176,12 +176,17 @@
} }
// Button [disabled] // Button [disabled]
// Links without href are disabled by default :where(
:where(button, [type="submit"], [type="button"], [type="reset"], [role="button"])[disabled], button,
input[type="submit"],
input[type="reset"],
input[type="button"],
[role="button"]
)[disabled],
:where(fieldset[disabled]) :where(fieldset[disabled])
:is(button, [type="submit"], [type="button"], [type="reset"], [role="button"]), :is(button, input[type="submit"], input[type="button"], input[type="reset"], [role="button"]) {
a[role="button"]:not([href]) {
opacity: 0.5; opacity: 0.5;
pointer-events: none; pointer-events: none;
user-select: none;
} }
} }