From ce1e0562a8ecee30eb4ccd2b8dac97d858ab511c Mon Sep 17 00:00:00 2001 From: Cezar Augusto Date: Mon, 17 Feb 2020 16:01:06 -0300 Subject: [PATCH 1/2] NTP: Tweak spacing on topsites removal notification Close https://github.com/brave/brave-browser/issues/8282 --- .../components/default/notification/index.ts | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/components/brave_new_tab_ui/components/default/notification/index.ts b/components/brave_new_tab_ui/components/default/notification/index.ts index c3ee7cca8d77..30db595483fc 100644 --- a/components/brave_new_tab_ui/components/default/notification/index.ts +++ b/components/brave_new_tab_ui/components/default/notification/index.ts @@ -9,13 +9,12 @@ export const SiteRemovalNotification = styled<{}, 'header'>('header')` border-radius: 8px; box-shadow: 2px 2px 6px rgba(0,0,0,0.3); background-color: #fff; - width: 100%; - max-width: 500px; height: 100px; align-items: center; padding: 30px 60px; - display: flex; - justify-content: space-between; + display: grid; + grid-template-columns: auto auto auto auto; + grid-gap: 15px; ` export const SiteRemovalText = styled<{}, 'span'>('span')` From 7ca7e1312a00cbce99fc93c8ba50ca4729a50216 Mon Sep 17 00:00:00 2001 From: Brian Clifton Date: Sun, 1 Mar 2020 23:05:40 -0700 Subject: [PATCH 2/2] Update components/brave_new_tab_ui/components/default/notification/index.ts Accepting per review feedback Co-Authored-By: Pete Miller --- .../brave_new_tab_ui/components/default/notification/index.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/components/brave_new_tab_ui/components/default/notification/index.ts b/components/brave_new_tab_ui/components/default/notification/index.ts index 30db595483fc..54dd074c3b16 100644 --- a/components/brave_new_tab_ui/components/default/notification/index.ts +++ b/components/brave_new_tab_ui/components/default/notification/index.ts @@ -13,7 +13,8 @@ export const SiteRemovalNotification = styled<{}, 'header'>('header')` align-items: center; padding: 30px 60px; display: grid; - grid-template-columns: auto auto auto auto; + grid-auto-flow: column; + grid-auto-columns: auto; grid-gap: 15px; `