style: Add missing transition timings

- fixes #5211

Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/2309>
This commit is contained in:
Sam Hewitt 2022-05-27 15:39:45 -02:30 committed by Marge Bot
parent 68653d5e61
commit ec571eb86f
5 changed files with 14 additions and 11 deletions

View File

@ -74,7 +74,7 @@ stage {
padding: $base_padding;
spacing: $base_padding;
border: 2px solid transparent;
transition-duration: 100ms;
transition-duration: 200ms;
text-align: center;
}

View File

@ -129,12 +129,6 @@
}
}
// buttons
// since buttons are all flat an borderless now the mixin is simpler
@mixin button($t, $tc:$fg_color, $c:$bg_color) {
$button_bg_color: mix($tc, $c, 5%);
//
// Button drawing function
//
@ -147,6 +141,12 @@ $button_bg_color: mix($tc, $c, 5%);
// backdrop, backdrop-active, backdrop-insensitive, backdrop-insensitive-active,
// osd, osd-hover, osd-active, osd-insensitive, osd-backdrop, undecorated
//
// since buttons are all flat an borderless now the mixin is simpler
@mixin button($t, $tc:$fg_color, $c:$bg_color) {
$button_bg_color: mix($tc, $c, 5%);
transition-duration: 100ms;
// normal button
@if $t==normal {
@ -257,6 +257,7 @@ $button_bg_color: mix($tc, $c, 5%);
// overview icon, dash, app grid
@mixin overview_icon($color, $flat: true) {
transition-duration: 400ms;
.overview-icon { @extend %tile; }
@if $flat {
.overview-icon { background-color: transparent;}

View File

@ -102,6 +102,7 @@ $app_icon_size: 96px;
// App Grid pagination indicators
.page-indicator {
padding: $base_padding $base_padding * 2 0;
transition-duration:400ms;
.page-indicator-icon {
width: 10px;

View File

@ -69,6 +69,7 @@
height: $calendar_day_size !important;
width: $calendar_day_size !important;
border-radius: 99px;
transition-duration: 100ms;
@extend %numeric;
@extend %smaller;

View File

@ -30,16 +30,16 @@
padding: $base_padding*1.5 $base_padding*2;
border-radius: $base_border_radius;
spacing: $base_padding;
transition: 0.2s all ease;
transition-duration: 100ms;
background-color: transparent;
&:ltr {padding-left: $base_padding;}
&:rtl {padding-right: $base_padding;}
&:focus, &:hover {
background-color: $hover_bg_color !important;
&:active { background-color: $active_bg_color !important;}
}
background-color: $hover_bg_color !important;
&:active { background-color: $active_bg_color !important;}
}
&:checked {background-color: $checked_bg_color !important;}