NTP5: Re-implementing favicons for Most Visited Pages.

This is the reimplementation of https://codereview.chromium.org/11416091/, without the merge problems that was introduced in one of the latest Patch Lists.


BUG=

Review URL: https://chromiumcodereview.appspot.com/11316206

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

chrome/browser/resources/ntp_search/new_tab.js

@@ -37,7 +37,7 @@ cr.define('ntp', function() {
    * @type {number}
    * @const
    */
-  var HEIGHT_FOR_BOTTOM_PANEL = 550;
+  var HEIGHT_FOR_BOTTOM_PANEL = 558;
 
   /**
    * The Bottom Panel width required to show 6 cols of Tiles, which is used

chrome/browser/resources/ntp_search/thumbnail_page.css

@@ -50,7 +50,6 @@
 
 .thumbnail .title,
 .thumbnail-banner {
-  bottom: -18px;
   color: #777;
   font-size: 0.9167em;
   overflow: hidden;
@@ -61,6 +60,18 @@
   width: 100%;
 }
 
+.thumbnail .title {
+  bottom: -26px;
+}
+
+.thumbnail-banner {
+  bottom: 25px;
+  display: block;
+  font-size: 1.14em;
+  margin: 0 7px;
+  width: 88%;
+}
+
 .thumbnail,
 .thumbnail-wrapper,
 .thumbnail-card {
@@ -74,19 +85,11 @@
   width: 100%;
 }
 
-.thumbnail-banner {
-  bottom: 13px;
-  display: block;
-  font-size: 1.14em;
-  margin: 0 7px;
-  width: 88%;
-}
-
 .thumbnail-favicon {
   height: 16px;
   margin: 0 auto;
   position: relative;
-  top: 19px;
+  top: -8px;
   width: 16px;
 }
 

chrome/browser/resources/ntp_search/thumbnail_page.js

@@ -85,9 +85,12 @@ cr.define('ntp', function() {
       if (banner)
         thumbnailImage.removeChild(banner);
 
-      var favicon = thumbnailImage.querySelector('.thumbnail-favicon');
-      if (favicon)
-        thumbnailImage.removeChild(favicon);
+      var favicon = this.querySelector('.thumbnail-favicon') ||
+                    this.ownerDocument.createElement('div');
+      favicon.className = 'thumbnail-favicon';
+      favicon.style.backgroundImage =
+          url('chrome://favicon/size/16/' + dataUrl);
+      this.appendChild(favicon);
 
       var self = this;
       var image = new Image();
@@ -103,13 +106,6 @@ cr.define('ntp', function() {
         // TODO(jeremycho): Consult with UX on URL truncation.
         banner.textContent = dataUrl.replace(/^(http:\/\/)?(www\.)?|\/$/gi, '');
         thumbnailImage.appendChild(banner);
-
-        favicon = thumbnailImage.querySelector('.thumbnail-favicon') ||
-            self.ownerDocument.createElement('div');
-        favicon.className = 'thumbnail-favicon';
-        favicon.style.backgroundImage =
-            url('chrome://favicon/size/16/' + dataUrl);
-        thumbnailImage.appendChild(favicon);
       };
 
       var thumbnailUrl = ntp.getThumbnailUrl(dataUrl);

chrome/browser/ui/search/search_ui.cc

@@ -13,7 +13,7 @@
 namespace chrome {
 namespace search {
 
-const int kMinContentHeightForBottomBookmarkBar = 550;
+const int kMinContentHeightForBottomBookmarkBar = 558;
 
 } //  namespace search
 } //  namespace chrome