From 8171483a8e12734695463a7b5209b3d659441d01 Mon Sep 17 00:00:00 2001
From: Ben Evans <ben.evans@csiro.au>
Date: Sat, 1 Sep 2018 01:44:41 +1000
Subject: [PATCH] Update layout to match latest Chrome UI

---
 chrome/_browser.css | 77 +++++++++++++++++++++++++++++++++++----------
 chrome/_vars.css    |  2 +-
 2 files changed, 61 insertions(+), 18 deletions(-)

diff --git a/chrome/_browser.css b/chrome/_browser.css
index 89cbb6bb..dd5f016d 100755
--- a/chrome/_browser.css
+++ b/chrome/_browser.css
@@ -18,6 +18,8 @@
 
 #navigator-toolbox :-moz-any(.toolbarbutton-1, .bookmark-item)
 {
+  max-height: 32px !important;
+  
   font-size: 12px !important;
   padding: 0 !important;
   margin: 0 !important;
@@ -145,27 +147,52 @@
   margin: 1px !important;
   padding: 2px !important;
   background-clip: padding-box !important;
+  min-height: 24px !important;
+  position: relative !important;
+  overflow: visible !important;
 }
 
 #urlbar[focused]
 {
-  box-shadow:
-    0 0 0 2px var(--textbox-outer-color-focused),
-    0 0 0 2px var(--textbox-inner-color-focused) inset !important;
   background-color: var(--textbox-background-color-focused) !important;
 }
 
+#urlbar[focused]::after
+{
+  display: -moz-box !important;
+  content: "";
+  position: absolute !important;
+  left: -1px;
+  right: -1px;
+  top: -1px;
+  bottom: -1px;
+  border-radius: 99px;
+  border: 2px solid var(--textbox-outer-color-focused);
+}
+
 #page-action-buttons
 {
   color: var(--toolbar-color) !important;
 }
 
-#page-action-buttons > :-moz-any(#pocket-button-box, #pageActionButton),
+#page-action-buttons > :-moz-any(#pageActionSeparator, #pocket-button-box, #pageActionButton),
 .urlbar-history-dropmarker
 {
   display: none !important;
 }
 
+#pageActionSeparator
+{
+  height: 24px !important;
+}
+
+.urlbar-icon
+{
+  min-width: 32px !important;
+  height: 24px !important;
+  padding: 4px !important;
+}
+
 #star-button
 {
   list-style-image: url(star.svg) !important;
@@ -225,6 +252,8 @@
 
 .tabbrowser-tab
 {
+  min-height: var(--tab-min-height) !important;
+  
   overflow: visible !important;
   font-size: 12px !important;
   
@@ -234,6 +263,8 @@
 
 .scrollbutton-down,
 .scrollbutton-up,
+.arrowscrollbox-overflow-start-indicator,
+.arrowscrollbox-overflow-end-indicator,
 #alltabs-button
 {
   display: none !important;
@@ -299,10 +330,12 @@
   transition: fill .3s var(--ease-basic) !important;
 }
 
-.tabbrowser-tab::before
+.tabbrowser-tab::before,
+.tabbrowser-tab:last-of-type::after
 {
-  content: "";
-  display: -moz-box;
+  content: "" !important;
+  display: -moz-box !important;
+  width: 1px !important;
   padding: 0 !important;
   margin-top: 8px !important;
   margin-bottom: 8px !important;
@@ -311,7 +344,8 @@
   opacity: 1 !important;
 }
 
-.tabbrowser-tab:-moz-any(:hover, [visuallyselected])::before,
+.tabbrowser-tab:-moz-any(:hover, [visuallyselected], :first-of-type)::before,
+.tabbrowser-tab:-moz-any(:hover, [visuallyselected], :first-of-type)::after,
 .tabbrowser-tab:hover + .tabbrowser-tab::before
 {
   opacity: 0 !important;
@@ -374,9 +408,13 @@
   display: none !important;
 }
 
+#tabbrowser-tabs[overflow] .tabbrowser-tab:not([visuallyselected]) .tab-close-button
+{
+  display: none !important;
+}
+
 .titlebar-placeholder[type=post-tabs],
-.closing-tabs-spacer,
-.arrowscrollbox-overflow-end-indicator
+.closing-tabs-spacer
 {
   display: none !important;
 }
@@ -386,6 +424,17 @@
   width: 13px !important;
 }
 
+#tabbrowser-tabs .tabs-newtab-button
+{
+  margin-left: 6px !important;
+}
+
+/* Simple New Tab Button */
+#_42b6f73f-e197-466e-9059-bd40982e88ce_-browser-action
+{
+  list-style-image: url(new-tab.svg) !important;
+}
+
 /* macOS */
 @media (-moz-mac-yosemite-theme)
 {
@@ -397,17 +446,11 @@
   }
 }
 
-#_42b6f73f-e197-466e-9059-bd40982e88ce_-browser-action
-{
-  list-style-image: url(new-tab.svg) !important;
-}
-
-
 @media (min--moz-device-pixel-ratio: 2)
 {
   #navigator-toolbox::after
   {
-    border-top: .5px solid var(--chrome-secondary-bckground-color) !important;
+    border-top: .5px solid var(--chrome-secondary-background-color) !important;
 		border-bottom-width: .5px !important;
   }
   
diff --git a/chrome/_vars.css b/chrome/_vars.css
index 92c0d8b7..4022da52 100755
--- a/chrome/_vars.css
+++ b/chrome/_vars.css
@@ -35,7 +35,7 @@
 #titlebar,
 #tabbrowser-tabs
 {
-  --tab-min-height: 36px !important;
+  --tab-min-height: 34px !important;
 }
 
 #main-window[privatebrowsingmode],