diff --git a/src/browser/app/profile/zen-browser.js b/src/browser/app/profile/zen-browser.js index 69a9b1bf9..619a41ad1 100644 --- a/src/browser/app/profile/zen-browser.js +++ b/src/browser/app/profile/zen-browser.js @@ -104,6 +104,7 @@ pref('zen.welcomeScreen.seen', false); pref('zen.tabs.vertical', true); pref('zen.theme.accent-color', "#aac7ff"); pref('zen.theme.panel-separation', 7); +pref('zen.theme.toolbar-themed', true); // From: https://github.com/yokoffing/Betterfox diff --git a/src/browser/base/content/browser-xhtml.patch b/src/browser/base/content/browser-xhtml.patch index ee4f7129b..b05b0b117 100644 --- a/src/browser/base/content/browser-xhtml.patch +++ b/src/browser/base/content/browser-xhtml.patch @@ -1,18 +1,14 @@ diff --git a/browser/base/content/browser.xhtml b/browser/base/content/browser.xhtml -index 1dcdd02cd1bfe24c9f32304511f3dd675fc9265c..739b42cc6c832ccfe270a50d7d46fe2842a38f45 100644 +index 1dcdd02cd1bfe24c9f32304511f3dd675fc9265c..753d0b60e0877507b531a415461fa8a9c843dcbd 100644 --- a/browser/base/content/browser.xhtml +++ b/browser/base/content/browser.xhtml -@@ -165,9 +165,17 @@ +@@ -165,9 +165,13 @@ -#include navigator-toolbox.inc.xhtml - -#include browser-box.inc.xhtml -+ -+#include titlebar-items.inc.xhtml -+ -+ + + #include navigator-toolbox.inc.xhtml + diff --git a/src/browser/base/content/navigator-toolbox-inc-xhtml.patch b/src/browser/base/content/navigator-toolbox-inc-xhtml.patch index 1ca48ff31..91a5df546 100644 --- a/src/browser/base/content/navigator-toolbox-inc-xhtml.patch +++ b/src/browser/base/content/navigator-toolbox-inc-xhtml.patch @@ -1,5 +1,5 @@ diff --git a/browser/base/content/navigator-toolbox.inc.xhtml b/browser/base/content/navigator-toolbox.inc.xhtml -index fc19910726f2925505f6e71add034c82af36b63e..046f6fc8084403096be2730f7f892d9ea70d7de2 100644 +index fc19910726f2925505f6e71add034c82af36b63e..df0c170ae44c0d51e2c60777c8f845c6b58a2a26 100644 --- a/browser/base/content/navigator-toolbox.inc.xhtml +++ b/browser/base/content/navigator-toolbox.inc.xhtml @@ -50,21 +50,24 @@ @@ -39,7 +39,17 @@ index fc19910726f2925505f6e71add034c82af36b63e..046f6fc8084403096be2730f7f892d9e -@@ -576,7 +582,6 @@ +@@ -505,6 +511,9 @@ + consumeanchor="PanelUI-button" + data-l10n-id="appmenu-menu-button-closed2"/> + ++ ++#include titlebar-items.inc.xhtml ++ + + + diff --git a/src/browser/base/content/zenThemeModifier.js b/src/browser/base/content/zenThemeModifier.js index b2fc000bc..51374a3f7 100644 --- a/src/browser/base/content/zenThemeModifier.js +++ b/src/browser/base/content/zenThemeModifier.js @@ -86,6 +86,10 @@ }, _changeSidebarLocation(value) { + const kInlineIndicatorElements = [ + "nav-bar", + "tabbrowser-tabbox" + ] const sidebar = document.getElementById("sidebar-box"); const toolbox = document.getElementById("navigator-toolbox"); const wrapper = document.getElementById("zen-tabbox-wrapper"); @@ -96,16 +100,29 @@ appWrapepr.setAttribute("hidden", "true"); sidebar.setAttribute("inlinedwithtoolbox", "true"); toolbox.setAttribute("inlinedwithsidebar", "true"); + for (let id of kInlineIndicatorElements) { + const elem = document.getElementById(id); + if (elem) { + elem.setAttribute("inlinedwithsidebar", "true"); + } + } } else { appWrapepr.appendChild(toolbox); appWrapepr.appendChild(sidebar); appWrapepr.removeAttribute("hidden"); sidebar.removeAttribute("inlinedwithtoolbox"); toolbox.removeAttribute("inlinedwithsidebar"); + for (let id of kInlineIndicatorElements) { + const elem = document.getElementById(id); + if (elem) { + elem.removeAttribute("inlinedwithsidebar"); + } + } } }, _zenInitBrowserLayout() { + if (!this._inMainBrowserWindow) return; const kNavbarItems = [ "nav-bar", "PersonalToolbar", diff --git a/src/browser/components/preferences/main-inc-xhtml.patch b/src/browser/components/preferences/main-inc-xhtml.patch deleted file mode 100644 index ddfbdec42..000000000 --- a/src/browser/components/preferences/main-inc-xhtml.patch +++ /dev/null @@ -1,20 +0,0 @@ -diff --git a/browser/components/preferences/main.inc.xhtml b/browser/components/preferences/main.inc.xhtml -index aaacdb6d977a69ca62d59bd861b26948980c400d..b014cfaf5b8f31bc5a37135c92dbf213b08eeba0 100644 ---- a/browser/components/preferences/main.inc.xhtml -+++ b/browser/components/preferences/main.inc.xhtml -@@ -155,6 +155,7 @@ - - - -+#if 0 - -+#endif - - - - diff --git a/src/browser/locales/en-US/browser/preferences/zen-preferences.ftl b/src/browser/locales/en-US/browser/preferences/zen-preferences.ftl index dcbdac2fc..02d513e96 100644 --- a/src/browser/locales/en-US/browser/preferences/zen-preferences.ftl +++ b/src/browser/locales/en-US/browser/preferences/zen-preferences.ftl @@ -6,3 +6,5 @@ category-zen-looks = zen-look-and-feel-colors-header = Pick a theme colour zen-look-and-feel-colors-description = Make { -brand-short-name } look and feel the way you like +zen-look-and-feel-themed-toolbar = + .label = Make the toolbar themed with the accent color \ No newline at end of file diff --git a/src/browser/themes/shared/zen-browser-shared.css b/src/browser/themes/shared/zen-browser-shared.css index b74135602..309196e78 100644 --- a/src/browser/themes/shared/zen-browser-shared.css +++ b/src/browser/themes/shared/zen-browser-shared.css @@ -24,6 +24,12 @@ --input-border-color: var(--zen-input-border-color) !important; } +@media not (-moz-bool-pref: "zen.theme.toolbar-themed") { + :root { + --toolbar-bgcolor: light-dark(white, rgb(66, 65, 77)) !important; + } +} + #PersonalToolbar:not([collapsed="true"]) { /*border-top: 1px solid light-dark(#ddd, #4a4a4a);*/ padding: 5px 0; @@ -351,16 +357,6 @@ toolbarbutton#scrollbutton-up { } } -/* Title bar */ - -#zen-titlebar-items-container { - width: 100%; - display: flex; - align-items: center; - justify-content: end; - -moz-window-dragging: drag; -} - .footer-button { padding: var(--zen-button-padding) !important; border-radius: var(--zen-button-border-radius) !important; @@ -402,3 +398,29 @@ panelmultiview { flex-direction: column; align-items: center; } + +/** No space in panels overrides */ + +#tabbrowser-tabbox[inlinedwithsidebar="true"] { + background: var(--toolbar-bgcolor); +} + +#tabbrowser-tabbox[inlinedwithsidebar="true"] #tabbrowser-tabpanels { + --zen-browser-border-radius: 10px; + margin: 0 10px 10px 0; + border-radius: var(--zen-browser-border-radius); + border: 1px solid light-dark(#ddd, #4a4a4a); +} + +#tabbrowser-tabbox[inlinedwithsidebar="true"] #tabbrowser-tabpanels .browserStack > browser { + border-radius: var(--zen-browser-border-radius); +} + +#nav-bar[inlinedwithsidebar="true"] { + padding-top: 5px; + padding-bottom: 5px; +} + +#nav-bar[inlinedwithsidebar="true"] #urlbar[breakout]:not([breakout-extend="true"]) { + top: unset; +} diff --git a/src/browser/themes/shared/zen-sidebar.css b/src/browser/themes/shared/zen-sidebar.css index 3faf18216..60230bc3d 100644 --- a/src/browser/themes/shared/zen-sidebar.css +++ b/src/browser/themes/shared/zen-sidebar.css @@ -10,10 +10,10 @@ overflow: hidden; transition: .2s; margin-left: 0 !important; + border: var(--zen-appcontent-border); } #sidebar-box:not([positionend="true"]) { - border-left-width: 0px !important; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; margin-right: 0 !important; @@ -29,7 +29,6 @@ border-bottom-right-radius: 0 !important; margin-right: 0 !important; box-shadow: none !important; - border-right: 1px solid light-dark(#ddd, #4a4a4a) !important; } #sidebar-splitter { diff --git a/src/toolkit/content/zen-xul.css b/src/toolkit/content/zen-xul.css index e056423c8..282902fdc 100644 --- a/src/toolkit/content/zen-xul.css +++ b/src/toolkit/content/zen-xul.css @@ -4,8 +4,9 @@ :root { --zen-main-browser-background: var(--zen-colors-secondary); --zen-appcontent-separator-from-window-single: 7px; - --zen-appcontent-separator-from-window: 0 var(--zen-appcontent-separator-from-window-single) var(--zen-appcontent-separator-from-window-single); + --zen-appcontent-separator-from-window: var(--zen-appcontent-separator-from-window-single); --zen-appcontent-border-radius: var(--zen-panel-radius); + --zen-appcontent-border: 1px solid light-dark(#ddd, #4a4a4a); } toolbox#navigator-toolbox, @@ -29,7 +30,7 @@ html#main-window > body { :not([inDOMFullscreen="true"]) #appcontent, #sidebar-box, -#navigator-toolbox #TabsToolbar { +#navigator-toolbox:not([inlinedwithsidebar="true"]) #TabsToolbar { /** Sidebar is already hidden in full screen mode */ box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px; border: none; diff --git a/src/toolkit/themes/shared/global-shared-css.patch b/src/toolkit/themes/shared/global-shared-css.patch deleted file mode 100644 index efc63ebb3..000000000 --- a/src/toolkit/themes/shared/global-shared-css.patch +++ /dev/null @@ -1,13 +0,0 @@ -diff --git a/toolkit/themes/shared/global-shared.css b/toolkit/themes/shared/global-shared.css -index c478b2745e838a7fcb91da05ff9c5769065fd1c4..6977f16b1ff6f1f0fe9c1ad47d870d92f5857edd 100644 ---- a/toolkit/themes/shared/global-shared.css -+++ b/toolkit/themes/shared/global-shared.css -@@ -45,7 +45,7 @@ - - --toolbar-non-lwt-bgcolor: color-mix(in srgb, -moz-dialog 85%, white); - --toolbar-non-lwt-textcolor: -moz-dialogtext; -- --toolbar-bgcolor: var(--toolbar-non-lwt-bgcolor); -+ --toolbar-bgcolor: var(--zen-colors-tertiary); - --toolbar-color: var(--toolbar-non-lwt-textcolor); - - &:-moz-lwtheme {