From caebb5a35ea5166ceadc538ef3e9a474cdf4c41b Mon Sep 17 00:00:00 2001 From: Jakub Steiner Date: Tue, 31 May 2022 08:45:26 +0200 Subject: [PATCH] theme: Hardcode osd bg color - osd needs to work for both light & dark contexts Fixes https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/5537 Part-of: --- data/theme/gnome-shell-sass/_colors.scss | 5 +++-- data/theme/gnome-shell-sass/_common.scss | 10 +++++----- data/theme/gnome-shell-sass/widgets/_screenshot.scss | 4 ++-- 3 files changed, 10 insertions(+), 9 deletions(-) diff --git a/data/theme/gnome-shell-sass/_colors.scss b/data/theme/gnome-shell-sass/_colors.scss index 73db6fe03..7e7aaabe3 100644 --- a/data/theme/gnome-shell-sass/_colors.scss +++ b/data/theme/gnome-shell-sass/_colors.scss @@ -48,8 +48,9 @@ $dark_3: #3d3846; $dark_4: #241f31; $dark_5: #000000; +$_dark_base_color: darken(desaturate(#241f31, 100%), 2%); -$base_color: if($variant == 'light', #fff, darken(desaturate(#241f31, 100%), 2%)); +$base_color: if($variant == 'light', #fff, $_dark_base_color); $bg_color: if($variant == 'light', #f6f5f4, lighten($base_color, 5%)); $fg_color: if($variant == 'light', transparentize(black, .2), white); @@ -69,7 +70,7 @@ $success_color: if($variant == 'light', $green_4, $green_5); $destructive_color: $error_color; $osd_fg_color: white; -$osd_bg_color: transparentize(desaturate($bg_color, 100%),0.04); +$osd_bg_color: $_dark_base_color; //hardcoded for both light & dark $osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5); $osd_insensitive_fg_color: if($variant == 'light', mix($osd_fg_color, $osd_bg_color, 80%), mix($osd_fg_color, $osd_bg_color, 70%)); $osd_borders_color: transparentize(black, 0.3); diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss index c6e64766e..dbbf79e01 100644 --- a/data/theme/gnome-shell-sass/_common.scss +++ b/data/theme/gnome-shell-sass/_common.scss @@ -163,11 +163,11 @@ $bubble_buttons_color: if($variant == 'light', darken($bg_color, 12%), lighten($ // that are undecorated by default and use OSD colors %osd_button { @include button(undecorated); - &:insensitive { @include button(undecorated, $c:$osd_bg_color);} - &:focus { @include button(focus, $c:$osd_bg_color);} - &:hover { @include button(hover, $c:$osd_bg_color);} - &:active { @include button(active, $c:$osd_bg_color);} - &:outlined,&:checked { @include button(checked, $c:$osd_bg_color);} + &:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color);} + &:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color);} } /* General Typography */ diff --git a/data/theme/gnome-shell-sass/widgets/_screenshot.scss b/data/theme/gnome-shell-sass/widgets/_screenshot.scss index c0a983df9..7b6747c8b 100644 --- a/data/theme/gnome-shell-sass/widgets/_screenshot.scss +++ b/data/theme/gnome-shell-sass/widgets/_screenshot.scss @@ -81,7 +81,7 @@ $screenshot_ui_button_red: $error_color; } .screenshot-ui-shot-cast-container { - background-color: $hover_bg_color; + background-color: lighten($osd_bg_color,5%); border-radius: $modal_radius; padding: $screenshot_ui_shot_cast_spacing; spacing: $screenshot_ui_shot_cast_spacing; @@ -93,7 +93,7 @@ $screenshot_ui_button_red: $error_color; .screenshot-ui-shot-cast-button { padding: $base_padding $base_padding*2; background-color: transparent; - &:hover, &:focus { background-color: lighten($hover_bg_color, 5%);} + &:hover, &:focus { background-color: lighten($osd_bg_color, 10%);} &:active { background-color: lighten($active_bg_color,5%);} &:checked { background-color: white;color: black;}