Refactoring the NTP.

chrome/browser/resources/ntp_search/thumbnail_page.css

Index: chrome/browser/resources/ntp_search/thumbnail_page.css
diff --git a/chrome/browser/resources/ntp_search/thumbnail_page.css b/chrome/browser/resources/ntp_search/thumbnail_page.css
new file mode 100644
index 0000000000000000000000000000000000000000..4c734c743cbeb387471ef4a7aa4369e0f2192377
--- /dev/null
+++ b/chrome/browser/resources/ntp_search/thumbnail_page.css
@@ -0,0 +1,92 @@
+.close-button {
+  position: absolute;
+  background: no-repeat;
+  background-color: transparent;
+  /* TODO(estade): this should animate between states. */
+  background-image: -webkit-image-set(
+      url('../../../../ui/resources/default_100_percent/close_bar.png') 1x,
+      url('../../../../ui/resources/default_200_percent/close_bar.png') 2x);
+  border: 0;
+  cursor: default;
+  display: inline-block;
+  height: 16px;
+  padding: 0;
+  width: 16px;
+  z-index: 999;
+}
+
+.close-button:hover,
+.close-button:focus {
+  background-image: -webkit-image-set(
+      url('../../../../ui/resources/default_100_percent/close_bar_hover.png')
+          1x,
+      url('../../../../ui/resources/default_200_percent/close_bar_hover.png')
+          2x);
+}
+
+.close-button:active {
+  background-image: -webkit-image-set(
+      url('../../../../ui/resources/default_100_percent/close_bar_pressed.png')
+          1x,
+      url('../../../../ui/resources/default_200_percent/close_bar_pressed.png')
+          2x);
+}
+
+/* other */
+
+.most-visited {
+  display: block;
+  width: 100%;
+  height: 100%;
+  position: relative;
+}
+
+.most-visited .thumbnail-wrapper {
+  display: block;
+}
+
+.most-visited .thumbnail {
+  display: block;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  background-size: 100%;
+}
+
+.most-visited .title {
+  position: absolute;
+  display: none;
+  width: 100%;
+  font: 11px Arial;
+  color: #777;
+  text-align: center;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.most-visited:hover .title {
+  display: block;
+  bottom: -18px;
+}
+
+.most-visited .close-button {
+  right: 2px;
+  top: 2px;
+  opacity: 0;
+  -webkit-transition: opacity 500ms ease-in-out;
+}
+
+html[dir=rtl] .most-visited .close-button {
+  left: 0;
+  right: auto;
+}
+
+.most-visited:hover .close-button {
+  -webkit-transition-delay: 500ms;
+  opacity: 1;
+}
+
+.most-visited .close-button:hover {
+  -webkit-transition: none;
+}