NTP5: Improving the Tile Page resize logic

chrome/browser/resources/ntp_search/new_tab.css

Index: chrome/browser/resources/ntp_search/new_tab.css
diff --git a/chrome/browser/resources/ntp_search/new_tab.css b/chrome/browser/resources/ntp_search/new_tab.css
index 85ed2d041fe15c96b07d5e6db4da4c343b1f61d7..f370b69da522b2af5dff9e9b0d0116282cbaed13 100644
--- a/chrome/browser/resources/ntp_search/new_tab.css
+++ b/chrome/browser/resources/ntp_search/new_tab.css
@@ -10,13 +10,14 @@ body {
   background: whiteSmoke;
   /* TODO(pedrosimonetti): Confirm with designers/engineers what do we want
    * to do regarding font family, once AFAIK we want to use Arial always. */
-  font-family: Arial;
+  font-family: Arial !important;

[jeremycho_google, 2012/08/23 01:09:28]

Is this necessary?  I don't see font-family being overridden anywhere.

[pedrosimonetti2, 2012/08/24 00:22:15]

The font-family and size is being set using JavaScript (based on values that are
in loadTimeData), so the only way to override is to use !important. This is just
a temporary fix. We need to talk to UX folks to confirm we want the same font on
all platforms (which I'm 90% sure is what they want) and we need to confirm with
Evan which is the best place to put this change. Maybe in th C++ code where the
values that are passed to loadTimeData are defined.

[jeremycho_google, 2012/08/24 00:54:42]

Ah now I see where this happens.  Sounds like C++ might be the right place, but
I'm fine with doing that later.
On 2012/08/24 00:22:15, pedrosimonetti wrote:

   margin: 0;
   overflow: hidden;
   padding: 0;
 }
 
 #card-slider-frame {
+  -webkit-transition: opacity 250ms, -webkit-transform 250ms;
   bottom: 0;
   overflow: hidden;
   position: absolute;
@@ -24,6 +25,11 @@ body {
   width: 100%;
 }
 
+.hide-card-slider {
+  -webkit-transform: translate3d(0, 170px, 0);
+  opacity: 0;
+}
+
 #page-list {
   display: -webkit-box;
   position: static;
@@ -50,6 +56,7 @@ body {
 
 #dot-list li {
   display: inline-block;
+  font-size: 1.0833em;
   margin-left: 13px;
   margin-right: 13px;
   min-width: 55px;  /* TODO(pedrosimonetti): Confirm value with Marcin. */