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

[Alexander Mikhaylenko <alexm src gnome org>]

commit 93ec8e380c49811ff37a8fccbce7b9ff5ed8408d
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Fri Oct 1 23:34:33 2021 +0500

    a

 src/stylesheet/_colors.scss           |  9 +++++++++
 src/stylesheet/widgets/_popovers.scss |  4 +---
 src/stylesheet/widgets/_tab-view.scss | 27 ++++++---------------------
 src/stylesheet/widgets/_window.scss   | 28 ++++++++++------------------
 4 files changed, 26 insertions(+), 42 deletions(-)
---
diff --git a/src/stylesheet/_colors.scss b/src/stylesheet/_colors.scss
index e46443a1..02cd787d 100644
--- a/src/stylesheet/_colors.scss
+++ b/src/stylesheet/_colors.scss
@@ -36,7 +36,12 @@ $error_color: gtkcolor(error_color);
 @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))};
 
+@define-color window_outline_color         #{if($variant == 'light', transparent, white)};
+@define-color window_border_color          #{if($variant == 'light', transparentize(black, 0.77), 
transparentize(black, 0.25))};
+@define-color window_border_backdrop_color #{if($variant == 'light', transparentize(black, 0.82), 
transparentize(black, 0.25))};
+
 $border_opacity: if($contrast == 'high', .5, .15);
+$window_outline_opacity: if($contrast == 'high', .3, .1);
 
 $base_color: gtkcolor(base_color);
 $text_color: gtkcolor(text_color);
@@ -56,6 +61,10 @@ $popover_bg_color: gtkcolor(popover_bg_color);
 $popover_fg_color: gtkcolor(popover_fg_color);
 $shade_color: gtkcolor(shade_color);
 
+$window_outline_color: gtkalpha(gtkcolor(window_outline_color), $window_outline_opacity);
+$window_border_color: gtkcolor(window_border_color);
+$window_border_backdrop_color: gtkcolor(window_border_backdrop_color);
+
 $borders_color: gtkalpha(currentColor, $border_opacity);
 $thin_borders_color: gtkalpha(currentColor, .05);
 $link_color: $accent_color;
diff --git a/src/stylesheet/widgets/_popovers.scss b/src/stylesheet/widgets/_popovers.scss
index aa2b1457..38d45c42 100644
--- a/src/stylesheet/widgets/_popovers.scss
+++ b/src/stylesheet/widgets/_popovers.scss
@@ -4,12 +4,10 @@ popover.background {
 
   > arrow,
   > contents {
-    $_popover_border: if($variant=='light', transparentize(black, 0.77), transparentize(black, 0.25));
-
     background-color: $popover_bg_color;
     color: $popover_fg_color;
     background-clip: padding-box;
-    border: 1px solid $_popover_border;
+    border: 1px solid $window_border_color;
     box-shadow: 0 1px 2px transparentize(black, 0.7);
   }
 
diff --git a/src/stylesheet/widgets/_tab-view.scss b/src/stylesheet/widgets/_tab-view.scss
index 71045503..4ea45b98 100644
--- a/src/stylesheet/widgets/_tab-view.scss
+++ b/src/stylesheet/widgets/_tab-view.scss
@@ -1,21 +1,12 @@
-
 $tab_needs_attention_gradient: radial-gradient(ellipse at bottom,
                                                transparentize(white, .2),
                                                gtkalpha($accent_bg_color, .2) 15%,
                                                gtkalpha($accent_bg_color, 0) 15%);
 
-
 @mixin undershoot-gradient($dir) {
-  @if $variant == 'dark' {
-    background: linear-gradient(to #{$dir},
-                                transparentize(black, .6),
-                                transparentize(black, 1) 20px);
-  }
-  @else {
-    background: linear-gradient(to #{$dir},
-                                transparentize(black, .93),
-                                transparentize(black, 1) 20px);
-  }
+  background: linear-gradient(to #{$dir},
+                              $shade_color,
+                              transparentize(black, 1) 20px);
 }
 
 @mixin need-attention-gradient($dir) {
@@ -147,17 +138,11 @@ dnd tab {
     background-image: $tab_needs_attention_gradient;
   }
 
-  $_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize(black, 0.25));
-
   box-shadow: 0 3px 9px 1px transparentize(black, 0.75),
-              0 0 0 1px $_wm_border;
+              0 0 0 1px $window_border_color;
 
-  @if $variant == 'dark' {
-    $_wm_outline: if($contrast=='high', transparentize(white, .7), transparentize(white, .9));
-
-    outline: 1px solid $_wm_outline;
-    outline-offset: -1px;
-  }
+  outline: 1px solid $window_outline_color;
+  outline-offset: -1px;
 
   margin: 25px;
 }
