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

New --button-box-shadow var

Browse source 
+ rename `--form-element-focus` to `--form-element-focus-color`
+ code cleaning
This commit is contained in:
Lucas Larroche 2021-07-02 22:18:14 +07:00
parent fc67f39278
commit dd534ef6a6
21 changed files with 136 additions and 85 deletions
Download patch file Download diff file Expand all files Collapse all files

14
scss/content/_button.scss
View file

@ -58,7 +58,7 @@ a[role="button"] {
--background-color: var(--primary);
--border-color: var(--primary);
--color: var(--primary-inverse);
--box-shadow: none;
--box-shadow: var(--button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -85,10 +85,11 @@ a[role="button"] {
&:focus {
--background-color: var(--primary-hover);
--border-color: var(--primary-hover);
--box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));
}
&:focus {
--box-shadow: 0 0 0 var(--outline-width) var(--primary-focus);
--box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)), 0 0 0 var(--outline-width) var(--primary-focus);
}
}
@ -107,7 +108,8 @@ input[type="reset"] {
}
&:focus {
--box-shadow: 0 0 0 var(--outline-width) var(--secondary-focus);
// --box-shadow: 0 0 0 var(--outline-width) var(--secondary-focus);
--box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)), 0 0 0 var(--outline-width) var(--secondary-focus);
}
}
@ -134,7 +136,8 @@ input[type="reset"] {
}
&:focus {
--box-shadow: 0 0 0 var(--outline-width) var(--secondary-focus);
// --box-shadow: 0 0 0 var(--outline-width) var(--secondary-focus);
--box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)), 0 0 0 var(--outline-width) var(--secondary-focus);
}
}
@ -152,7 +155,8 @@ input[type="reset"] {
}
&:focus {
--box-shadow: 0 0 0 var(--outline-width) var(--contrast-focus);
// --box-shadow: 0 0 0 var(--outline-width) var(--contrast-focus);
--box-shadow: var(--button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)), 0 0 0 var(--outline-width) var(--contrast-focus);
}
}

4
scss/content/_form-alt-input-types.scss
View file

@ -10,7 +10,7 @@
&::-webkit-color-swatch-wrapper {
padding: 0;
}
&::-moz-focus-inner {
padding: 0;
}
@ -86,9 +86,9 @@
&:hover,
&:active,
&:focus {
--color: var(--color);
border: none;
background: none;
--color: var(--color);
&::-webkit-file-upload-button {
--background-color: var(--secondary-hover);

2
scss/content/_form.scss
View file

@ -209,7 +209,7 @@ input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="r
select,
textarea {
&:focus {
--box-shadow: 0 0 0 var(--outline-width) var(--form-element-focus);
--box-shadow: 0 0 0 var(--outline-width) var(--form-element-focus-color);
}
}