[gnome-themes-standard] simplified button text shadow function, dimmed insensitive active button background



commit 1fd03a0e05e8ec9f5ab611906b6edb94c0ae9864
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Wed May 21 15:57:47 2014 +0200

    simplified button text shadow function, dimmed insensitive active button background

 themes/Adwaita/gtk-3.0/_drawing.scss          |   33 ++++++---------
 themes/Adwaita/gtk-3.0/gtk-contained-dark.css |   52 ++++++++++++------------
 themes/Adwaita/gtk-3.0/gtk-contained.css      |   52 ++++++++++++------------
 3 files changed, 65 insertions(+), 72 deletions(-)
---
diff --git a/themes/Adwaita/gtk-3.0/_drawing.scss b/themes/Adwaita/gtk-3.0/_drawing.scss
index 8dd6264..45917a2 100644
--- a/themes/Adwaita/gtk-3.0/_drawing.scss
+++ b/themes/Adwaita/gtk-3.0/_drawing.scss
@@ -22,32 +22,25 @@ $widget_bottom_hilight: 0 1px $borders_edge; //outer hilight "used" on
   }
 }
 
- mixin _button_text_shadow ($tc:$theme_fg_color, $sc:false) { 
+ mixin _button_text_shadow ($tc:$theme_fg_color) { 
 //
 // helper function for the text emboss effect
 //
 // $tc is the optional text color, not the shadow color
-// $sc is the optional shadow color
+// 
+// TODO: this functions needs a way to deal with special cases
 //
+
+  $_dark: transparentize(black,0.8);
+  $_bright: transparentize(white,0.4);
+
   @if lightness($tc) < 50% {
-    @if $sc {
-      text-shadow: 0 1px $sc;
-      icon-shadow: 0 1px $sc;
-    }
-    @else {
-      text-shadow: 0 1px lighten(invert($tc),20%);
-      icon-shadow: 0 1px lighten(invert($tc),20%);
-    }
+    text-shadow: 0 1px $_bright;
+    icon-shadow: 0 1px $_bright;
   }
   @else {
-    @if $sc {
-      text-shadow: 0 -1px $sc;
-      icon-shadow: 0 -1ps $sc;
-    }
-    @else {
-      text-shadow: 0 -1px transparentize(invert($tc),0.5);
-      icon-shadow: 0 -1px transparentize(invert($tc),0.5);
-    }
+    text-shadow: 0 -1px $_dark;
+    icon-shadow: 0 -1px $_dark;
   }
 }
 
@@ -153,7 +146,7 @@ $widget_bottom_hilight: 0 1px $borders_edge; //outer hilight "used" on
     border-color: $_insensitive_borders_color;
     @include _button_box_shadow(none,
                                 $widget_bottom_hilight);
-    background-image: linear-gradient(to bottom, transparentize($_backdrop_borders_color,.8));
+    background-image: linear-gradient(to bottom, transparentize($_backdrop_borders_color,.9));
   }
 
   @else if $t==backdrop { // backdrop button
@@ -180,7 +173,7 @@ $widget_bottom_hilight: 0 1px $borders_edge; //outer hilight "used" on
                                              // pushed button
     color: $_backdrop_insensitive_color;
     border-color: $_backdrop_borders_color;
-    background-image: linear-gradient(to bottom, transparentize($_backdrop_borders_color,.8));
+    background-image: linear-gradient(to bottom, transparentize($_backdrop_borders_color,.9));
     box-shadow: none;
   }
 }
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained-dark.css b/themes/Adwaita/gtk-3.0/gtk-contained-dark.css
index f06af06..78b9f7c 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained-dark.css
+++ b/themes/Adwaita/gtk-3.0/gtk-contained-dark.css
@@ -160,8 +160,8 @@ GtkGrid:insensitive {
   color: #eeeeec;
   background-image: linear-gradient(to bottom, #454c4c, #393f3f 40%, #2d3232);
   border-color: #1c1f1f;
-  text-shadow: 0 -1px rgba(17, 17, 19, 0.5);
-  icon-shadow: 0 -1px rgba(17, 17, 19, 0.5);
+  text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+  icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
   box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1);
   /* Suggested and Destructive Action buttons */ }
   .button:hover,
@@ -174,8 +174,8 @@ GtkGrid:insensitive {
     color: #eeeeec;
     border-color: #212424;
     background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f);
