[libadwaita/wip/exalm/background-colors: 74/74] a

[Alexander Mikhaylenko <alexm src gnome org>]

commit 571ccd877da41d1b39cea53ebe60505e93142296
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Fri Oct 1 16:19:44 2021 +0500

    a

 src/stylesheet/_colors.scss                | 61 +++++++++++++++++++++---------
 src/stylesheet/_common.scss                |  2 +-
 src/stylesheet/widgets/_color-chooser.scss |  2 +-
 src/stylesheet/widgets/_notebook.scss      |  6 +--
 src/stylesheet/widgets/_tab-view.scss      |  1 -
 src/stylesheet/widgets/_toolbars.scss      |  5 ++-
 src/stylesheet/widgets/_views.scss         |  2 +-
 7 files changed, 53 insertions(+), 26 deletions(-)
---
diff --git a/src/stylesheet/_colors.scss b/src/stylesheet/_colors.scss
index a976bb74..e46443a1 100644
--- a/src/stylesheet/_colors.scss
+++ b/src/stylesheet/_colors.scss
@@ -13,27 +13,53 @@ $success_color: gtkcolor(success_color);
 $warning_color: gtkcolor(warning_color);
 $error_color: gtkcolor(error_color);
 
-$base_color: if($variant == 'light', white, #1e1e1e);
-$text_color: if($variant == 'light', black, white);
-$bg_color: if($variant == 'light', #fafafa, #242424);
-$fg_color: if($variant == 'light', transparentize(black, .2), white);
+@define-color base_color             #{if($variant == 'light', #ffffff, #1e1e1e)};
+@define-color text_color             #{if($variant == 'light', #000000, #ffffff)};
+
+@define-color bg_color               #{if($variant == 'light', #fafafa, #242424)};
+@define-color fg_color               #{if($variant == 'light', transparentize(black, .2), white)};
+
+@define-color dark_fill_bg_color     #{if($variant == 'light', #ebebeb, #303030)};
+@define-color dark_fill_fg_color     #{if($variant == 'light', transparentize(black, .2), white)};
+@define-color dark_fill_border_color #{if($variant == 'light', transparentize(black, .2), white)};
+
+@define-color headerbar_bg_color       @dark_fill_bg_color;
+@define-color headerbar_fg_color       @dark_fill_fg_color;
+@define-color headerbar_border_color   @dark_fill_border_color;
+@define-color headerbar_backdrop_color @bg_color;
+
+@define-color card_bg_color          #{if($variant == 'light', #ffffff, transparentize(white, .945))};
+@define-color card_fg_color          #{if($variant == 'light', transparentize(black, .2), white)};
+@define-color card_border_color      #{if($variant == 'light', gtkalpha(currentColor, .18), 
gtkalpha(currentColor, .18))};
+
+@define-color popover_bg_color       #{if($variant == 'light', #ffffff, #383838)};
+@define-color popover_fg_color       #{if($variant == 'light', transparentize(black, .2), white)};
+@define-color shade_color            #{if($variant == 'light', transparentize(black, .93), 
transparentize(black, .64))};
 
 $border_opacity: if($contrast == 'high', .5, .15);
+
+$base_color: gtkcolor(base_color);
+$text_color: gtkcolor(text_color);
+$bg_color: gtkcolor(bg_color);
+$fg_color: gtkcolor(fg_color);
+$headerbar_bg_color: gtkcolor(headerbar_bg_color);
+$headerbar_fg_color: gtkcolor(headerbar_fg_color);
+$headerbar_border_color: gtkalpha(gtkcolor(headerbar_border_color), $border_opacity);
+$headerbar_backdrop_color: gtkcolor(headerbar_backdrop_color);
+$dark_fill_bg_color: gtkcolor(dark_fill_bg_color);
+$dark_fill_fg_color: gtkcolor(dark_fill_fg_color);
+$dark_fill_border_color: gtkalpha(gtkcolor(dark_fill_border_color), $border_opacity);
+$card_bg_color: gtkcolor(card_bg_color);
+$card_fg_color: gtkcolor(card_fg_color);
+$card_border_color: gtkcolor(card_border_color);
+$popover_bg_color: gtkcolor(popover_bg_color);
+$popover_fg_color: gtkcolor(popover_fg_color);
+$shade_color: gtkcolor(shade_color);
+
 $borders_color: gtkalpha(currentColor, $border_opacity);
 $thin_borders_color: gtkalpha(currentColor, .05);
 $link_color: $accent_color;
 $link_visited_color: gtkmix($accent_color, $text_color, 80%);
