brl/gnome-shell
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style: Adjust the focus logic to accommodate accent color

Browse Source 
- adjust definitions for focus/accent related colors
- rework the focus mixins to better match how libadwaita handles accent color and focus

Closes: https://gitlab.gnome.org/GNOME/gnome-shell/-/issues/7989
Part-of: <https://gitlab.gnome.org/GNOME/gnome-shell/-/merge_requests/3552>
This commit is contained in:
Sam Hewitt 2024-11-18 17:17:00 -03:30 committed by Marge Bot
parent 4a89811211
commit 038b06d868
3 changed files with 17 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
data/theme/gnome-shell-sass/_colors.scss
View File

@ -66,4 +66,4 @@ $active_bg_color: if($variant=='light', darken($bg_color, 11%), lighten($bg_colo
$active_fg_color: if($variant=='light', darken($fg_color, 11%), lighten($fg_color, 12%));
// accent colors
$accent_borders_color: if($variant== 'light', st-darken(-st-accent-color, 15%), st-lighten(-st-accent-color, 15%));
$accent_borders_color: if($variant== 'light', st-darken(-st-accent-color, 20%), st-lighten(-st-accent-color, 30%));

13
data/theme/gnome-shell-sass/_default-colors.scss
View File

@ -4,6 +4,9 @@
$_base_color_dark: #222226;
$_base_color_light: #fafafb;
// accent colors
$accent_color: if($variant== 'light', -st-accent-color, st-mix(-st-accent-color, $light_1, 60%));
// colors for destructive elements
$destructive_bg_color: if($variant == 'light', $red_3, $red_4);
$destructive_fg_color: $light_1;
@ -28,23 +31,21 @@ $link_visited_color: st-transparentize($link_color, .6);
// special cased widget definitions
$background_mix_factor: if($variant == 'light', 12%, 9%); // used to boost the color of backgrounds in different variants
$border_opacity: if($variant == 'light', .85, .9); // change the border opacity in different variants
// shadows
$shadow_color: if($variant == 'light', rgba(0,0,0,.05), rgba(0,0,0,0.2));
$text_shadow_color: if($variant == 'light', rgba(255,255,255,0.3), rgba(0,0,0,0.2));
// focus colors
$focus_color: -st-accent-color;
$focus_border_color: st-transparentize($focus_color, 0.5);
// border opacities
$border_opacity: if($variant == 'light', .85, .9); // change the border opacity in different variants
$focus_border_opacity: .2;
// High Contrast overrides
@if $contrast == 'high' {
// increase border opacity
$border_opacity: .5;
$focus_border_opacity: .1;
// remove shadows
$shadow_color: transparent;
$text_shadow_color: transparent;
// less transparent focus color
$focus_border_color: st-transparentize($focus_color, 0.2);
}

15
data/theme/gnome-shell-sass/_drawing.scss
View File

@ -20,7 +20,7 @@
}
// Function to mix the color and make the focus background
@function focus_bg_color($bg, $fc:$focus_color) {
@function focus_bg_color($bg, $fc:$accent_color) {
@return st-mix($fc, $bg, 5%);
}
@ -54,10 +54,13 @@
}
// Draw the focus ring
@mixin focus_ring($width: 2px, $fc: $focus_border_color, $border: false) {
box-shadow: inset 0 0 0 $width $fc !important;
@mixin focus_ring($width: 2px, $fc: $accent_color, $border: false) {
$focus_color: st-transparentize($fc, $focus_border_opacity);
box-shadow: inset 0 0 0 $width $focus_color !important;
@if $border {
border:$width solid $fc !important;
border:$width solid $focus_color !important;
box-shadow: none;
}
}
@ -90,7 +93,7 @@
// entry colors
$entry_fg_color: $c;
$entry_bg_color: mix($c, $bc, $background_mix_factor);
$entry_focus_color: $focus_color;
$entry_focus_color: $accent_color;
// entry color overrides for lockscreen style
@if $style == 'lockscreen' {
@ -128,7 +131,7 @@
// focus styles
@if $type == 'focus' {
@include focus_ring();
@include focus_ring($fc:$entry_focus_color);
background-color: focus_bg_color($entry_bg_color);
color: $entry_fg_color;