Make the new new tab page the default new tab page....

chrome/browser/resources/new_new_tab.css

Index: chrome/browser/resources/new_new_tab.css
===================================================================
--- chrome/browser/resources/new_new_tab.css	(revision 19334)
+++ chrome/browser/resources/new_new_tab.css	(working copy)
@@ -1,642 +0,0 @@
-html {
-  /* This is needed because of chrome://theme/css/new_tab.css */
-  height: 100%;
-}
-
-body {
-  margin: 0;
-}
-
-#main {
-  background: url(chrome://theme/product_logo) no-repeat 0 0px;
-  position: relative;
-  margin: 0 auto;
-  width: 940px;
-  -webkit-transition: width .5s;
-}
-
-html[dir='rtl'] #main {
-  background-position-x: 100%;
-}
-
-.small #main {
-  width: 692px;
-}
-
-html[anim='false'] *,
-.no-anim, .no-anim *,
-.loading * {
-  -webkit-transition: none !important;
-  -webkit-animation: none !important;
-}
-
-/* Most Visited */
-
-#most-visited {
-  position: relative;
-  padding: 0;
-  margin-bottom: 34px;
-  -webkit-user-select: none;
-  -webkit-transition: height .5s, opacity .5s;
-}
-
-@-webkit-keyframes 'thumbnail-enter' {
-  /* 2.5s */
-  0%, 20% {
-    -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, .5);
-    -webkit-border-radius: 4px;
-  }
-
-  100% {
-    -webkit-border-top-left-radius: 0;
-    -webkit-border-top-right-radius: 0;
-    -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0);
-  }
-}
-
-@-webkit-keyframes 'edit-mode-border-enter' {
-  /* 2.5s */
-  0%, 20% {
-    background-color: hsla(213, 66%, 57%, 0);
-    -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0);
-  }
-
-  100% {
-    background-color: hsla(213, 66%, 57%, 1);
-    -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, .5);
-  }
-}
-
-@-webkit-keyframes 'edit-bar-enter' {
-  /* 2.5s */
-  0%, 20% {
-    opacity: 0;
-    pointer-events: none;
-  }
-
-  100% {
-    opacity: 1;
-    pointer-events: inherit;
-  }
-}
-
-.thumbnail-container {
-  position: absolute;
-  -webkit-transition: top .5s, left .5s;
-  color: black;
-  text-decoration: none;
-  -webkit-transition: left .5s, top .5s;
-}
-
-.thumbnail,
-.thumbnail-container .title {
-  width: 212px; /* natural size is 196 */
-  height: 132px; /* 136 */
-  -webkit-transition: width .5s, height .5s;
-}
-
-.small .thumbnail,
-.small .thumbnail-container .title {
-  width: 150px;
-  height: 93px;
-}
-
-.thumbnail-wrapper {
-  display: block;
-  -webkit-background-size: 212px 132px;
-  background: no-repeat 4px 4px;
-  background-color: white;
-  -webkit-border-radius: 5px;
-  -webkit-transition: -webkit-background-size .5s;
-}
-
-.small .thumbnail-wrapper {
-  -webkit-background-size: 150px 93px;
-}
-
-.filler * {
-  visibility: hidden;
-}
-
-.filler {
-  pointer-events: none;
-}
-
-.filler .thumbnail-wrapper {
-  visibility: inherit;
-  border: 1px solid hsl(0, 0%, 90%);
-  background-color: hsl(0, 0%, 95%);
-  -webkit-border-radius: 2px;
-  display: block;
-}
-
-.filler .thumbnail-wrapper .thumbnail {
-  visibility: visible;
-  border-color: hsl(0, 0%, 90%);
-  background-color: hsl(0, 0%, 95%);
-}
-
-.edit-bar {
-  opacity: 0;
-  pointer-events: none;
-  display: -webkit-box;
-  -webkit-box-orient: horizontal;
-  -webkit-box-align: stretch;
-  padding: 3px;
-  padding-bottom: 0;
-  height: 17px; /* 23 - 2 * 3 */
-  -webkit-transition: opacity .5s;
-  cursor: move;
-  font-size: 100%;
-  line-height: 17px;
-  background-image: -webkit-gradient(linear, left top, left bottom,
-                                     from(hsl(213, 87%, 67%)),
-                                     to(hsl(213, 66%, 57%)));
-  -webkit-border-top-left-radius: 4px;
-  -webkit-border-top-right-radius: 4px;
-}
-
-.edit-bar > * {
-  display: block;
-  position: relative;
-}
-
-.thumbnail-container:hover .edit-bar {
-  -webkit-animation: 'edit-bar-enter' 2.5s;
-  opacity: 1;
-  pointer-events: inherit;
-}
-
-.edit-bar > .spacer {
-  -webkit-box-flex: 1;
-}
-
-.edit-bar > .pin,
-.edit-bar > .remove {
-  width: 16px;
-  height: 16px;
-  cursor: pointer;
-  background-image: no-repeat 50% 50%;
-}
-
-.edit-bar > .pin {
-  background-image: url(chrome://theme/newtab_pin_off);
-}
-
-.edit-bar > .pin:hover {
-  background-image: url(chrome://theme/newtab_pin_off_h);
-}
-
-.edit-bar > .pin:active {
-  background-image: url(chrome://theme/newtab_pin_off_p);
-}
-
-.pinned .edit-bar > .pin {
-  background-image: url(chrome://theme/newtab_pin_on);
-}
-
-.pinned .edit-bar > .pin:hover {
-  background-image: url(chrome://theme/newtab_pin_on_h);
-}
-
-.pinned .edit-bar > .pin:active {
-  background-image: url(chrome://theme/newtab_pin_on_p);
-}
-
-.edit-bar > .remove {
-  background-image: url(chrome://theme/newtab_close);
-}
-
-.edit-bar > .remove:hover {
-  background-image: url(chrome://theme/newtab_close_h);
-}
-
-.edit-bar > .remove:active {
-  background-image: url(chrome://theme/newtab_close_p);
-}
-
-:link,
-:visited,
-.link,
-.thumbnail-container a {
-  cursor: pointer;
-  text-decoration: underline;
-  color: hsl(213, 90%, 24%);
-}
-
-.thumbnail-container .title,
-.small .thumbnail-container .title {
-  line-height: 16px;
-  height: 16px;
-  margin: 0;
-  margin-top: 4px;
-  font-size: 100%;
-  font-weight:normal;
-  padding: 0 3px;
-  opacity: 1;
-  -webkit-transition: opacity .5s;
-  color: black;
-}
-
-.thumbnail-container .title div {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-
-  background: no-repeat 0 50%;
-  -webkit-background-size: 16px;
-  padding-left: 20px; /* we cannot use padding start here because even if we set
-                         the direction we always want the icon on the same side
-                      */
-  padding-right: 0;
-}
-
-html[dir=rtl] .thumbnail-container .title div {
-  background-position-x: 100%;
-  padding-left: 0;
-  padding-right: 20px;
-  text-align: right;
-}
-
-.thumbnail {
-  border: 3px solid hsla(213, 63%, 93%, 1);
-  padding: 1px;
-  -webkit-border-radius: 5px;
-  display: block;
-  -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0);
-  -webkit-transition: width .5s, height .5s, border-color .5s,
-      -webkit-border-radius .5s, -webkit-box-shadow .5s;
-}
-
-.edit-mode-border {
-  -webkit-border-radius: 4px;
-  background-color: hsla(213, 54%, 95%, 0);
-}
-
-.thumbnail-container:hover .thumbnail {
-  -webkit-animation: 'thumbnail-enter' 2.5s;
-  border-color: hsla(213, 66%, 57%, 1);
-  -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, 0);
-  -webkit-border-top-left-radius: 0;
-  -webkit-border-top-right-radius: 0;
-
-  background-image: -webkit-gradient(linear, left top, left bottom,
-    from(hsla(0, 0%, 0%, 0)),
-    color-stop(0.85, hsla(0, 0%, 47%, 0)),
-    to(hsla(0, 0%, 47%, 0.2))
-    );
-}
-
-.thumbnail-container:hover .edit-mode-border {
-  -webkit-animation: 'edit-mode-border-enter' 2.5s;
-  background-color: hsla(213, 66%, 57%, 1);
-  -webkit-box-shadow: 0px 2px 2px hsla(0, 0%, 0%, .5);
-}
-
-.dragging {
-  -webkit-transition: none;
-}
-
-.dragging .title {
-  opacity: 0;
-}
-
-.list .dragging .title {
-  opacity: 1;
-}
-
-.hide {
-  opacity: 0 !important;
-  visibility: hidden !important;
-}
-
-@-webkit-keyframes 'fade-in' {
-  0% {
-    opacity: 0;
-  }
-
-  100% {
-    opacity: 1;
-  }
-}
-
-.fade-in {
-  -webkit-animation: 'fade-in' 2.5s;
-}
-
-/* Notification */
-
-#notification {
-  position: relative;
-  background-color: hsl(52, 100%, 80%);
-  -webkit-border-radius: 4px;
-  padding: 8px 16px;
-  white-space: nowrap;
-  display: table;
-  margin: 10px auto;
-  font-weight: bold;
-  opacity: 0;
-  visibility: hidden;
-  -webkit-transition: opacity 1s;
-  z-index: 1;
-}
-
-#notification > * {
-  display: table-cell;
-  max-width: 500px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.small #notification > * {
-  max-width: 300px;
-}
-
-#notification:hover,
-#notification.show {
-  opacity: 1;
-  visibility: inherit;
-}
-
-#notification .link {
-  -webkit-margin-start: 20px;
-}
-
-/* List mode */
-
-.list .thumbnail,
-.list .edit-bar {
-  display: none;
-}
-
-.list .title,
-.small .list .title {
-  width: auto;
-}
-
-.list .thumbnail-container {
-  -webkit-box-sizing: border-box;
-}
-
-.list .title,
-.small .list .title {
-  font-size: 140%;
-  line-height: 40px;
-  height: 40px;
-  color: hsl(213, 27%, 68%);
-  text-decoration: underline;
-}
-
-.list .title div {
-  color: rgb(6, 45, 117);
-}
-
-.section {
-  background: white;
-  -webkit-border-radius: 4px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  border: 1px solid hsl(213, 65%, 92%);
-  padding-bottom: 5px;
-  overflow: hidden;
-  min-height: 198px; /* height of 6 items plus the header */
-  vertical-align: top;
-  margin: 0;
-}
-
-.section > h2 {
-  background-image: -webkit-gradient(linear, left top, left bottom,
-      from(hsl(213, 87%, 67%)),
-      to(hsl(213, 66%, 57%)));
-  -webkit-border-top-left-radius: 2px;
-  -webkit-border-top-right-radius: 2px;
-  padding: 4px 8px;
-  color: white;
-  font-size: 100%;
-  margin: 0px;
-}
-
-.item {
-  background: no-repeat 0% 50%;
-  padding: 2px;
-  padding-left: 18px;
-  -webkit-background-size: 16px;
-  background-color: hsla(213, 63%, 93%, 0);
-  display: block;
-  line-height: 20px;
-  -webkit-box-sizing: border-box;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  text-decoration: none;
-  font-size: 100%;
-}
-
-html[dir='rtl'] .item {
-  background-position-x: 100%;
-  padding-right: 18px;
-  padding-left: 2px;
-  text-align: right;
-}
-
-.window {
-  position: relative;
-  overflow: visible; /* We use visible so that the menu can be a child and shown
-                        on :hover. To get this to work we have to set visibility
-                        to visible which unfortunately breaks the ellipsis for t
-                        he window items */
-  background-image: url(chrome://theme/newtab_closed_window);
-}
-
-.window-menu {
-  position: absolute;
-  display: none;
-  border: 1px solid #999;
-  -webkit-box-shadow: 5px 5px 10px hsla(0, 0%, 0%, .3);
-  background-color: white;
-  width: 157px;
-  left: 0;
-  white-space: nowrap;
-  opacity: .9;
-  z-index: 1;
-  pointer-events: none;
-  padding: 1px;
-}
-
-.hbox {
-  display: -webkit-box;
-  -webkit-box-orient: horizontal;
-}
-
-#recent-tabs,
-#downloads {
-  -webkit-box-flex: 1;
-  width: 50%;
-}
-
-.section h3 {
-  padding: 8px 5px;
-  padding-bottom: 0;
-  font-size: 80%;
-  font-weight: normal;
-  margin: 0;
-  -webkit-margin-start: 2px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.item-container {
-  margin: 0 5px;
-  text-decoration: underline;
-  color: hsl(213, 27%, 68%);
-}
-
-.item.nav:after {
-  content: '\00bb'; /* raque gets flipped automatically in rtl */
-  font-size: 120%;
-  -webkit-padding-start: 2px;
-}
-
-#recent-activities {
-  -webkit-transition: width .5s, opacity .5s;
-}
-
-.section {
-  -webkit-box-flex: 1;
-  width: 50%;
-  display: inline-block;
-}
-
-#view-toolbar {
-  -webkit-user-select: none;
-  text-align: right;
-  position: relative;
-  top: 35px;
-}
-
-html[dir='rtl'] #view-toolbar {
-  text-align: left;
-}
-
-#view-toolbar input {
-  -webkit-appearance: none;
-  background-color: transparent;
-  width: 19px;
-  height: 17px;
-  margin: 0;
-  border: 0;
-  padding: 0;
-  vertical-align: top;
-  -webkit-margin-start: 5px;
-}
-
-#lower-sections {
-  position: relative;
-  overflow: hidden;
-  -webkit-transition: height .5s, width .5s, opacity .5s;
-  white-space: nowrap;
-}
-
-#lower-sections .section {
-  -webkit-transition: width .5s, opacity .5s, left .5s;
-  -webkit-box-sizing: border-box;
-}
-
-#lower-sections .spacer {
-  width: 20px;
-  -webkit-transition: width .5s;
-  display: inline-block;
-}
-
-.loading * {
-  -webkit-transition: none;
-}
-
-#thumb-checkbox {
-  background-image: url(chrome://theme/newtab_thumb_off);
-}
-
-#thumb-checkbox:hover {
-  background-image: url(chrome://theme/newtab_thumb_off_h);
-}
-
-#thumb-checkbox:active {
-  background-image: url(chrome://theme/newtab_thumb_off_p);
-}
-
-#thumb-checkbox:checked {
-  background-image: url(chrome://theme/newtab_thumb_on);
-}
-
-#thumb-checkbox:checked:hover {
-  background-image: url(chrome://theme/newtab_thumb_on_h);
-}
-
-#thumb-checkbox:checked:active {
-  background-image: url(chrome://theme/newtab_thumb_on_p);
-}
-
-#list-checkbox {
-  background-image: url(chrome://theme/newtab_list_off);
-}
-
-#list-checkbox:hover {
-  background-image: url(chrome://theme/newtab_list_off_h);
-}
-
-#list-checkbox:active {
-  background-image: url(chrome://theme/newtab_list_off_p);
-}
-
-#list-checkbox:checked {
-  background-image: url(chrome://theme/newtab_list_on);
-}
-
-#list-checkbox:checked:hover {
-  background-image: url(chrome://theme/newtab_list_on_h);
-}
-
-#list-checkbox:checked:active {
-  background-image: url(chrome://theme/newtab_list_on_p);
-}
-
-#option-button {
-  background-image: url(chrome://theme/newtab_option);
-}
-
-#option-button:hover {
-  background-image: url(chrome://theme/newtab_option_h);
-}
-
-#option-button:active {
-  background-image: url(chrome://theme/newtab_option_p);
-}
-
-#option-menu {
-  -webkit-user-select: none;
-  position: absolute;
-  right: 0;
-  left: auto;
-  top: 53px; /* Position this below the option button. The option button
-                is positioned 35px from the top and has a height of 17px. We add
-                one to get some spacing there as well: 35 + 17 + 1 = 53 */
-  cursor: default;
-  pointer-events: all;
-  min-width: 175px;
-}
-
-html[dir='rtl'] #option-menu {
-  right: auto;
-  left: 0;
-}
-
-#option-menu > div {
-  padding: 3px 8px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-#option-menu > [selected] {
-  background-color: hsla(213, 66%, 57%, 1);
-  color: white;
-}