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

[Florian Müllner <fmuellner src gnome org>]

commit 501ea2a6c30ca658e18a925a94e0bfa292087419
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Sat Aug 31 15:05:53 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

 data/theme/gnome-shell.css |   22 +++++++++++++++-------
 js/ui/iconGrid.js          |    7 ++++++-
 2 files changed, 21 insertions(+), 8 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 9ed2867..8e8b755 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,21 @@ 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 {
+    /* since the label controls its own spacing, it is visually more
+    consistent to use different padding values 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 +1012,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 +1028,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 +1043,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 {
diff --git a/js/ui/iconGrid.js b/js/ui/iconGrid.js
index 178a841..bcadffa 100644
--- a/js/ui/iconGrid.js
+++ b/js/ui/iconGrid.js
@@ -21,7 +21,12 @@ 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 });
         this.actor._delegate = this;