From dec55a3291d8e5be6a73f4f8fb4f96e54e8e19b5 Mon Sep 17 00:00:00 2001
From: Allan Day <allanpday@gmail.com>
Date: Tue, 2 Aug 2011 16:29:02 +0100
Subject: [PATCH] theme: make modal dialog buttons match the mockups

The buttons should have a glassy transparent look. Also, they should not
be as tall, should light up on hover, and their labels should be white
in order to stand out. Making the labels solid white requires removing the
transparency set in modalDialog.js. Also, add a separate color setting
for the dialog as a whole - this avoids having a white icon.

https://bugzilla.gnome.org/show_bug.cgi?id=655428
---
 data/theme/gnome-shell.css | 20 +++++++++++++-------
 js/ui/modalDialog.js       |  1 -
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 8ed13c55d..9a6218d88 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -1505,7 +1505,7 @@ StTooltip StLabel {
     border-radius: 24px;
     background-color: rgba(0.0, 0.0, 0.0, 0.9);
     border: 2px solid #868686;
-    color: #ffffff;
+    color: #babdb6;
 
     padding-right: 42px;
     padding-left: 42px;
@@ -1521,25 +1521,31 @@ StTooltip StLabel {
     border: 1px solid #8b8b8b;
     border-radius: 18px;
     font-size: 10.5pt;
+    color: white;
 
     margin-left: 10px;
     margin-right: 10px;
 
     padding-left: 32px;
     padding-right: 32px;
-    padding-top: 8px;
-    padding-bottom: 8px;
+    padding-top: 6px;
+    padding-bottom: 6px;
 
     background-gradient-direction: vertical;
-    background-gradient-start: #29323b;
-    background-gradient-end: #121a24;
+    background-gradient-start: rgba(255, 255, 255, 0.2);
+    background-gradient-end: rgba(255, 255, 255, 0);
+}
+
+.modal-dialog-button:hover {
+    background-gradient-start: rgba(255, 255, 255, 0.3);
+    background-gradient-end: rgba(255, 255, 255, 0.1);
 }
 
 .modal-dialog-button:active,
 .modal-dialog-button:pressed {
     border-color: #a5a5a5;
-    background-gradient-start: #121a24;
-    background-gradient-end: #29323b;
+    background-gradient-start: rgba(255, 255, 255, 0);
+    background-gradient-end: rgba(255, 255, 255, 0.2);
 }
 
 .modal-dialog-button:focus {
diff --git a/js/ui/modalDialog.js b/js/ui/modalDialog.js
index ce943b9a2..ab637e622 100644
--- a/js/ui/modalDialog.js
+++ b/js/ui/modalDialog.js
@@ -82,7 +82,6 @@ ModalDialog.prototype = {
                                  y_align: St.Align.START });
 
         this._buttonLayout = new St.BoxLayout({ style_class: 'modal-dialog-button-box',
-                                                opacity:     220,
                                                 vertical:    false });
         this._dialogLayout.add(this._buttonLayout,
                                { expand:  true,