diff --git a/src/stylesheet/widgets/_window.scss b/src/stylesheet/widgets/_window.scss
index 0c2ab457..2df5d1a9 100644
--- a/src/stylesheet/widgets/_window.scss
+++ b/src/stylesheet/widgets/_window.scss
@@ -2,25 +2,17 @@ window {
   // lamefun trick to get rounded borders regardless of CSD use
   border-width: 0px;
 
-  // this needs to be transparent
-  // see bug #722563
-  $_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize(black, 0.25));
-  $_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize(black, 0.25));
-
   &.csd {
     box-shadow: 0 1px 3px 3px transparent,
                 0 2px 8px 2px transparentize(black, 0.87),
                 0 3px 20px 10px transparentize(black, 0.91),
                 0 6px 32px 16px transparentize(black, 0.96),
-                0 0 0 1px $_wm_border; //doing borders with box-shadow
+                0 0 0 1px $window_border_color; //doing borders with box-shadow
     margin: 0px;
     border-radius: $window_radius;
 
-    @if $variant == 'dark' {
-      $_window_outline: if($contrast=='high', transparentize(white, .7), transparentize(white, .9));
-      outline: 1px solid $_window_outline;
-      outline-offset: -1px;
-    }
+    outline: 1px solid $window_outline_color;
+    outline-offset: -1px;
 
     &:backdrop {
       // the transparent shadow here is to enforce that the shadow extents don't
@@ -31,13 +23,13 @@ window {
                   0 2px 14px 5px transparentize(black, 0.95),
                   0 4px 28px 12px transparentize(black, 0.97),
                   0 6px 32px 16px transparent,
-                  0 0 0 1px $_wm_border_backdrop;
+                  0 0 0 1px $window_border_backdrop_color;
       transition: $backdrop_transition;
     }
 
     &.dialog.message {
       box-shadow: 0 1px 2px transparentize(black, 0.8),
-                  0 0 0 1px transparentize($_wm_border, 0.1);
+                  0 0 0 1px $window_border_color;
     }
 
     &.tiled,
@@ -48,11 +40,11 @@ window {
       border-radius: 0;
       outline: none;
 
-      box-shadow: 0 0 0 1px $_wm_border,
+      box-shadow: 0 0 0 1px $window_border_color,
                   0 0 0 20px transparent; //transparent control workaround -- #3670
 
       &:backdrop {
-        box-shadow: 0 0 0 1px $_wm_border_backdrop,
+        box-shadow: 0 0 0 1px $window_border_backdrop_color,
                     0 0 0 20px transparent;
       }
     }
@@ -72,15 +64,15 @@ window {
     border-radius: 0;
     box-shadow: inset 0 0 0 5px $borders_color,
                 inset 0 0 0 4px $headerbar_bg_color,
-                inset 0 0 0 1px $_wm_border;
+                inset 0 0 0 1px $window_border_color;
 
     &:backdrop {
       box-shadow: inset 0 0 0 5px $borders_color,
                   inset 0 0 0 4px $headerbar_backdrop_color,
-                  inset 0 0 0 1px $_wm_border_backdrop;
+                  inset 0 0 0 1px $window_border_backdrop_color;
     }
   }
 
   // server-side decorations as used by mutter
-  &.ssd { box-shadow: 0 0 0 1px $_wm_border; } //just doing borders, wm draws actual shadows
+  &.ssd { box-shadow: 0 0 0 1px $window_border_color; } //just doing borders, wm draws actual shadows
 }