[gnome-themes-standard] Add a style for destructive buttons



commit c9fd43eee9913c689dfbad90f8e0736fc9efb99b
Author: Allan Day <allanpday gmail com>
Date:   Tue Aug 20 13:30:19 2013 +0100

    Add a style for destructive buttons
    
    This is used in a few applications to indicate when a button has a
    negative consequence.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=706385

 themes/Adwaita/gtk-3.0/gtk-main-common.css |    9 +++++
 themes/Adwaita/gtk-3.0/gtk-widgets.css     |   51 ++++++++++++++++++++++++++++
 2 files changed, 60 insertions(+), 0 deletions(-)
---
diff --git a/themes/Adwaita/gtk-3.0/gtk-main-common.css b/themes/Adwaita/gtk-3.0/gtk-main-common.css
index 7988f9c..8819c33 100644
--- a/themes/Adwaita/gtk-3.0/gtk-main-common.css
+++ b/themes/Adwaita/gtk-3.0/gtk-main-common.css
@@ -1,5 +1,14 @@
 /* common color definitions to the light and dark variations */
 
+/******************************
+ * Destructive action buttons *
+ ******************************/
+ define-color destructive_action_button_a #e03d3d;
+ define-color destructive_action_button_b #ef2929;
+ define-color destructive_action_button_border #9d4242;
+ define-color destructive_action_button_fg @theme_base_color;
+ define-color destructive_action_button_shadow shade(@destructive_action_button_border, 1.15);
+
 /*******
  * OSD *
  *******/
diff --git a/themes/Adwaita/gtk-3.0/gtk-widgets.css b/themes/Adwaita/gtk-3.0/gtk-widgets.css
index 0dd6844..ec69f99 100644
--- a/themes/Adwaita/gtk-3.0/gtk-widgets.css
+++ b/themes/Adwaita/gtk-3.0/gtk-widgets.css
@@ -3162,6 +3162,57 @@ GtkProgressBar.osd.progressbar {
     icon-shadow: none;
 }
 
+/******************************
+ * Destructive action buttons *
+ ******************************/
+.destructive-action.button {
+    background-image: linear-gradient(to bottom,
+                                      @destructive_action_button_a,
+                                      @destructive_action_button_b);
+    border-image: none;
+    border-color: @destructive_action_button_border;
+    border-width: 1px;
+
+    color: @destructive_action_button_fg;
+}
+
+.destructive-action.button:hover {
+    background-image: linear-gradient(to bottom,
+                                      shade(@destructive_action_button_a, 1.10),
+                                      shade(@destructive_action_button_b, 1.05));
+}
+
+.destructive-action.button:active,
+.destructive-action.button:hover:active {
+    background-image: linear-gradient(to bottom,
+                                      @destructive_action_button_b,
+                                      @destructive_action_button_a);
+
+    color: @destructive_action_button_fg;
+}
+
+.destructive-action.button:backdrop {
+    background-image: none;
+    border-image: none;
+    border-color: @unfocused_borders;
+}
+
+.destructive-action.button {
+    text-shadow: 0 1px @destructive_action_button_shadow;
+    icon-shadow: 0 1px @destructive_action_button_shadow;
+}
+
+.destructive-action.button:active,
+.destructive-action.button:hover:active {
+    text-shadow: 0 1px shade(@destructive_action_button_shadow, 1.15);
+    icon-shadow: 0 1px shade(@destructive_action_button_shadow, 1.15);
+}
+
+.destructive-action.button:backdrop {
+    text-shadow: none;
+    icon-shadow: none;
+}
+
 /**************************
  * Selection Mode classes *
  **************************/


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