[gnome-shell/wip/paging-release2: 22/23] theme: Change icons style to follow new design

[Carlos Soriano <csoriano src gnome org>]

commit 07adf56b59b88ad027d3d2b22e60e242bce05fef
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Wed Jul 17 11:03:49 2013 +0200

    theme: Change icons style to follow new design
    
    Change the background, glow and labels of the Dash and AppDisplay
    to follow the new design
    
    https://bugzilla.gnome.org/show_bug.cgi?id=706081

 data/theme/gnome-shell.css |   25 +++++++++++++++++--------
 js/ui/iconGrid.js          |    9 +++++++--
 2 files changed, 24 insertions(+), 10 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 9d05951..9e29103 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -908,9 +908,9 @@ StScrollBar StButton#vhandle:active {
 /* Application Launchers, Grid and List results */
 
 .icon-grid {
-    spacing: 36px;
-    -shell-grid-horizontal-item-size: 118px;
-    -shell-grid-vertical-item-size: 118px;
+    spacing: 30px;
+    -shell-grid-horizontal-item-size: 136px;
+    -shell-grid-vertical-item-size: 136px;
 }
 
 .icon-grid .overview-icon {
@@ -986,13 +986,22 @@ StScrollBar StButton#vhandle:active {
     background-image: url("more-results.svg");
 }
 
+.app-well-app > .overview-icon.overview-icon-with-label,
+.grid-search-result .overview-icon.overview-icon-with-label {
+    /* visually, since the label control its own espacing inside,
+       seems more visual consistent to have diferent padding for
+       top and bottom */
+    padding: 10px 8px 5px 8px;
+    spacing: 4px;
+}
+
 .app-well-app > .overview-icon,
 .show-apps > .overview-icon,
 .search-provider-icon,
 .list-search-result,
 .grid-search-result .overview-icon {
     border-radius: 4px;
-    padding: 3px;
+    padding: 6px;
     border: 1px rgba(0,0,0,0);
     transition-duration: 100ms;
     text-align: center;
@@ -1004,7 +1013,7 @@ StScrollBar StButton#vhandle:active {
 
 .app-folder-popup {
     -arrow-border-radius: 8px;
-    -arrow-background-color: black;
+    -arrow-background-color: rgba(0,0,0,0.3);
     -arrow-base: 24px;
     -arrow-rise: 11px;
 }
@@ -1020,7 +1029,7 @@ StScrollBar StButton#vhandle:active {
 }
 
 .app-well-app.app-folder > .overview-icon {
-    background-color: rgba(0,0,0,0.5);
+    background-color: rgba(0,0,0,0.3);
 }
 
 .app-well-app:hover > .overview-icon,
@@ -1035,7 +1044,7 @@ StScrollBar StButton#vhandle:active {
 }
 
 .app-display .app-well-app > .overview-icon {
-    border-radius: 10px;
+    border-radius: 4px;
 }
 
 .list-search-result:hover .list-search-result-description {
@@ -1650,7 +1659,7 @@ StScrollBar StButton#vhandle:active {
 }
 
 .chat-notification-scrollview{
-       max-height: 22em;
+    max-height: 22em;
 }
 
 .subscription-message {
diff --git a/js/ui/iconGrid.js b/js/ui/iconGrid.js
index 9304d41..dee1f76 100644
--- a/js/ui/iconGrid.js
+++ b/js/ui/iconGrid.js
@@ -17,9 +17,14 @@ const BaseIcon = new Lang.Class({
         params = Params.parse(params, { createIcon: null,
                                         setSizeManually: false,
                                         showLabel: true });
-        this.actor = new St.Bin({ style_class: 'overview-icon',
+
+        let styleClass = 'overview-icon';
+        if (params.showLabel)
+            styleClass += ' overview-icon-with-label';
+
+        this.actor = new St.Bin({ style_class: styleClass,
                                   x_fill: true,
-                                  y_fill: true });
+                                  y_fill: true  });
         this.actor._delegate = this;
         this.actor.connect('style-changed',
                            Lang.bind(this, this._onStyleChanged));