[gnome-themes-standard/wip/sass] some more work on buttons, commented out curse inducing wildcards



commit 9106e4053364b381c74558fc3d76f8e99903144b
Author: Lapo Calamandrei <calamandrei gmail com>
Date:   Sat May 17 16:56:41 2014 +0200

    some more work on buttons, commented out curse inducing wildcards

 themes/Adwaita/gtk-3.0/_common.scss           |   40 ++++++++----
 themes/Adwaita/gtk-3.0/_drawing.scss          |    7 ++
 themes/Adwaita/gtk-3.0/gtk-contained-dark.css |    6 +-
 themes/Adwaita/gtk-3.0/gtk-contained.css      |   87 ++++++++++++++----------
 4 files changed, 89 insertions(+), 51 deletions(-)
---
diff --git a/themes/Adwaita/gtk-3.0/_common.scss b/themes/Adwaita/gtk-3.0/_common.scss
index 0e8a8e1..d3cf470 100644
--- a/themes/Adwaita/gtk-3.0/_common.scss
+++ b/themes/Adwaita/gtk-3.0/_common.scss
@@ -58,8 +58,9 @@ debug {
     background-color: $theme_bg_color;
 }
 
+/* using these wildcard causes tons of problems, we need to avoid them as much as possible
+   commented for now
 .background:backdrop {
-    /* I want everything nice and flat in the unfocused window */
     text-shadow: none;
     icon-shadow: none;
 
@@ -84,13 +85,12 @@ debug {
 }
 
 *:insensitive:backdrop {
-    /* I want everything nice and flat in the unfocused window */
     text-shadow: none;
     icon-shadow: none;
     color: lighten($theme_fg_color,10%);
 }
+*/
 
-/* Apply effects to insensitive and prelit images */
 *:insensitive {
     -gtk-image-effect: dim;
 }