-$dark_fill: if($variant == 'light', #ebebeb, #303030);
-$headerbar_bg_color: $dark_fill;
-$headerbar_fg_color: $fg_color;
-$headerbar_border_color: gtkalpha($fg_color, $border_opacity);
-$headerbar_backdrop_color: $bg_color;
-$card_bg_color: if($variant == 'light', #ffffff, transparentize(white, .945));
-$card_fg_color: $fg_color;
-$card_border_color: if($variant == 'light', gtkalpha(currentColor, .18), gtkalpha(currentColor, .18));
-
-$popover_bg_color: if($variant == 'light', #ffffff, #383838);
-$popover_fg_color: $fg_color;
 
 $view_hover_color: gtkalpha(currentColor, .07);
 $view_active_color: gtkalpha(currentColor, .16);
@@ -50,7 +76,7 @@ $fill_text_color: $accent_fg_color;
 $fill_hover_color: gtkmix($accent_bg_color, currentColor, 90%);
 $fill_active_color: gtkmix($accent_bg_color, black, 80%);
 
-$slider_color: mix(white, $base_color, 80%);
+$slider_color: gtkmix(white, $base_color, 80%);
 $slider_hover_color: white;
 
 $osd_fg_color: transparentize(white, .1);
@@ -70,7 +96,8 @@ $dim_label_opacity: 0.55;
 // High Contrast color overrides
 @if $contrast == 'high' {
   $thin_borders_color: gtkalpha(currentColor, .25);
-  $card_border_color: $borders_color;
+
+  @define-color card_border_color #{$borders_color};
 
   //focus rings
   $focus_border_color: gtkalpha($accent_bg_color, 0.8);
diff --git a/src/stylesheet/_common.scss b/src/stylesheet/_common.scss
index a261f65d..02a4711a 100644
--- a/src/stylesheet/_common.scss
+++ b/src/stylesheet/_common.scss
@@ -37,7 +37,7 @@ dnd {
 /* Text selection */
 
 selection {
-  background-color: transparentize($text_color, 0.9);
+  background-color: gtkalpha($text_color, 0.1);
   color: transparent;
 
   &:focus-within {
diff --git a/src/stylesheet/widgets/_color-chooser.scss b/src/stylesheet/widgets/_color-chooser.scss
index 3743e5ff..fb149fd5 100644
--- a/src/stylesheet/widgets/_color-chooser.scss
+++ b/src/stylesheet/widgets/_color-chooser.scss
@@ -58,7 +58,7 @@ colorswatch {
 
   @if $contrast == 'high' {
     > overlay {
-      box-shadow: inset 0 0 0 1px transparentize($text_color, .5);
+      box-shadow: inset 0 0 0 1px gtkalpha($text_color, .5);
     }
   }
 
diff --git a/src/stylesheet/widgets/_notebook.scss b/src/stylesheet/widgets/_notebook.scss
index 723d4368..512cfb4e 100644
--- a/src/stylesheet/widgets/_notebook.scss
+++ b/src/stylesheet/widgets/_notebook.scss
@@ -3,11 +3,11 @@ notebook {
 
   > header {
     padding: 1px;
-    border-color: $borders_color;
+    border-color: $dark_fill_border_color;
     border-width: 1px;
-    background-color: $dark_fill;
+    background-color: $dark_fill_bg_color;
     background-clip: padding-box;
-    color: $fg_color;
+    color: $dark_fill_fg_color;
 
     > tabs { margin: -1px; }
 
diff --git a/src/stylesheet/widgets/_tab-view.scss b/src/stylesheet/widgets/_tab-view.scss
index e227c677..71045503 100644
--- a/src/stylesheet/widgets/_tab-view.scss
+++ b/src/stylesheet/widgets/_tab-view.scss
@@ -1,4 +1,3 @@
-$shade_color: if($variant == 'light', transparentize(black, .93), transparentize(black, .64));
 
 $tab_needs_attention_gradient: radial-gradient(ellipse at bottom,
                                                transparentize(white, .2),
diff --git a/src/stylesheet/widgets/_toolbars.scss b/src/stylesheet/widgets/_toolbars.scss
index a3f1f20c..3563d3fd 100644
--- a/src/stylesheet/widgets/_toolbars.scss
+++ b/src/stylesheet/widgets/_toolbars.scss
@@ -132,8 +132,9 @@ searchbar > revealer > box {
   padding: 6px 6px 7px 6px;
   border-spacing: 6px;
 
-  background-color: $dark_fill;
-  box-shadow: inset 0 -1px $borders_color;
+  background-color: $dark_fill_bg_color;
+  color: $dark_fill_fg_color;
+  box-shadow: inset 0 -1px $dark_fill_border_color;
 
  .close {
     min-width: 18px;
diff --git a/src/stylesheet/widgets/_views.scss b/src/stylesheet/widgets/_views.scss
index 9ec943d3..cc4da03a 100644
--- a/src/stylesheet/widgets/_views.scss
+++ b/src/stylesheet/widgets/_views.scss
@@ -25,7 +25,7 @@ textview {
   }
 
   > border {
-    background-color: mix($bg_color, $base_color, 50%);
+    background-color: gtkmix($bg_color, $base_color, 50%);
   }
 
   &:drop(active) {