theme: Regain focus ring in %bubble_button

Instead of removing all button shadows forcibly with
`box-shadow: none !important`, remove only the drop shadows selectively
with button(). This allows %bubble_button to preserve the focus ring
while eliminating the drop shadows.

https://gitlab.gnome.org/GNOME/gnome-shell/issues/2088
This commit is contained in:
nana-4 2020-01-17 19:57:42 +09:00
parent 5195f6f92e
commit c4646c15e9
2 changed files with 13 additions and 11 deletions

View File

@ -156,19 +156,18 @@ stage {
// buttons in dialogs // buttons in dialogs
%bubble_button { %bubble_button {
@include button(normal); @include button(normal, $shadow: none);
padding: $base_padding * 2; padding: $base_padding * 2;
border-color: $bubble_borders_color; border-color: $bubble_borders_color;
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1px;
border-left-width: 0; border-left-width: 0;
border-bottom-width: 0; border-bottom-width: 0;
box-shadow:none !important;
&:insensitive { @include button(insensitive);} &:insensitive { @include button(insensitive, $shadow: none); }
&:hover { @include button(hover);} &:hover { @include button(hover, $shadow: none); }
&:focus { @include button(focus);} &:focus { @include button(focus, $shadow: none); }
&:active { @include button(active);} &:active { @include button(active, $shadow: none); }
// radius is 2 pixel less to fit in bubble // radius is 2 pixel less to fit in bubble
&:first-child { &:first-child {

View File

@ -110,7 +110,7 @@
} }
} }
@mixin button($t, $c:$bg_color, $tc:$fg_color, $edge: $borders_edge) { @mixin button($t, $c:$bg_color, $tc:$fg_color, $edge: $borders_edge, $shadow: $shadow_color) {
// //
// Button drawing function // Button drawing function
// //
@ -119,6 +119,8 @@
// $tc: optional text color for colored* types // $tc: optional text color for colored* types
// $edge: set to none to not draw the bottom edge or specify a color to not // $edge: set to none to not draw the bottom edge or specify a color to not
// use the default one // use the default one
// $shadow: set to none to not draw the drop shadow or specify a color to not
// use the default one
// //
// possible $t values: // possible $t values:
// normal, hover, active, insensitive, insensitive-active, // normal, hover, active, insensitive, insensitive-active,
@ -129,13 +131,14 @@
$hilight_color: draw_button_hilight_color($c); $hilight_color: draw_button_hilight_color($c);
$button_edge: if($edge == none, none, draw_widget_edge($edge)); $button_edge: if($edge == none, none, draw_widget_edge($edge));
$blank_edge: if($edge == none, none, draw_widget_edge(transparentize($edge,1))); $blank_edge: if($edge == none, none, draw_widget_edge(transparentize($edge,1)));
$button_shadow: if($shadow == none, none, 0 1px 1px 0 $shadow);
// normal button // normal button
@if $t==normal { @if $t==normal {
color: $tc; color: $tc;
background-color: lighten($c, 3%) !important; background-color: lighten($c, 3%) !important;
border-color: draw_border_color($c); border-color: draw_border_color($c);
@include draw_shadows(0 1px 1px 0 $shadow_color); @include draw_shadows($button_shadow);
// box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); // box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
text-shadow: 0 1px $text_shadow_color; text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color; icon-shadow: 0 1px $text_shadow_color;
@ -150,17 +153,17 @@
//border-color: $selected_bg_color; //border-color: $selected_bg_color;
} }
// hover osd button // hover button
@else if $t==hover { @else if $t==hover {
color: $tc; color: $tc;
background-color: lighten($c, if($variant == 'light', 8%, 5%)) !important; background-color: lighten($c, if($variant == 'light', 8%, 5%)) !important;
border-color: if($variant == 'light', draw_border_color(lighten($c, 7%)), draw_border_color($c)); border-color: if($variant == 'light', draw_border_color(lighten($c, 7%)), draw_border_color($c));
@include draw_shadows(0 1px 1px 0 $shadow_color); @include draw_shadows($button_shadow);
text-shadow: 0 1px $text_shadow_color; text-shadow: 0 1px $text_shadow_color;
icon-shadow: 0 1px $text_shadow_color; icon-shadow: 0 1px $text_shadow_color;
} }
// active osd button // active button
@else if $t==active { @else if $t==active {
color: $tc; color: $tc;
background-color: darken($c,3%) !important; background-color: darken($c,3%) !important;