@@ -98,9 +98,6 @@ debug {
 *:hover {
     -gtk-image-effect: highlight;
 }
-*:hover {
-    -gtk-image-effect: highlight;
-}
 
 .gtkstyle-fallback {
     background-color: $theme_bg_color;
@@ -138,6 +135,10 @@ GtkGrid:insensitive {
     background-color: transparent;
 }
 
+GtkLabel {        //this is a test
+  color: inherit;
+}
+
 // spinner animation
 
 @keyframes spin {
@@ -224,13 +225,22 @@ GtkGrid:insensitive {
     @include button_active($theme_bg_color);
   }
   &:backdrop {
+    // FIXME we need one or two backdrop colors
     @include button_backdrop($theme_bg_color);
     color: $insensitive_fg_color;
     &:active {
-      @include button_backdrop(darken($theme_bg_color, 10%));
+      @include button_backdrop_active($theme_bg_color);
+      color: $theme_bg_color;
+    }
+    &:insensitive {
+      color: transparentize($insensitive_fg_color,0.5);
+      border-color: darken($theme_bg_color,15%);
+    }
+    &:insensitive:active {
+      background-image: linear-gradient(to bottom, darken($theme_bg_color,15%));
+      border-color: darken($theme_bg_color,15%);
       box-shadow: none;
-      border: 1px solid darken($theme_bg_color,30%);
-      color: $theme_fg_color;
+      color: $theme_bg_color;
     }
   }
   &:insensitive {
@@ -239,9 +249,8 @@ GtkGrid:insensitive {
       @include button_insensitive_active($theme_bg_color);
     }
   }
-  &:backdrop:insensitive {
-    @include button_insensitive(transparentize($theme_bg_color,0.5));
-  }
+  // button label can't be colored easily, need to match for the GtkLabel
+  
   /* Suggested and Destructive Action buttons */
   @each $b_type, $b_color in  (suggested-action, $theme_selected_bg_color), 
                               (destructive-action, $destructive_color) {
@@ -272,6 +281,13 @@ GtkGrid:insensitive {
   }
 }
 
+/* GtkComboBoxes text color*/
+GtkComboBox {
+  &:insensitive { color: $insensitive_fg_color; }
+  &:backdrop { color: $insensitive_fg_color; }
+  &:backdrop:insensitive { color: transparentize($insensitive_fg_color,0.5); }
+}
+
 /* menu/popover buttons */
 .menuitem.button, {
   color: $theme_fg_color;
diff --git a/themes/Adwaita/gtk-3.0/_drawing.scss b/themes/Adwaita/gtk-3.0/_drawing.scss
index 7b2333a..5e157e3 100644
--- a/themes/Adwaita/gtk-3.0/_drawing.scss
+++ b/themes/Adwaita/gtk-3.0/_drawing.scss
@@ -76,6 +76,13 @@ $widget_bottom_hilight: 0 1px $borders_edge; //outer hilight "used" on
   @include _button_text_shadow(none);
 }
 
+ mixin button_backdrop_active ($c) {
+  background-image: linear-gradient(to bottom, darken($c,30%));
+  @include _button_borders($c);
+  @include _button_box_shadow(none);
+  @include _button_text_shadow(none);
+}
+
 @mixin button_insensitive ($c) {
   background-image: linear-gradient(to bottom, transparentize($c,0.5));
   @include _button_borders($c);
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained-dark.css b/themes/Adwaita/gtk-3.0/gtk-contained-dark.css
index 694a01f..a90758b 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained-dark.css
+++ b/themes/Adwaita/gtk-3.0/gtk-contained-dark.css
@@ -1,10 +1,10 @@
 /*
 Syntax error: Undefined variable: "$borders_color".
-        on line 474 of _common.scss
+        on line 490 of _common.scss
         from line 23 of ./gtk-contained-dark.scss
 
 Backtrace:
-_common.scss:474
+_common.scss:490
 ./gtk-contained-dark.scss:23
 /usr/local/share/gems/gems/sass-3.3.7/lib/sass/script/tree/variable.rb:49:in `_perform'
 /usr/local/share/gems/gems/sass-3.3.7/lib/sass/script/tree/node.rb:50:in `perform'
@@ -79,4 +79,4 @@ org/jruby/RubyProc.java:249:in `call'
 body:before {
   white-space: pre;
   font-family: monospace;
-  content: "Syntax error: Undefined variable: \"$borders_color\".\A         on line 474 of _common.scss\A    
     from line 23 of ./gtk-contained-dark.scss"; }
+  content: "Syntax error: Undefined variable: \"$borders_color\".\A         on line 490 of _common.scss\A    
     from line 23 of ./gtk-contained-dark.scss"; }
diff --git a/themes/Adwaita/gtk-3.0/gtk-contained.css b/themes/Adwaita/gtk-3.0/gtk-contained.css
index e866e37..8a91b19 100644
--- a/themes/Adwaita/gtk-3.0/gtk-contained.css
+++ b/themes/Adwaita/gtk-3.0/gtk-contained.css
@@ -40,42 +40,44 @@ debug {
   color: #2e3436;
   background-color: #ededed; }
 
+/* using these wildcard causes tons of problems, we need to avoid them as much as possible
+   commented for now
 .background:backdrop {
-  /* I want everything nice and flat in the unfocused window */
-  text-shadow: none;
-  icon-shadow: none;
-  color: #454f52; }
+    text-shadow: none;
+    icon-shadow: none;
+
+    color: lighten($theme_fg_color,10%);
+}
 
 *:selected,
 *:selected:focus {
-  background-color: #729fcf;
-  color: white; }
+    background-color: $theme_selected_bg_color;
+    color: $theme_selected_fg_color;
+}
 
 *:selected:backdrop {
-  background-color: #729fcf;
-  color: white; }
+    background-color: $theme_selected_bg_color;
+    color: $theme_selected_fg_color;
+}
 
 *:insensitive {
-  background-color: transparent;
-  color: #748489;
-  border-color: #bababa; }
+    background-color: $insensitive_bg_color;
+    color: $insensitive_fg_color;
+    border-color: darken($theme_bg_color,20%);
+}
 
 *:insensitive:backdrop {
-  /* I want everything nice and flat in the unfocused window */
-  text-shadow: none;
-  icon-shadow: none;
-  color: #454f52; }
-
-/* Apply effects to insensitive and prelit images */
+    text-shadow: none;
+    icon-shadow: none;
+    color: lighten($theme_fg_color,10%);
+}
+*/
 *:insensitive {
   -gtk-image-effect: dim; }
 
 *:hover {
   -gtk-image-effect: highlight; }
 
-*:hover {
-  -gtk-image-effect: highlight; }
-
 .gtkstyle-fallback {
   background-color: #ededed;
   color: #2e3436; }
@@ -106,6 +108,9 @@ GtkGrid,
 GtkGrid:insensitive {
   background-color: transparent; }
 
+GtkLabel {
+  color: inherit; }
+
 @keyframes spin {
   to {
     -gtk-icon-transform: rotate(1turn); } }
@@ -214,16 +219,30 @@ GtkGrid:insensitive {
     .toolbar .raised .button:backdrop:active,
     .toolbar GtkComboBox .button:backdrop:active,
     .spinbutton.vertical .button:backdrop:active {
-      background-image: linear-gradient(to bottom, lightgray);
+      background-image: linear-gradient(to bottom, #a1a1a1);
       border-width: 1px;
       border-style: solid;
-      border-color: #878787;
+      border-color: #a1a1a1;
       box-shadow: none;
       text-shadow: none;
       icon-shadow: none;
+      color: #ededed; }
+    .button:backdrop:insensitive,
+    .toolbar .button.raised:backdrop:insensitive,
+    .toolbar .raised .button:backdrop:insensitive,
+    .toolbar GtkComboBox .button:backdrop:insensitive,
+    .spinbutton.vertical .button:backdrop:insensitive {
+      color: rgba(116, 132, 137, 0.5);
+      border-color: #c7c7c7; }
+    .button:backdrop:insensitive:active,
+    .toolbar .button.raised:backdrop:insensitive:active,
+    .toolbar .raised .button:backdrop:insensitive:active,
+    .toolbar GtkComboBox .button:backdrop:insensitive:active,
+    .spinbutton.vertical .button:backdrop:insensitive:active {
+      background-image: linear-gradient(to bottom, #c7c7c7);
+      border-color: #c7c7c7;
       box-shadow: none;
-      border: 1px solid #a1a1a1;
-      color: #2e3436; }
+      color: #ededed; }
   .button:insensitive,
   .toolbar .button.raised:insensitive,
   .toolbar .raised .button:insensitive,
@@ -248,18 +267,6 @@ GtkGrid:insensitive {
       box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.2), 0 1px rgba(255, 255, 255, 0.05);
       text-shadow: none;
       icon-shadow: none; }
-  .button:backdrop:insensitive,
-  .toolbar .button.raised:backdrop:insensitive,
-  .toolbar .raised .button:backdrop:insensitive,
-  .toolbar GtkComboBox .button:backdrop:insensitive,
-  .spinbutton.vertical .button:backdrop:insensitive {
-    background-image: linear-gradient(to bottom, rgba(237, 237, 237, 0));
-    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; }
   .button.suggested-action,
   .toolbar .button.raised.suggested-action,
   .toolbar .raised .button.suggested-action,
@@ -429,6 +436,14 @@ GtkGrid:insensitive {
     .spinbutton.vertical .button.destructive-action GtkLabel:backdrop:insensitive {
       color: rgba(116, 132, 137, 0.5); }
 
+/* GtkComboBoxes text color*/
+GtkComboBox:insensitive {
+  color: #748489; }
+GtkComboBox:backdrop {
+  color: #748489; }
+GtkComboBox:backdrop:insensitive {
+  color: rgba(116, 132, 137, 0.5); }
+
 /* menu/popover buttons */
 .menuitem.button, .menuitem.button:active, .menuitem.button:insensitive, .menuitem.button:active:insensitive 
{
   color: #2e3436;


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