[libadwaita/wip/exalm/borders: 40/40] stylesheet: Use recolorable half-transparent borders

[Alexander Mikhaylenko <alexm src gnome org>]

commit 1463f385df6569d66dd7caae585feb00a9912d20
Author: Alexander Mikhaylenko <alexm gnome org>
Date:   Mon Jun 21 13:29:23 2021 +0500

    stylesheet: Use recolorable half-transparent borders
    
    Use light rather than dark borders in dark variant.

 src/stylesheet/_colors.scss                   | 6 ++++--
 src/stylesheet/widgets/_notebook.scss         | 4 ++--
 src/stylesheet/widgets/_shortcuts-window.scss | 4 ++--
 src/stylesheet/widgets/_spin-button.scss      | 2 +-
 4 files changed, 9 insertions(+), 7 deletions(-)
---
diff --git a/src/stylesheet/_colors.scss b/src/stylesheet/_colors.scss
index 8bd9ff53..255c0cf4 100644
--- a/src/stylesheet/_colors.scss
+++ b/src/stylesheet/_colors.scss
@@ -23,7 +23,8 @@ $text_color: if($variant == 'light', black, white);
 $bg_color: if($variant == 'light', $light_bg, $dark_bg);
 $fg_color: if($variant == 'light', $light_fg, $dark_fg);
 
-$borders_color: if($variant == 'light', darken($bg_color, 18%), darken($bg_color, 10%));
+$borders_color: gtkalpha(currentColor, .15);
+$thin_borders_color: gtkalpha(currentColor, .05);
 $link_color: $accent_color;
 $link_visited_color: gtkmix($accent_color, $text_color, 80%);
 $dark_fill: if($variant == 'light', darken($bg_color, 9%), darken($bg_color, 5%));
@@ -88,7 +89,8 @@ $dim_label_opacity: 0.55;
 
   $fg_color: if($variant == 'light', darken($fg_color, 3%), lighten($fg_color, 2%));
   $bg_color: if($variant == 'light', lighten($bg_color, 3%), darken($bg_color, 2%));
-  $borders_color: if($variant == 'light', darken($borders_color, 30%), lighten($borders_color, 30%));
+  $borders_color: gtkalpha(currentColor, .5);
+  $thin_borders_color: gtkalpha(currentColor, .25);
 
   $headerbar_border_color: transparentize($fg_color, .5);
 
diff --git a/src/stylesheet/widgets/_notebook.scss b/src/stylesheet/widgets/_notebook.scss
index 94e693a5..777a8791 100644
--- a/src/stylesheet/widgets/_notebook.scss
+++ b/src/stylesheet/widgets/_notebook.scss
@@ -134,7 +134,7 @@ notebook {
         background-color: transparentize($bg_color, 0.8);
 
         &.reorderable-page {
-          border-color: transparentize($borders_color, 0.7);
+          border-color: $thin_borders_color;
         }
       }
 
@@ -144,7 +144,7 @@ notebook {
 
       &:checked {
         &.reorderable-page {
-          border-color: transparentize($borders_color, 0.5);
+          border-color: $thin_borders_color;
           background-color: transparentize($bg_color, 0.5);
 
           &:hover { background-color: transparentize($bg_color, 0.3); }
diff --git a/src/stylesheet/widgets/_shortcuts-window.scss b/src/stylesheet/widgets/_shortcuts-window.scss
index aacbbcec..67968c27 100644
--- a/src/stylesheet/widgets/_shortcuts-window.scss
+++ b/src/stylesheet/widgets/_shortcuts-window.scss
@@ -23,9 +23,9 @@ shortcut {
     background-color: $base_color;
     background-clip: padding-box;
     border: 1px solid;
-    border-color: if($variant == 'light', mix($borders_color, $bg_color, 50%), $borders_color);
+    border-color: $borders_color;
     border-radius: 5px;
-    box-shadow: if($variant == 'light', inset 0 -3px mix($base_color, $bg_color, 20%), inset 0 -3px 
mix($borders_color, $base_color, 60%));
+    box-shadow: inset 0 -3px $thin_borders_color;
     font-size: smaller;
   }
 }
diff --git a/src/stylesheet/widgets/_spin-button.scss b/src/stylesheet/widgets/_spin-button.scss
index 4d00e847..ddcb5620 100644
--- a/src/stylesheet/widgets/_spin-button.scss
+++ b/src/stylesheet/widgets/_spin-button.scss
@@ -10,7 +10,7 @@ spinbutton {
     margin: 0;
     background: none;
     border-style: solid;
-    border-color: transparentize($borders_color, 0.7);
+    border-color: $thin_borders_color;
     border-radius: 0;
     box-shadow: none;
     color: inherit;