-    text-shadow: 0 -1px rgba(17, 17, 19, 0.5);
-    icon-shadow: 0 -1px rgba(17, 17, 19, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
   .button:active,
   .toolbar .button.raised:active,
@@ -187,8 +187,8 @@ GtkGrid:insensitive {
     color: #eeeeec;
     border-color: #1c1f1f;
     background-image: linear-gradient(to bottom, #212424, #2d3232 3%);
-    text-shadow: 0 -1px rgba(17, 17, 19, 0.5);
-    icon-shadow: 0 -1px rgba(17, 17, 19, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(238, 238, 236, 0.1); }
   .button:backdrop,
   .toolbar .button.raised:backdrop,
@@ -231,7 +231,7 @@ GtkGrid:insensitive {
       border-style: solid;
       color: white;
       border-color: #1c1f1f;
-      background-image: linear-gradient(to bottom, rgba(28, 31, 31, 0.2));
+      background-image: linear-gradient(to bottom, rgba(28, 31, 31, 0.1));
       box-shadow: none; }
   .button:insensitive,
   .toolbar .button.raised:insensitive,
@@ -256,7 +256,7 @@ GtkGrid:insensitive {
       color: white;
       border-color: #1c1f1f;
       box-shadow: none, 0 1px rgba(238, 238, 236, 0.1);
-      background-image: linear-gradient(to bottom, rgba(28, 31, 31, 0.2)); }
+      background-image: linear-gradient(to bottom, rgba(28, 31, 31, 0.1)); }
   .button.suggested-action,
   .toolbar .button.raised.suggested-action,
   .toolbar .raised .button.suggested-action,
@@ -267,8 +267,8 @@ GtkGrid:insensitive {
     color: white;
     background-image: linear-gradient(to bottom, #3583d5, #2a76c6 40%, #256ab1);
     border-color: #215d9c;
-    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-    icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
     .button.suggested-action:hover,
     .toolbar .button.raised.suggested-action:hover,
@@ -280,8 +280,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #215d9c;
       background-image: linear-gradient(to bottom, #5b9add, #3180d4 40%, #2a76c6);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
     .button.suggested-action:active,
     .toolbar .button.raised.suggested-action:active,
@@ -293,8 +293,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #215d9c;
       background-image: linear-gradient(to bottom, #215d9c, #256ab1 3%);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(238, 238, 236, 0.1); }
     .button.suggested-action:backdrop,
     .toolbar .button.raised.suggested-action:backdrop,
@@ -341,8 +341,8 @@ GtkGrid:insensitive {
     color: white;
     background-image: linear-gradient(to bottom, #ed1212, #d51010 40%, #bd0e0e);
     border-color: #a60c0c;
-    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-    icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
     .button.destructive-action:hover,
     .toolbar .button.raised.destructive-action:hover,
@@ -354,8 +354,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #a60c0c;
       background-image: linear-gradient(to bottom, #f03c3c, #e81111 40%, #d51010);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
     .button.destructive-action:active,
     .toolbar .button.raised.destructive-action:active,
@@ -367,8 +367,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #a60c0c;
       background-image: linear-gradient(to bottom, #a60c0c, #bd0e0e 3%);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(238, 238, 236, 0.1); }
     .button.destructive-action:backdrop,
     .toolbar .button.raised.destructive-action:backdrop,
@@ -462,8 +462,8 @@ GtkGrid:insensitive {
     color: #eeeeec;
     border-color: #1c1f1f;
     background-image: linear-gradient(to bottom, #515a5a, #5d6767 3%);
-    text-shadow: 0 -1px rgba(17, 17, 19, 0.5);
-    icon-shadow: 0 -1px rgba(17, 17, 19, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(238, 238, 236, 0.1); }
 .spinbutton.vertical .button:first-child {
   border-radius: 3px 3px 0 0; }
@@ -671,8 +671,8 @@ GtkPopover {
     color: #eeeeec;
     background-image: linear-gradient(to bottom, #454c4c, #393f3f 40%, #2d3232);
     border-color: #1c1f1f;
-    text-shadow: 0 -1px rgba(17, 17, 19, 0.5);
-    icon-shadow: 0 -1px rgba(17, 17, 19, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px rgba(238, 238, 236, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
   .button.titlebutton:active {
     border-width: 1px;
@@ -680,8 +680,8 @@ GtkPopover {
     color: #eeeeec;
     border-color: #1c1f1f;
     background-image: linear-gradient(to bottom, #212424, #2d3232 3%);
-    text-shadow: 0 -1px rgba(17, 17, 19, 0.5);
-    icon-shadow: 0 -1px rgba(17, 17, 19, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(238, 238, 236, 0.1); }
   .button.titlebutton:backdrop {
     border-width: 1px;
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained.css b/themes/Adwaita/gtk-3.0/gtk-contained.css
index ee48097..192f9aa 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained.css
+++ b/themes/Adwaita/gtk-3.0/gtk-contained.css
@@ -160,8 +160,8 @@ GtkGrid:insensitive {
   color: #2e3436;
   background-image: linear-gradient(to bottom, white, #ededed 40%, lightgray);
   border-color: #a1a1a1;
-  text-shadow: 0 1px white;
-  icon-shadow: 0 1px white;
+  text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+  icon-shadow: 0 1px rgba(255, 255, 255, 0.6);
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
   /* Suggested and Destructive Action buttons */ }
   .button:hover,
@@ -174,8 +174,8 @@ GtkGrid:insensitive {
     color: #2e3436;
     border-color: #a1a1a1;
     background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
-    text-shadow: 0 1px white;
-    icon-shadow: 0 1px white;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+    icon-shadow: 0 1px rgba(255, 255, 255, 0.6);
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05); }
   .button:active,
   .toolbar .button.raised:active,
@@ -187,8 +187,8 @@ GtkGrid:insensitive {
     color: #2e3436;
     border-color: #a1a1a1;
     background-image: linear-gradient(to bottom, #c7c7c7, #d1d1d1 3%, lightgray);
-    text-shadow: 0 1px white;
-    icon-shadow: 0 1px white;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+    icon-shadow: 0 1px rgba(255, 255, 255, 0.6);
     box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.05); }
   .button:backdrop,
   .toolbar .button.raised:backdrop,
@@ -231,7 +231,7 @@ GtkGrid:insensitive {
       border-style: solid;
       color: #c7c7c7;
       border-color: #a1a1a1;
-      background-image: linear-gradient(to bottom, rgba(161, 161, 161, 0.2));
+      background-image: linear-gradient(to bottom, rgba(161, 161, 161, 0.1));
       box-shadow: none; }
   .button:insensitive,
   .toolbar .button.raised:insensitive,
@@ -256,7 +256,7 @@ GtkGrid:insensitive {
       color: #748489;
       border-color: #a1a1a1;
       box-shadow: none, 0 1px rgba(255, 255, 255, 0.05);
-      background-image: linear-gradient(to bottom, rgba(161, 161, 161, 0.2)); }
+      background-image: linear-gradient(to bottom, rgba(161, 161, 161, 0.1)); }
   .button.suggested-action,
   .toolbar .button.raised.suggested-action,
   .toolbar .raised .button.suggested-action,
@@ -267,8 +267,8 @@ GtkGrid:insensitive {
     color: white;
     background-image: linear-gradient(to bottom, #abc6e2, #729fcf 40%, #4c85c2);
     border-color: #2b537d;
-    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-    icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05); }
     .button.suggested-action:hover,
     .toolbar .button.raised.suggested-action:hover,
@@ -280,8 +280,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #2b537d;
       background-image: linear-gradient(to bottom, #a7c3e1, #81a9d4 40%, #729fcf);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05); }
     .button.suggested-action:active,
     .toolbar .button.raised.suggested-action:active,
@@ -293,8 +293,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #2b537d;
       background-image: linear-gradient(to bottom, #3e78b6, #4883c1 3%, #4c85c2);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.05); }
     .button.suggested-action:backdrop,
     .toolbar .button.raised.suggested-action:backdrop,
@@ -341,8 +341,8 @@ GtkGrid:insensitive {
     color: white;
     background-image: linear-gradient(to bottom, #f47070, #ef2929 40%, #d51010);
     border-color: #760909;
-    text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-    icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+    text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+    icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05); }
     .button.destructive-action:hover,
     .toolbar .button.raised.destructive-action:hover,
@@ -354,8 +354,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #760909;
       background-image: linear-gradient(to bottom, #f46b6b, #f03c3c 40%, #ef2929);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05); }
     .button.destructive-action:active,
     .toolbar .button.raised.destructive-action:active,
@@ -367,8 +367,8 @@ GtkGrid:insensitive {
       color: white;
       border-color: #760909;
       background-image: linear-gradient(to bottom, #bd0e0e, #d01010 3%, #d51010);
-      text-shadow: 0 -1px rgba(0, 0, 0, 0.5);
-      icon-shadow: 0 -1px rgba(0, 0, 0, 0.5);
+      text-shadow: 0 -1px rgba(0, 0, 0, 0.2);
+      icon-shadow: 0 -1px rgba(0, 0, 0, 0.2);
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.05); }
     .button.destructive-action:backdrop,
     .toolbar .button.raised.destructive-action:backdrop,
@@ -462,8 +462,8 @@ GtkGrid:insensitive {
     color: #2e3436;
     border-color: #a1a1a1;
     background-image: linear-gradient(to bottom, #d9d9d9, #e3e3e3 3%, #e6e6e6);
-    text-shadow: 0 1px white;
-    icon-shadow: 0 1px white;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+    icon-shadow: 0 1px rgba(255, 255, 255, 0.6);
     box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.05); }
 .spinbutton.vertical .button:first-child {
   border-radius: 3px 3px 0 0; }
@@ -671,8 +671,8 @@ GtkPopover {
     color: #2e3436;
     background-image: linear-gradient(to bottom, white, #ededed 40%, lightgray);
     border-color: #a1a1a1;
-    text-shadow: 0 1px white;
-    icon-shadow: 0 1px white;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+    icon-shadow: 0 1px rgba(255, 255, 255, 0.6);
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05); }
   .button.titlebutton:active {
     border-width: 1px;
@@ -680,8 +680,8 @@ GtkPopover {
     color: #2e3436;
     border-color: #a1a1a1;
     background-image: linear-gradient(to bottom, #c7c7c7, #d1d1d1 3%, lightgray);
-    text-shadow: 0 1px white;
-    icon-shadow: 0 1px white;
+    text-shadow: 0 1px rgba(255, 255, 255, 0.6);
+    icon-shadow: 0 1px rgba(255, 255, 255, 0.6);
     box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.05); }
   .button.titlebutton:backdrop {
     border-width: 1px;


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