53 lines
2.0 KiB
SCSS
53 lines
2.0 KiB
SCSS
@mixin button ($c:$button_bg, $tc:$button_fg, $c_pressed:$button_checked_bg, $tc_pressed:$button_checked_fg, $pressable:true) {
|
|
|
|
|
|
color: $tc;
|
|
background-color: $c;
|
|
border-color: black; //mix($tc, $c, 10%);
|
|
outline-color: $focus_border_color;
|
|
background-image: button_curve_well_contrasted($c);
|
|
@include _shadows($button_shadow_normal);
|
|
|
|
&:hover, &:focus { //:focus is more for gtk4
|
|
color: lighten($tc, 10%);
|
|
text-shadow: $text_shadow_hover;
|
|
&, & image, & arrow { -gtk-icon-shadow: $text_shadow_hover; }
|
|
@if $gtk==3 {
|
|
-gtk-icon-effect: highlight;
|
|
}
|
|
@else {
|
|
-gtk-icon-filter: brightness(1.2);
|
|
}
|
|
}
|
|
|
|
@if $pressable==true {
|
|
|
|
&:active, &.keyboard-activating {
|
|
@include _shadows($button_shadow_pressed);
|
|
}
|
|
&:checked, &:selected, &.has-open-popup, %button-pressed { //selected and has-open-popup is for .activatable rows, hopefully it won't go wrong
|
|
background-color: $c_pressed;
|
|
color: $tc_pressed;
|
|
@include _shadows($button_shadow_pressed, 0 10px 3px -9px gtkalpha(currentColor, 0.3)); //, 0 -3px 2px -2px gtkalpha(currentColor, 0.2) //a highlight on the upper border, maybe not for now, because it's harder to make it look realistic...
|
|
text-shadow: $text_shadow_lighted;
|
|
&, & image, & arrow { -gtk-icon-shadow: $text_shadow_lighted; }
|
|
|
|
&:hover, &:focus {
|
|
text-shadow: $text_shadow_lighted, $text_shadow_hover;
|
|
&, & image, & arrow { -gtk-icon-shadow: $text_shadow_lighted, $text_shadow_hover; }
|
|
@include _shadows($button_shadow_pressed, 0 10px 3px -9px gtkalpha(currentColor, 0.5));
|
|
}
|
|
}
|
|
|
|
}
|
|
&:disabled {
|
|
&, &:checked, &:selected, &.has-open-popup {
|
|
color: $insensitive_fg_color;
|
|
background-color: $insensitive_bg_color;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
}
|