1 files changed, 13 insertions, 58 deletions

diff --git a/chromium/chrome/browser/resources/local_ntp/most_visited_single.css b/chromium/chrome/browser/resources/local_ntp/most_visited_single.css
index 995e9a8b6b6..d1ed09f7a96 100644
--- a/chromium/chrome/browser/resources/local_ntp/most_visited_single.css
+++ b/chromium/chrome/browser/resources/local_ntp/most_visited_single.css
@@ -54,32 +54,11 @@ a:visited {
 
 #mv-tiles,
 .mv-tiles-old {
-  display: flex;
-  flex-wrap: wrap;
   font-size: 0;
-  justify-content: center;
-  /* 5 112px tiles per row. If you change this, also change the corresponding
-   * values in local_ntp.css. */
-  max-width: calc(var(--md-tile-size) * var(--md-max-tiles-row));
   opacity: 0;
-  position: static;
-  /* This align correctly for both LTR and RTL */
-  text-align: -webkit-auto;
-  user-select: none;
-}
-
-body.grid-layout #mv-tiles,
-body.grid-layout .mv-tiles-old {
-  display: block;
-  flex-wrap: unset;
-  justify-content: unset;
-  max-width: unset;
   position: relative;
-  text-align: unset;
-}
-
-html:not(.no-initial-fade) :-webkit-any(#mv-tiles, .mv-tiles-old) {
   transition: opacity 300ms;
+  user-select: none;
 }
 
 .mv-tiles-old {
@@ -104,11 +83,11 @@ html:not(.no-initial-fade) :-webkit-any(#mv-tiles, .mv-tiles-old) {
 
 /* Prevent transitions on the held tile in order for it to smoothly follow the
  * mouse. */
-.grid-reorder .grid-tile {
+.reorder .grid-tile {
   transition-duration: 0s;
 }
 
-.grid-reorder {
+.reorder {
   z-index: 10;  /* Ensure the held tile is visible. */
 }
 
@@ -127,46 +106,24 @@ html:not(.no-initial-fade) :-webkit-any(#mv-tiles, .mv-tiles-old) {
   width: var(--md-tile-size);
 }
 
-.reorder {
-  background-color: white;
-  border-radius: 4px;
-  box-shadow: 0 1px 3px 0 rgba(var(--GG800-rgb), .3),
-      0 4px 8px 3px rgba(var(--GG800-rgb), .15);
-  color: rgb(var(--GG800-rgb));
-  transition-duration: 200ms;
-}
-
-@media (prefers-color-scheme: dark) {
-  .reorder {
-    background-color: rgb(var(--dark-mode-bg-rgb));
-    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, .4),
-        0 4px 8px 3px rgba(0, 0, 0, .25);
-    color: rgb(var(--GG100-rgb));
-  }
-}
-
-.reorder .md-tile-inner {
-  z-index: unset;
-}
-
 .md-empty-tile {
   display: none;
 }
 
 body:not(.reordering) .md-tile:hover,
-.grid-reorder .md-tile {
+.reorder .md-tile {
   background-color: rgba(var(--GG900-rgb), .06);
 }
 
 @media (prefers-color-scheme: dark) {
   body:not(.reordering) .md-tile:hover,
-  .grid-reorder .md-tile {
+  .reorder .md-tile {
     background-color: rgba(255, 255, 255, .1);
   }
 }
 
 body.dark-theme:not(.reordering) .md-tile:hover,
-body.dark-theme .grid-reorder .md-tile {
+body.dark-theme .reorder .md-tile {
   background-color: rgba(255, 255, 255, .1);
 }
 
@@ -257,7 +214,7 @@ body.mac-chromeos .md-title {
 }
 
 /* Apply when a custom background is set. */
-body.custom-background .md-tile:not(.reorder) .md-title {
+body.custom-background .md-title {
   filter: drop-shadow(0 0 6px rgba(0, 0, 0, .35));
 }
 
@@ -266,12 +223,9 @@ body.use-title-container .md-title {
   background-color: white;
   /* Necessary for a "pill" shape. Using 50% creates an oval. */
   border-radius: 500px;
-  padding: 0 8px;
-}
-
-body.use-title-container .md-tile:not(.reorder) {
   color: rgb(var(--GG800-rgb));
   filter: unset;
+  padding: 0 8px;
 }
 
 .md-menu {
@@ -300,9 +254,10 @@ body:not(.reordering) .md-menu:focus:not(.mouse-navigation) {
 /* We use ::after without content to provide the masked X element. */
 .md-menu::after {
   --mask-width: calc(var(--md-menu-size) - 2);
+  /* TODO(crbug.com/1012065): Use SVG for the "X" icon. */
   -webkit-mask-image: -webkit-image-set(
-      url(chrome-search://local-ntp/images/close_3_mask.png) 1x,
-      url(chrome-search://local-ntp/images/close_3_mask.png@2x) 2x);
+      url(chrome-search://most-visited/dont_show.png) 1x,
+      url(chrome-search://most-visited/dont_show_2x.png) 2x);
   -webkit-mask-repeat: no-repeat;
   -webkit-mask-size: var(--mask-width);
   background-color: rgb(var(--GG600-rgb));
@@ -345,13 +300,13 @@ body:not(.reordering) .md-menu:focus::after {
   }
 }
 
-body.dark-theme .md-tile:not(.reorder) .md-menu::after,
+body.dark-theme .md-tile .md-menu::after,
 body.dark-theme:not(.reordering) .md-menu:focus:not(.mouse-navigation)::after {
   background-color: white;
 }
 
 @media (prefers-color-scheme: dark) {
-  body.dark-theme .md-tile:not(.reorder) .md-menu::after,
+  body.dark-theme .md-tile .md-menu::after,
   body.dark-theme:not(.reordering)
       .md-menu:focus:not(.mouse-navigation)::after {
     background-color: rgb(var(--GG200-rgb));