NTP: a couple small tweaks

1. Change app image size to 96x96
2. Add 10px horizontal margins
3. Decrease font size a bit
4. Fix text color of the app icons

BUG=None
TEST=None
Review URL: http://codereview.chromium.org/2033007

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@46964 0039d316-1c4b-4281-b951-d872f2087c98

4 files changed, 15 insertions, 7 deletions

diff --git a/chrome/browser/resources/new_new_tab.css b/chrome/browser/resources/new_new_tab.css
index 3286050..1807d01 100644
--- a/chrome/browser/resources/new_new_tab.css
+++ b/chrome/browser/resources/new_new_tab.css
@@ -552,12 +552,12 @@ html[dir=rtl] #option-menu > [command=hide]:before {
 }
 
 .section > * {
-  font-size: 13px;
+  font-size: 12px;
 }
 
 /* small */
 
-@media (max-width: 920px) {
+@media (max-width: 940px) {
 
   #main {
     width: 692px;
@@ -572,6 +572,14 @@ html[dir=rtl] #option-menu > [command=hide]:before {
   }
 }
 
+/* Ensure we have at least 10px horizontal marging. */
+@media (max-width: 712px) {
+  #main {
+    margin-left: 10px;
+    margin-right: 10px;
+  }
+}
+
 /* Apps */
 
 @-webkit-keyframes bounce {
@@ -594,7 +602,7 @@ html[dir=rtl] #option-menu > [command=hide]:before {
   -webkit-transition: background-color .15s;
   background: rgba(255, 255, 255, 0) /* transparent white */
               no-repeat center 5px;
-  background-size: 98px 98px;
+  background-size: 96px 96px;
   border-radius: 10px;
   color: black;
   display: inline-block;
@@ -603,7 +611,7 @@ html[dir=rtl] #option-menu > [command=hide]:before {
   margin-right:5px;
   overflow: hidden;
   padding: 5px;
-  padding-top: 108px; /* 98 + 5 + 5 */
+  padding-top: 106px; /* 96 + 5 + 5 */
   text-align: center;
   text-decoration: none;
   text-overflow: ellipsis;
diff --git a/chrome/browser/resources/new_new_tab.html b/chrome/browser/resources/new_new_tab.html
index 63a3b35..a96464b 100644
--- a/chrome/browser/resources/new_new_tab.html
+++ b/chrome/browser/resources/new_new_tab.html
@@ -82,7 +82,7 @@ document.write('<link id="themecss" rel="stylesheet" ' +
                Date.now() + '">');
 
 function useSmallGrid() {
-  return window.innerWidth <= 920;
+  return window.innerWidth <= 940;
 }
 
 function isRtl() {
diff --git a/chrome/browser/resources/new_tab_theme.css b/chrome/browser/resources/new_tab_theme.css
index ad8cc9a..18fd901 100644
--- a/chrome/browser/resources/new_tab_theme.css
+++ b/chrome/browser/resources/new_tab_theme.css
@@ -119,7 +119,7 @@ body {
 }
 
 #apps-section a {
-  color: $9; /* COLOR_NTP_LINK */
+  color: $8; /* COLOR_NTP_TEXT */
 }
 
 #apps-section a:hover {
diff --git a/chrome/browser/resources/ntp/most_visited.css b/chrome/browser/resources/ntp/most_visited.css
index d8fed45..464506d 100644
--- a/chrome/browser/resources/ntp/most_visited.css
+++ b/chrome/browser/resources/ntp/most_visited.css
@@ -239,7 +239,7 @@ html[dir=rtl] .thumbnail-container > .title > div {
   -webkit-animation: 'fade-in' .15s;
 }
 
-@media (max-width: 920px) {
+@media (max-width: 940px) {
   #most-visited {
     height: 294px;
   }