[gnome-themes-standard/wip/sass] some more button experimenting



commit 91fff29809c7b6abbca93472946087b86d7e9d11
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Mon May 19 16:09:08 2014 +0200

    some more button experimenting

 themes/Adwaita/gtk-3.0/_common.scss            |   28 +++++----
 themes/Adwaita/gtk-3.0/_drawing.scss           |   67 ++++++++++++++++-----
 themes/Adwaita/gtk-3.0/gtk-contained-dark.scss |    8 +++
 themes/Adwaita/gtk-3.0/gtk-contained.css       |   75 ++++++++++++++----------
 themes/Adwaita/gtk-3.0/gtk-contained.scss      |   16 +++++-
 5 files changed, 131 insertions(+), 63 deletions(-)
---
diff --git a/themes/Adwaita/gtk-3.0/_common.scss b/themes/Adwaita/gtk-3.0/_common.scss
index 46990b0..9969cfa 100644
--- a/themes/Adwaita/gtk-3.0/_common.scss
+++ b/themes/Adwaita/gtk-3.0/_common.scss
@@ -215,36 +215,38 @@ GtkGrid:insensitive {
   transition: all 200ms ease-out;
   padding: 4px;
   background-color: transparent;
-  @include button_normal($theme_bg_color);
+  @include button_normal;
   &:hover {
-    @include button_hover($theme_bg_color);
+    @include button_hover;
   }
   &:active {
-    @include button_active($theme_bg_color);
+    @include button_active;
   }
   &:backdrop {
     // FIXME we need one or two backdrop colors
-    @include button_backdrop($theme_bg_color);
-    color: $insensitive_fg_color;
+    @include button_backdrop($backdrop_bg_color);
+    color: $backdrop_fg_color;
     &:active {
-      @include button_backdrop_active($theme_bg_color);
+      @include button_backdrop_active($backdrop_bg_color);
       color: $theme_bg_color;
     }
     &:insensitive {
-      color: transparentize($insensitive_fg_color,0.5);
-      border-color: darken($theme_bg_color,15%);
+      color: $backdrop_insensitive_color;
+      border-color: $backdrop_insensitive_color;
     }
     &:insensitive:active {
-      background-image: linear-gradient(to bottom, darken($theme_bg_color,15%));
-      border-color: darken($theme_bg_color,15%);
+      //this ugly flat gradient is unfortunatelly needed...
+      background-image: linear-gradient(to bottom, $backdrop_insensitive_color);
+      border-color: $backdrop_insensitive_color;
       box-shadow: none;
-      color: $theme_bg_color;
+      color: $backdrop_bg_color;
     }
   }
   &:insensitive {
-    @include button_insensitive($theme_bg_color);
+    @include button_insensitive;
+    color: $insensitive_fg_color;
     &:active {
-      @include button_insensitive_active($theme_bg_color);
+      @include button_insensitive_active;
     }
   }
   // button label can't be colored easily, need to match for the GtkLabel
diff --git a/themes/Adwaita/gtk-3.0/_drawing.scss b/themes/Adwaita/gtk-3.0/_drawing.scss
index ecb7af9..8906cff 100644
--- a/themes/Adwaita/gtk-3.0/_drawing.scss
+++ b/themes/Adwaita/gtk-3.0/_drawing.scss
@@ -23,9 +23,12 @@ $widget_bottom_hilight: 0 1px $borders_edge; //outer hilight "used" on
 
 // buttons
 
- mixin _button_borders ($c) {
+ mixin _button_borders_style {
   border-width: 1px;
   border-style: solid;
+}
+
+ mixin _button_borders_custom_color ($c) {
   @if $variant=='light' {
     border-color: darken($c,30%);
   }
@@ -42,71 +45,101 @@ $widget_bottom_hilight: 0 1px $borders_edge; //outer hilight "used" on
   }
 }
 
- mixin _button_box_shadow($shadow1, $shadow2:false) {
+ mixin _button_box_shadow($shadow1, $shadow2:false, $shadow3:false, $shadow4:false) {
   //needed to stack box shadows
   @if $shadow2 {box-shadow: $shadow1, $shadow2;}
+  @if $shadow3 {box-shadow: $shadow1, $shadow2, $shadow3;}
+  @if $shadow4 {box-shadow: $shadow1, $shadow2, $shadow3, shadow4;}
   @else { box-shadow: $shadow1; }
 }
 
- mixin button_normal ($c) {
+ mixin button_normal ($c:$theme_bg_color) {
   background-image: linear-gradient(to bottom,
                                       lighten($c,10%),
                                       $c 40%,
                                       darken($c,10%)
                                       );
-  @include _button_borders($c);
+
+  @if $c!=$theme_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+  
+  @include _button_borders_style;
   @include _button-box-shadow(inset 0 1px $borders_edge, 
                               $widget_bottom_hilight);
   @include _button_text_shadow(lighten($c,50%));
 }
 
- mixin button_hover ($c) {
+ mixin button_hover ($c:$theme_bg_color) {
   background-image: linear-gradient(to bottom,
                                       lighten($c,14%),
                                       lighten($c,4%) 40%,
                                       $c);
-  @include _button_borders($c);
+ 
+  @if $c!=$theme_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+
+  @include _button_borders_style;
   @include _button-box-shadow(inset 0 1px $borders_edge, 
                               $widget_bottom_hilight);
   @include _button_text_shadow(lighten($c,50%));
 }
 
- mixin button_active ($c) {
+ mixin button_active ($c:$theme_bg_color) {
   background-image: linear-gradient(to bottom,
                                     darken($c,20%),
                                     darken($c,15%) 5%,
                                     darken($c,10%));
+  
+  @if $c!=$theme_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+
+  @include _button_borders_style;
   @include _button_box_shadow (inset 0 2px 3px -1px transparentize(black,0.8),
                                //box shadow for the pushed effect
                                $widget_bottom_hilight);
-  @include _button_borders($c);
-  @include _button_text_shadow($c);
+  @include _button_text_shadow($c);  
 }
 
- mixin button_backdrop ($c) {
+ mixin button_backdrop ($c:$backdrop_bg_color) {
   background-image: linear-gradient(to bottom, $c);
-  @include _button_borders($c);
+
+  @if $c!=$backdrop_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+
+  @include _button_borders_style;
   @include _button_box_shadow(none);
   @include _button_text_shadow(none);
 }
 
- mixin button_backdrop_active ($c) {
+ mixin button_backdrop_active ($c:$backdrop_bg_color) {
   background-image: linear-gradient(to bottom, darken($c,30%));
-  @include _button_borders($c);
+ 
+  @if $c!=$backdrop_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+
+  @include _button_borders_style;
   @include _button_box_shadow(none);
   @include _button_text_shadow(none);
 }
 
- mixin button_insensitive ($c) {
+ mixin button_insensitive ($c:$insensitive_bg_color) {
   background-image: linear-gradient(to bottom, transparentize($c,0.5));
-  @include _button_borders($c);
+ 
+  @if $c!=$insensitive_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+
+  @include _button_borders_style;
   @include _button_box_shadow ($widget_bottom_hilight);
   @include _button_text_shadow(none);
 }
 
- mixin button_insensitive_active ($c) {
+ mixin button_insensitive_active ($c:$insensitive_bg_color) {
   background-image: linear-gradient(to bottom, transparentize($c,0.5));
-  @include _button_borders($c);
+ 
+  @if $c!=$insensitive_bg_color { @include _button_borders_custom_color($c); }
+  @else { border-color: $borders_color;}
+
+  @include _button_borders_style;
   @include _button_box_shadow (inset 0 2px 3px -1px transparentize(black,0.8),
                                $widget_bottom_hilight);
   @include _button_text_shadow(none);
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained-dark.scss b/themes/Adwaita/gtk-3.0/gtk-contained-dark.scss
index 5e7d733..d20ff6a 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained-dark.scss
+++ b/themes/Adwaita/gtk-3.0/gtk-contained-dark.scss
@@ -20,5 +20,13 @@ $destructive_color: darken(#ef2929,10%);
 $insensitive_fg_color: lighten($theme_fg_color, 10%);
 $insensitive_bg_color: transparent;
 
+//colors for the backdrop state, derived from the main colors.
+$backdrop_base_color: darken($theme_base_color,5%);
+$backdrop_bg_color: $theme_bg_color;
+$backdrop_fg_color: $theme_fg_color;
+$backdrop_insensitive_color: lighten($insensitive_fg_color,5%); //FIXME
+$backdrop_borders_color: $borders_color;
+
+
 @import 'drawing';
 @import 'common';
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained.css b/themes/Adwaita/gtk-3.0/gtk-contained.css
index c154021..0328eb9 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained.css
+++ b/themes/Adwaita/gtk-3.0/gtk-contained.css
@@ -160,10 +160,11 @@ GtkGrid:insensitive {
   padding: 4px;
   background-color: transparent;
   background-image: linear-gradient(to bottom, white, #ededed 40%, lightgray);
+  border-color: #a1a1a1;
   border-width: 1px;
   border-style: solid;
-  border-color: #a1a1a1;
   box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+  box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
   text-shadow: 0 1px white;
   icon-shadow: 0 1px white;
   /* Suggested and Destructive Action buttons */ }
@@ -173,10 +174,11 @@ GtkGrid:insensitive {
   .toolbar GtkComboBox .button:hover,
   .spinbutton.vertical .button:hover {
     background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
     text-shadow: 0 1px white;
     icon-shadow: 0 1px white; }
   .button:active,
@@ -185,10 +187,11 @@ GtkGrid:insensitive {
   .toolbar GtkComboBox .button:active,
   .spinbutton.vertical .button:active {
     background-image: linear-gradient(to bottom, #bababa, #c7c7c7 5%, lightgray);
-    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
+    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
     text-shadow: 0 1px #ededed;
     icon-shadow: 0 1px #ededed; }
   .button:backdrop,
@@ -197,22 +200,22 @@ GtkGrid:insensitive {
   .toolbar GtkComboBox .button:backdrop,
   .spinbutton.vertical .button:backdrop {
     background-image: linear-gradient(to bottom, #ededed);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
     box-shadow: none;
     text-shadow: none;
     icon-shadow: none;
-    color: #748489; }
+    color: #2e3436; }
     .button:backdrop:active,
     .toolbar .button.raised:backdrop:active,
     .toolbar .raised .button:backdrop:active,
     .toolbar GtkComboBox .button:backdrop:active,
     .spinbutton.vertical .button:backdrop:active {
       background-image: linear-gradient(to bottom, #a1a1a1);
+      border-color: #a1a1a1;
       border-width: 1px;
       border-style: solid;
-      border-color: #a1a1a1;
       box-shadow: none;
       text-shadow: none;
       icon-shadow: none;
@@ -222,7 +225,7 @@ GtkGrid:insensitive {
     .toolbar .raised .button:backdrop:insensitive,
     .toolbar GtkComboBox .button:backdrop:insensitive,
     .spinbutton.vertical .button:backdrop:insensitive {
-      color: rgba(116, 132, 137, 0.5);
+      color: #c7c7c7;
       border-color: #c7c7c7; }
     .button:backdrop:insensitive:active,
     .toolbar .button.raised:backdrop:insensitive:active,
@@ -238,23 +241,25 @@ GtkGrid:insensitive {
   .toolbar .raised .button:insensitive,
   .toolbar GtkComboBox .button:insensitive,
   .spinbutton.vertical .button:insensitive {
-    background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0.5));
+    background-image: linear-gradient(to bottom, transparent);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
     box-shadow: 0 1px rgba(255, 255, 255, 0.05);
     text-shadow: none;
-    icon-shadow: none; }
+    icon-shadow: none;
+    color: #748489; }
     .button:insensitive:active,
     .toolbar .button.raised:insensitive:active,
     .toolbar .raised .button:insensitive:active,
     .toolbar GtkComboBox .button:insensitive:active,
     .spinbutton.vertical .button:insensitive:active {
-      background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0.5));
+      background-image: linear-gradient(to bottom, transparent);
+      border-color: #a1a1a1;
       border-width: 1px;
       border-style: solid;
-      border-color: #a1a1a1;
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
       text-shadow: none;
       icon-shadow: none; }
   .button.suggested-action,
@@ -263,10 +268,11 @@ GtkGrid:insensitive {
   .toolbar GtkComboBox .suggested-action.button,
   .spinbutton.vertical .button.suggested-action {
     background-image: linear-gradient(to bottom, #98b9dc, #729fcf 40%, #4c85c2);
+    border-color: #2b537d;
     border-width: 1px;
     border-style: solid;
-    border-color: #2b537d;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
     text-shadow: 0 1px white;
     icon-shadow: 0 1px white;
     color: white; }
@@ -280,10 +286,11 @@ GtkGrid:insensitive {
     .spinbutton.vertical .button.suggested-action:active,
     .spinbutton.vertical .button.suggested-action:hover:active {
       background-image: linear-gradient(to bottom, #386ca3, #3e78b6 5%, #4c85c2);
-      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+      border-color: #2b537d;
       border-width: 1px;
       border-style: solid;
-      border-color: #2b537d;
+      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
       text-shadow: 0 1px #729fcf;
       icon-shadow: 0 1px #729fcf; }
     .button.suggested-action:hover,
@@ -292,10 +299,11 @@ GtkGrid:insensitive {
     .toolbar GtkComboBox .suggested-action.button:hover,
     .spinbutton.vertical .button.suggested-action:hover {
       background-image: linear-gradient(to bottom, #a7c3e1, #81a9d4 40%, #729fcf);
+      border-color: #2b537d;
       border-width: 1px;
       border-style: solid;
-      border-color: #2b537d;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+      box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
       text-shadow: 0 1px white;
       icon-shadow: 0 1px white; }
     .button.suggested-action:backdrop,
@@ -304,9 +312,9 @@ GtkGrid:insensitive {
     .toolbar GtkComboBox .suggested-action.button:backdrop,
     .spinbutton.vertical .button.suggested-action:backdrop {
       background-image: linear-gradient(to bottom, #729fcf);
+      border-color: #2b537d;
       border-width: 1px;
       border-style: solid;
-      border-color: #2b537d;
       box-shadow: none;
       text-shadow: none;
       icon-shadow: none; }
@@ -317,9 +325,9 @@ GtkGrid:insensitive {
     .spinbutton.vertical .button.suggested-action:insensitive {
       color: #748489;
       background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0.5));
+      border-color: #a1a1a1;
       border-width: 1px;
       border-style: solid;
-      border-color: #a1a1a1;
       box-shadow: 0 1px rgba(255, 255, 255, 0.05);
       text-shadow: none;
       icon-shadow: none; }
@@ -329,9 +337,9 @@ GtkGrid:insensitive {
       .toolbar GtkComboBox .suggested-action.button:insensitive:backdrop,
       .spinbutton.vertical .button.suggested-action:insensitive:backdrop {
         background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0));
+        border-color: rgba(161, 161, 161, 0.5);
         border-width: 1px;
         border-style: solid;
-        border-color: rgba(161, 161, 161, 0.5);
         box-shadow: 0 1px rgba(255, 255, 255, 0.05);
         text-shadow: none;
         icon-shadow: none; }
@@ -347,10 +355,11 @@ GtkGrid:insensitive {
   .toolbar GtkComboBox .destructive-action.button,
   .spinbutton.vertical .button.destructive-action {
     background-image: linear-gradient(to bottom, #f35858, #ef2929 40%, #d51010);
+    border-color: #760909;
     border-width: 1px;
     border-style: solid;
-    border-color: #760909;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
     text-shadow: 0 1px white;
     icon-shadow: 0 1px white;
     color: white; }
@@ -364,10 +373,11 @@ GtkGrid:insensitive {
     .spinbutton.vertical .button.destructive-action:active,
     .spinbutton.vertical .button.destructive-action:hover:active {
       background-image: linear-gradient(to bottom, #a60c0c, #bd0e0e 5%, #d51010);
-      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+      border-color: #760909;
       border-width: 1px;
       border-style: solid;
-      border-color: #760909;
+      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+      box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
       text-shadow: 0 1px #ef2929;
       icon-shadow: 0 1px #ef2929; }
     .button.destructive-action:hover,
@@ -376,10 +386,11 @@ GtkGrid:insensitive {
     .toolbar GtkComboBox .destructive-action.button:hover,
     .spinbutton.vertical .button.destructive-action:hover {
       background-image: linear-gradient(to bottom, #f46b6b, #f03c3c 40%, #ef2929);
+      border-color: #760909;
       border-width: 1px;
       border-style: solid;
-      border-color: #760909;
       box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+      box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
       text-shadow: 0 1px white;
       icon-shadow: 0 1px white; }
     .button.destructive-action:backdrop,
@@ -388,9 +399,9 @@ GtkGrid:insensitive {
     .toolbar GtkComboBox .destructive-action.button:backdrop,
     .spinbutton.vertical .button.destructive-action:backdrop {
       background-image: linear-gradient(to bottom, #ef2929);
+      border-color: #760909;
       border-width: 1px;
       border-style: solid;
-      border-color: #760909;
       box-shadow: none;
       text-shadow: none;
       icon-shadow: none; }
@@ -401,9 +412,9 @@ GtkGrid:insensitive {
     .spinbutton.vertical .button.destructive-action:insensitive {
       color: #748489;
       background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0.5));
+      border-color: #a1a1a1;
       border-width: 1px;
       border-style: solid;
-      border-color: #a1a1a1;
       box-shadow: 0 1px rgba(255, 255, 255, 0.05);
       text-shadow: none;
       icon-shadow: none; }
@@ -413,9 +424,9 @@ GtkGrid:insensitive {
       .toolbar GtkComboBox .destructive-action.button:insensitive:backdrop,
       .spinbutton.vertical .button.destructive-action:insensitive:backdrop {
         background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0));
+        border-color: rgba(161, 161, 161, 0.5);
         border-width: 1px;
         border-style: solid;
-        border-color: rgba(161, 161, 161, 0.5);
         box-shadow: 0 1px rgba(255, 255, 255, 0.05);
         text-shadow: none;
         icon-shadow: none; }
@@ -662,25 +673,27 @@ GtkPopover {
   box-shadow: none; }
   .button.titlebutton:hover {
     background-image: linear-gradient(to bottom, white, #ededed 40%, lightgray);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
     box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
     text-shadow: 0 1px white;
     icon-shadow: 0 1px white; }
   .button.titlebutton:active {
     background-image: linear-gradient(to bottom, #bababa, #c7c7c7 5%, lightgray);
-    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
+    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
+    box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2);
     text-shadow: 0 1px #ededed;
     icon-shadow: 0 1px #ededed; }
   .button.titlebutton:backdrop {
     background-image: linear-gradient(to bottom, #ededed);
+    border-color: #a1a1a1;
     border-width: 1px;
     border-style: solid;
-    border-color: #a1a1a1;
     box-shadow: none;
     text-shadow: none;
     icon-shadow: none;
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained.scss b/themes/Adwaita/gtk-3.0/gtk-contained.scss
index f8fcec9..f397049 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained.scss
+++ b/themes/Adwaita/gtk-3.0/gtk-contained.scss
@@ -10,21 +10,33 @@ $variant: 'light';
 $theme_base_color: #ffffff;
 $theme_bg_color: #ededed;
 $theme_fg_color: #2e3436;
+
 $theme_selected_fg_color: #ffffff;
 $theme_selected_bg_color: #729fcf;
+
+$insensitive_fg_color: lighten($theme_fg_color, 30%);
+$insensitive_bg_color: transparent;
+
 $borders_color: darken($theme_bg_color,30%);
 $borders_edge: transparentize($theme_base_color,0.95);
+
 $theme_shade: rgba(0,0,0,.5); //shadow seems to be a reserved word
 $wm_shadow: transparentize(black, 0.25);
 
 $link_color: lighten($theme_selected_bg_color,10%);
+
 $warning_color: #f57900;
 $error_color: #cc0000;
 $success_color: $theme_selected_bg_color;
 $destructive_color: #ef2929;
 
-$insensitive_fg_color: lighten($theme_fg_color, 30%);
-$insensitive_bg_color: transparent;
+
+//colors for the backdrop state, derived from the main colors.
+$backdrop_base_color: darken($theme_base_color,5%);
+$backdrop_bg_color: $theme_bg_color;
+$backdrop_fg_color: $theme_fg_color;
+$backdrop_insensitive_color: darken($backdrop_bg_color,15%);
+$backdrop_borders_color: $borders_color;
 
 // common drawing routines
 @import 'drawing';


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