FreakU
/
Retrospring
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add focus and active override styles

This commit is contained in:
Andreas Nedbal 2020-05-06 22:48:07 +02:00
parent 771e09133c
commit c75c86e16c
1 changed files with 24 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
app/assets/stylesheets/overrides/_buttons.scss
View File

@ -4,9 +4,11 @@
@each $color in $color-names { @each $color in $color-names {
.btn-#{$color} { .btn-#{$color} {
color: RGB(var(--#{$color}-text)); color: RGB(var(--#{$color}-text));
background-color: var(--#{$color}); background-color: var(--#{$color});
border-color: var(--#{$color}); border-color: var(--#{$color});
border-width: 0;
&:hover { &:hover {
background: linear-gradient( background: linear-gradient(
@ -16,12 +18,33 @@
) var(--#{$color}); ) var(--#{$color});
} }
&:active { &:not(:disabled):not(.disabled):active,
&:not(:disabled):not(.disabled).active {
border: none;
background: linear-gradient( background: linear-gradient(
to top, to top,
rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25),
rgba(0, 0, 0, 0.25) rgba(0, 0, 0, 0.25)
) var(--#{$color}); ) var(--#{$color});
&:focus {
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.30),
rgba(0, 0, 0, 0.30)
) var(--#{$color});
box-shadow: none;
}
}
&:focus,
&:focus:hover {
background: linear-gradient(
to top,
rgba(0, 0, 0, 0.30),
rgba(0, 0, 0, 0.30)
) var(--#{$color});
box-shadow: none;
} }
} }