[gnome-themes-standard] Elegant recolorable borders



commit faa12cbd5537d9fd998927043e74ef37386b4110
Author: William Jon McCann <william jon mccann gmail com>
Date:   Mon May 5 20:21:56 2014 -0400

    Elegant recolorable borders
    
    That don't rely on hardcoded colors in assets.

 themes/Adwaita/gtk-3.0/gtk-widgets-borders.css |   70 ++++++++++------------
 themes/Adwaita/gtk-3.0/gtk-widgets.css         |   74 +++++++++--------------
 2 files changed, 61 insertions(+), 83 deletions(-)
---
diff --git a/themes/Adwaita/gtk-3.0/gtk-widgets-borders.css b/themes/Adwaita/gtk-3.0/gtk-widgets-borders.css
index 671d8c3..66a8b9a 100644
--- a/themes/Adwaita/gtk-3.0/gtk-widgets-borders.css
+++ b/themes/Adwaita/gtk-3.0/gtk-widgets-borders.css
@@ -16,21 +16,17 @@ GtkComboBox.combobox-entry .button,
 .trough.highlight,
 GtkSwitch.trough,
 GtkSwitch.trough:active:insensitive,
-.titlebar .titlebutton:hover, 
+.titlebar .titlebutton:hover,
 .titlebar .titlebutton:active {
-    border-image: -gtk-scaled(url("borders/generic-border.png"),url("borders/generic-border 2 png")) 3 3 4 3 
/ 3px 3px 4px 3px stretch;
-    border-radius: 3px;
-    border-width: 1px 1px 2px 1px;
+    box-shadow: inset .5px .5px @borders,
+                inset -.5px .5px @borders,
+                inset .5px -.5px @borders,
+                inset -.5px -.5px @borders;
+    border-image: none;
+    border-width: 0px 0px 1px;
+    border-radius: 3.5px;
     border-style: solid;
-    border-color: transparent;
-}
-
-.trough row {
-    border-image: -gtk-scaled (url("borders/nohl-generic-border.png"),url("borders/nohl-generic-border 2 
png")) 3 / 3px stretch;
-    border-radius: 3px;
-    border-width: 1px;
-    border-style: solid;
-    border-color: transparent;
+    border-color: alpha(white, 0.5);
 }
 
 /* focused element borders */
@@ -38,10 +34,22 @@ GtkSwitch.trough:active:insensitive,
 GtkComboBox.combobox-entry .entry:focus,
 .button.default:active,
 .inline-toolbar.toolbar.vertical .button.default:active,
-GtkSwitch.trough:active { 
-    border-image: -gtk-scaled(url("borders/generic-border-focused.png"),url("borders/generic-border-focused 
2 png")) 3 3 4 3 / 3px 3px 4px 3px stretch;
+GtkSwitch.trough:active {
+    box-shadow: inset .5px .5px @theme_selected_bg_color,
+                inset -.5px .5px @theme_selected_bg_color,
+                inset .5px -.5px @theme_selected_bg_color,
+                inset -.5px -.5px @theme_selected_bg_color;
+    border-image: none;
+    border-width: 0px 0px 1px;
+    border-radius: 3.5px;
+    border-style: solid;
+    border-color: alpha(white, 0.5);
+}
+
+.trough row {
+    border-image: -gtk-scaled (url("borders/nohl-generic-border.png"),url("borders/nohl-generic-border 2 
png")) 3 / 3px stretch;
     border-radius: 3px;
-    border-width: 1px 1px 2px 1px;
+    border-width: 1px;
     border-style: solid;
     border-color: transparent;
 }
@@ -252,33 +260,19 @@ GtkSwitch.trough:backdrop,
     border-color: transparent;
 }
 
+/* suggested action buttons borders */
+.suggested-action.button,
+.suggested-action.button:active,
+/* destructive action buttons borders */
+.destructive-action.button,
+.destructive-action.button:active,
 /* pushed colored buttons borders */
 .selection-mode.toolbar .suggested-action.button,
 .selection-mode.toolbar GtkToolButton.suggested-action .button {
-    border-image: -gtk-scaled 
(url("borders/generic-border-transparent.png"),url("borders/generic-border-transparent 2 png")) 3 3 4 3 / 3px 
3px 4px 3px stretch;
+    border-image: -gtk-scaled (url("borders/button-border.png"),url("borders/button-border 2 png")) 3 3 4 3 
/ 3px 3px 4px 3px stretch;
     border-radius: 4px;
     border-width: 0px 0px 1px 0px;
     border-style: solid;
     border-color: transparent;
-
-}
-
-/* suggested action buttons borders */
-.suggested-action.button,
-.suggested-action.button:active {
-    border-image: 
-gtk-scaled(url("borders/button-border-suggested.png"),url("borders/button-border-suggested 2 png")) 3 3 4 3 
/ 3px 3px 4px 3px stretch;
-    border-radius: 3px;
-    border-width: 1px 1px 2px 1px;
-    border-style: solid;
-    border-color: transparent;
-}
-
-/* destructive action buttons borders */
-.destructive-action.button,
-.destructive-action.button:active {
-    border-image: 
-gtk-scaled(url("borders/button-border-destructive.png"),url("borders/button-border-destructive 2 png")) 3 3 
4 3 / 3px 3px 4px 3px stretch;
-    border-radius: 3px;
-    border-width: 1px 1px 2px 1px;
-    border-style: solid;
-    border-color: transparent;
+    box-shadow: inset 0 1px 0 #fff;
 }
diff --git a/themes/Adwaita/gtk-3.0/gtk-widgets.css b/themes/Adwaita/gtk-3.0/gtk-widgets.css
index 0cc7421..88ebc36 100644
--- a/themes/Adwaita/gtk-3.0/gtk-widgets.css
+++ b/themes/Adwaita/gtk-3.0/gtk-widgets.css
@@ -345,7 +345,7 @@ GtkTreeView.separator:backdrop,
  ****************/
 .entry {
     border-style: solid;
-    padding: 4px;
+    padding: 6px 4px;
 
     /* border-image defined in the -assets variants */
 
@@ -359,9 +359,14 @@ GtkTreeView.separator:backdrop,
 }
 
 .entry:focus {
-    box-shadow: inset 1px 2px alpha(@theme_selected_bg_color, 0.1),
-                inset 1px 1px alpha(@theme_selected_bg_color, 0.1),
-                inset -1px -1px alpha(@theme_selected_bg_color, 0.2); 
+    box-shadow: inset .5px .5px 2px alpha(@theme_selected_bg_color, 0.3),
+                inset -.5px .5px 2px alpha(@theme_selected_bg_color, 0.3),
+                inset .5px -.5px 2px alpha(@theme_selected_bg_color, 0.3),
+                inset -.5px -.5px 2px alpha(@theme_selected_bg_color, 0.3),
+                inset .5px .5px alpha(@theme_selected_bg_color, 0.9),
+                inset -.5px .5px alpha(@theme_selected_bg_color, 0.9),
+                inset .5px -.5px alpha(@theme_selected_bg_color, 0.9),
+                inset -.5px -.5px alpha(@theme_selected_bg_color, 0.9);
     transition: all 200ms ease-in;
 }
 
@@ -2012,36 +2017,41 @@ GtkComboBox .separator {
 
 GtkComboBox.combobox-entry .entry:first-child,
 GtkComboBox.combobox-entry .button:first-child {
-    border-image-width: 3px 0 4px 3px;
-    border-radius: 3px 0 0 3px;
-    border-right-width: 0;
+    border-radius: 3.5px 0 0 3.5px;
+    border-image: none;
+    box-shadow: inset .5px .5px shade(@borders, 0.8),
+                inset .5px -.5px shade(@borders, 0.8),
+                inset -1px 0 @inset_dark_color;
 }
 
 GtkComboBox.combobox-entry .entry:last-child,
 GtkComboBox.combobox-entry .button:last-child {
-    border-image-width: 3px 3px 4px 0;
-    border-radius: 0 3px 3px 0;
-    border-left-width: 0;
+    border-radius: 0 3.5px 3.5px 0;
+    border-image: none;
+    box-shadow: inset -.5px .5px shade(@borders, 0.8),
+                inset -.5px -.5px shade(@borders, 0.8);
 }
 
 .primary-toolbar GtkComboBox.combobox-entry .entry:first-child,
 .primary-toolbar GtkComboBox.combobox-entry .button:first-child {
-    border-image-width: 4px 0 4px 4px;
-    border-radius: 3px 0 0 3px;
-    border-right-width: 0;
+    border-radius: 3.5px 0 0 3.5px;
+    border-image: none;
+    box-shadow: inset .5px .5px 2px alpha(@borders, 0.8),
+                inset .5px -.5px 2px alpha(@borders, 0.8),
+                inset .5px .5px @borders,
+                inset .5px -.5px @borders;
 }
 
 .primary-toolbar GtkComboBox.combobox-entry .entry:last-child,
 .primary-toolbar GtkComboBox.combobox-entry .button:last-child {
-    border-image-width: 4px 4px 4px 0;
-    border-radius: 0 3px 3px 0;
-    border-left-width: 0;
+    border-radius: 0 3.5px 3.5px 0;
 }
 
 GtkComboBox.combobox-entry .entry:focus:first-child {
-    box-shadow: inset 1px 2px alpha(@theme_selected_bg_color, 0.1),
-                inset 1px 1px alpha(@theme_selected_bg_color, 0.1),
-                inset 0 -1px alpha(@theme_selected_bg_color, 0.2);
+    box-shadow: inset .5px .5px 2px alpha(@theme_selected_bg_color, 0.8),
+                inset .5px -.5px 2px alpha(@theme_selected_bg_color, 0.8),
+                inset .5px .5px @theme_selected_bg_color,
+                inset .5px -.5px @theme_selected_bg_color;
 }
 
 GtkComboBox.combobox-entry .entry:focus:last-child {
@@ -2050,32 +2060,6 @@ GtkComboBox.combobox-entry .entry:focus:last-child {
                 inset 0 -1px alpha(@theme_selected_bg_color, 0.2);
 }
 
-GtkComboBox.combobox-entry .button:last-child,
-GtkComboBox.combobox-entry .button:hover:last-child,
-GtkComboBox.combobox-entry .button:active:last-child,
-GtkComboBox.combobox-entry .button:hover:active:last-child {
-    box-shadow: inset 1px 0 @inset_dark_color, 
-                inset 0 1px @entry_inset,
-                inset 0 2px alpha(@entry_inset, 0.4);
-}
-
-GtkComboBox.combobox-entry .button:first-child,
-GtkComboBox.combobox-entry .button:hover:first-child,
-GtkComboBox.combobox-entry .button:active:first-child,
-GtkComboBox.combobox-entry .button:hover:active:first-child {
-    box-shadow: inset -1px 0 @inset_dark_color, 
-                inset 0 1px @entry_inset,
-                inset 0 2px alpha(@entry_inset, 0.4);
-}
-
-GtkComboBox.combobox-entry .button:insensitive:first-child {
-    box-shadow: inset -1px 0 @inset_dark_color;
-}
-
-GtkComboBox.combobox-entry .button:insensitive:last-child {
-    box-shadow: inset 1px 0 @inset_dark_color;
-}
-
 GtkComboBox.combobox-entry .button:backdrop:first-child,
 GtkComboBox.combobox-entry .button:backdrop:last-child {
     box-shadow: none;


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