[gtk/wip/exalm/shadows] Adwaita: Refresh window shadows



commit 73c644e0e620a6e5707034f3f5cb0ad50083abcb
Author: Alexander Mikhaylenko <exalm7659 gmail com>
Date:   Mon Sep 2 19:02:21 2019 +0500

    Adwaita: Refresh window shadows
    
    Use shadows heavily based on elementary stylesheet. Make half-tiled
    shadows very subtle. Enable normal->backdrop transition.

 gtk/theme/Adwaita/_common.scss           | 24 +++++++++++++++++++++---
 gtk/theme/Adwaita/gtk-contained-dark.css |  8 ++++++--
 gtk/theme/Adwaita/gtk-contained.css      |  8 ++++++--
 3 files changed, 33 insertions(+), 7 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index e6d0f5a407..440bac36db 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -4575,7 +4575,8 @@ decoration {
   $_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize($borders_color, 0.1));
   $_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize($borders_color, 
0.1));
 
-  box-shadow: 0 3px 9px 1px transparentize(black, 0.5),
+  box-shadow: 0 10px 20px transparentize(black, 0.7),
+              0 6px 6px transparentize(black, 0.85),
               0 0 0 1px $_wm_border; //doing borders with box-shadow
 
   // FIXME rationalize shadows
@@ -4588,9 +4589,10 @@ decoration {
     // change when we go to backdrop, to prevent jumping windows.
     // The biggest shadow should be in the same order then in the active state
     // or the jumping will happen during the transition.
-    box-shadow: 0 3px 9px 1px transparent,
-                0 2px 6px 2px transparentize(black, 0.8),
+    box-shadow: 0 10px 20px transparent,
+                0 3px 6px transparentize(black, 0.7),
                 0 0 0 1px $_wm_border_backdrop;
+
     transition: $backdrop_transition;
   }
 
@@ -4602,6 +4604,22 @@ decoration {
   .tiled-bottom &,
   .tiled-left & { border-radius: 0; }
 
+  .tiled &,
+  .tiled-top &,
+  .tiled-right &,
+  .tiled-bottom &,
+  .tiled-left & {
+    box-shadow: 0 1px 3px transparentize(black, 0.88),
+                0 1px 2px transparentize(black, 0.76),
+                0 0 0 1px $_wm_border;
+
+    &:backdrop {
+      box-shadow: 0 1px 3px transparentize(black, 0.88),
+                  0 1px 2px transparentize(black, 0.76),
+                  0 0 0 1px $_wm_border_backdrop;
+    }
+  }
+
   .popup & { box-shadow: none; }
 
   // server-side decorations as used by mutter
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index e072705ca3..463bddbd6c 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -1828,12 +1828,16 @@ colorchooser .popover.osd { border-radius: 5px; }
 .scale-popup button:hover { background-color: rgba(238, 238, 236, 0.1); border-radius: 5px; }
 
 /********************** Window Decorations * */
-decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.5), 0 
0 0 1px rgba(27, 27, 27, 0.9); margin: 10px; }
+decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3), 0 
6px 6px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(27, 27, 27, 0.9); margin: 10px; }
 
-decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px 
rgba(27, 27, 27, 0.9); transition: 200ms ease-out; }
+decoration:backdrop { box-shadow: 0 10px 20px transparent, 0 3px 6px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(27, 
27, 27, 0.9); transition: 200ms ease-out; }
 
 .maximized decoration, .fullscreen decoration, .tiled decoration, .tiled-top decoration, .tiled-right 
decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; }
 
+.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left 
decoration { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 1px rgba(27, 27, 
27, 0.9); }
+
+.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom 
decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px 
rgba(0, 0, 0, 0.24), 0 0 0 1px rgba(27, 27, 27, 0.9); }
+
 .popup decoration { box-shadow: none; }
 
 .ssd decoration { box-shadow: 0 0 0 1px rgba(27, 27, 27, 0.9); }
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index 856e9739a9..4e9e805f44 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -1844,12 +1844,16 @@ colorchooser .popover.osd { border-radius: 5px; }
 .scale-popup button:hover { background-color: rgba(46, 52, 54, 0.1); border-radius: 5px; }
 
 /********************** Window Decorations * */
-decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.5), 0 
0 0 1px rgba(0, 0, 0, 0.23); margin: 10px; }
+decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3), 0 
6px 6px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.23); margin: 10px; }
 
-decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px 
rgba(0, 0, 0, 0.18); transition: 200ms ease-out; }
+decoration:backdrop { box-shadow: 0 10px 20px transparent, 0 3px 6px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(0, 
0, 0, 0.18); transition: 200ms ease-out; }
 
 .maximized decoration, .fullscreen decoration, .tiled decoration, .tiled-top decoration, .tiled-right 
decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; }
 
+.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left 
decoration { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24), 0 0 0 1px rgba(0, 0, 
0, 0.23); }
+
+.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom 
decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px 
rgba(0, 0, 0, 0.24), 0 0 0 1px rgba(0, 0, 0, 0.18); }
+
 .popup decoration { box-shadow: none; }
 
 .ssd decoration { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.23); }


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]