sass: Rename overlay color variables
_bg_color -> _overlay_color
by roundabout, Thursday, 29 November 2018, 16:27:51 (1543508871), pushed by roundabout, Sunday, 11 May 2025, 13:22:30 (1746969750)
Author identity: nana-4 <hnmaigo@gmail.com>
69c8d9348bda54b992b3ac89af271f21e5cc4a00
src/_sass/_colors.scss
@@ -56,11 +56,11 @@ $opaque_panel_bg_color: if($titlebar == 'dark', #212121, #CBCBCB); // for Unity
$gdm_bg_color: #303030;
$hover_bg_color: gtkalpha(currentColor, 0.08);
$focus_bg_color: gtkalpha(currentColor, 0.12);
$hover_focus_bg_color: gtkalpha(currentColor, 0.16);
$active_bg_color: gtkalpha(currentColor, 0.12);
$checked_bg_color: gtkalpha(currentColor, 0.24);
$hover_overlay_color: gtkalpha(currentColor, 0.08);
$focus_overlay_color: gtkalpha(currentColor, 0.12);
$hover_focus_overlay_color: gtkalpha(currentColor, 0.16);
$active_overlay_color: gtkalpha(currentColor, 0.12);
$checked_overlay_color: gtkalpha(currentColor, 0.24);
// Misc colors
$primary_color: $google_blue_color;
src/_sass/_colors.scss.template
@@ -52,11 +52,11 @@ $opaque_panel_bg_color: %MENU_BG3%; // for Unity panel which cannot use translu
$gdm_bg_color: %MENU_BG3%;
$hover_bg_color: gtkalpha(currentColor, 0.08);
$focus_bg_color: gtkalpha(currentColor, 0.12);
$hover_focus_bg_color: gtkalpha(currentColor, 0.16);
$active_bg_color: gtkalpha(currentColor, 0.12);
$checked_bg_color: gtkalpha(currentColor, 0.24);
$hover_overlay_color: gtkalpha(currentColor, 0.08);
$focus_overlay_color: gtkalpha(currentColor, 0.12);
$hover_focus_overlay_color: gtkalpha(currentColor, 0.16);
$active_overlay_color: gtkalpha(currentColor, 0.12);
$checked_overlay_color: gtkalpha(currentColor, 0.24);
// Misc colors
$primary_color: %SEL_BG%;
src/_sass/gtk/_common-3.20.scss
@@ -34,7 +34,7 @@
}
notebook:focus tab,
*:focus { outline-color: $checked_bg_color; }
*:focus { outline-color: $checked_overlay_color; }
/***************
@@ -1858,7 +1858,7 @@ notebook {
font-weight: 500;
&:hover {
background-color: $hover_bg_color;
background-color: $hover_overlay_color;
color: $fg_color;
}
@@ -2092,11 +2092,11 @@ switch {
background-color: $surface_color;
}
&:hover slider { box-shadow: 0 0 0 10px $hover_bg_color, $shadow_1; }
&:hover slider { box-shadow: 0 0 0 10px $hover_overlay_color, $shadow_1; }
&:focus slider { box-shadow: 0 0 0 10px $focus_bg_color, $shadow_1; }
&:focus slider { box-shadow: 0 0 0 10px $focus_overlay_color, $shadow_1; }
&:focus:hover slider { box-shadow: 0 0 0 10px $hover_focus_bg_color, $shadow_1; }
&:focus:hover slider { box-shadow: 0 0 0 10px $hover_focus_overlay_color, $shadow_1; }
&:checked slider {
background-color: $primary_color;
@@ -2163,11 +2163,11 @@ radio {
@extend %circular_button;
&:hover { box-shadow: inset 0 0 0 9999px $hover_bg_color; }
&:hover { box-shadow: inset 0 0 0 9999px $hover_overlay_color; }
&:focus { box-shadow: inset 0 0 0 9999px $focus_bg_color; }
&:focus { box-shadow: inset 0 0 0 9999px $focus_overlay_color; }
&:focus:hover { box-shadow: inset 0 0 0 9999px $hover_focus_bg_color; }
&:focus:hover { box-shadow: inset 0 0 0 9999px $hover_focus_overlay_color; }
&:checked, &:indeterminate {
color: $primary_color;
@@ -2773,7 +2773,7 @@ row {
box-shadow 0,
background-size $ripple_duration $deceleration_curve,
background-image $ripple_opacity_duration $deceleration_curve;
box-shadow: inset 0 0 0 9999px $hover_bg_color;
box-shadow: inset 0 0 0 9999px $hover_overlay_color;
}
&.has-open-popup, // this is for indicathing which row generated a popover see https://bugzilla.gnome.org/show_bug.cgi?id=754411
@@ -2782,9 +2782,9 @@ row {
background-size 0,
background-image 0;
animation: ripple_effect $longer_duration $deceleration_curve forwards;
box-shadow: inset 0 0 0 9999px $hover_bg_color;
box-shadow: inset 0 0 0 9999px $hover_overlay_color;
background-image: radial-gradient(circle farthest-corner at center,
$active_bg_color 10%,
$active_overlay_color 10%,
transparent 0%);
background-size: 0% 0%;
}
@@ -3517,7 +3517,7 @@ button.emoji-section {
background-color: transparent;
}
&:hover, &:active { background-color: $hover_bg_color; }
&:hover, &:active { background-color: $hover_overlay_color; }
&:first-child { margin-left: 4px; }
@@ -3534,6 +3534,6 @@ button.emoji-section {
transition: $shorter_transition;
border-radius: $material_radius;
&:hover { background-color: $hover_bg_color; }
&:hover { background-color: $hover_overlay_color; }
}
}
src/_sass/gtk/_drawing-3.20.scss
@@ -112,9 +112,9 @@
background-size 0,
background-image 0;
animation: ripple_effect $longer_duration $deceleration_curve forwards;
box-shadow: $shadow_2, inset 0 0 0 9999px $hover_bg_color;
box-shadow: $shadow_2, inset 0 0 0 9999px $hover_overlay_color;
background-image: radial-gradient(circle farthest-corner at center,
$active_bg_color 10%,
$active_overlay_color 10%,
transparent 0%);
background-size: 0% 0%;
color: $fg_color;
@@ -153,7 +153,7 @@
}
@if $t == flat-hover {
box-shadow: inset 0 0 0 9999px $hover_bg_color;
box-shadow: inset 0 0 0 9999px $hover_overlay_color;
color: $fg_color;
}
@@ -163,9 +163,9 @@
background-size 0,
background-image 0;
animation: ripple_effect $longer_duration $deceleration_curve forwards;
box-shadow: inset 0 0 0 9999px $hover_bg_color;
box-shadow: inset 0 0 0 9999px $hover_overlay_color;
background-image: radial-gradient(circle farthest-corner at center,
$active_bg_color 10%,
$active_overlay_color 10%,
transparent 0%);
background-size: 0% 0%;
color: $fg_color;
@@ -178,7 +178,7 @@
}
@if $t == flat-checked {
background-color: $checked_bg_color;
background-color: $checked_overlay_color;
color: $fg_color;
}
src/_sass/gtk/apps/_gnome-3.22.scss
@@ -31,7 +31,7 @@
// Toolbar
@keyframes needs_attention_keyframes {
to { background-color: $focus_bg_color; }
to { background-color: $focus_overlay_color; }
}
.nautilus-operations-button-needs-attention {
@@ -555,7 +555,7 @@ docktab {
font-weight: 500;
&:hover {
background-color: $hover_bg_color;
background-color: $hover_overlay_color;
color: $fg_color;
}
@@ -824,7 +824,7 @@ overlay grid.horizontal > revealer > scrolledwindow.frame {
// box-shadow: inset 0 -1px shade(@borders, 1.30);
// background-color: @theme_bg_color;
&:hover { background-image: image($hover_bg_color); }
&:hover { background-image: image($hover_overlay_color); }
}
frame.documents-dropdown {
src/_sass/gtk/apps/_misc.scss
@@ -62,9 +62,9 @@ window.background.chromium {
box-shadow: none;
background-size: auto;
&:hover { background-image: image($hover_bg_color); }
&:hover { background-image: image($hover_overlay_color); }
&:active { background-image: image($checked_bg_color); }
&:active { background-image: image($checked_overlay_color); }
}
// workaround for headerbar's non-animatable buttons
@@ -112,9 +112,9 @@ window.background:not(.csd) {
background-size: auto;
// color: $fg_color;
&:hover { background-image: image($hover_bg_color); }
&:hover { background-image: image($hover_overlay_color); }
&:active { background-image: image($checked_bg_color); }
&:active { background-image: image($checked_overlay_color); }
}
// use 16px assets for hard-coded sizing