diff --git a/package.json b/package.json index fcc0defec..5cf332487 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,7 @@ "start": "cd engine && ./mach run --noprofile", "import": "surfer import", "export": "surfer export", - "init": "npm run bootstrap && npm run import", + "init": "npm run download && npm run bootstrap && npm run import", "download": "surfer download", "bootstrap": "surfer bootstrap && surfer bootstrap", "package": "surfer package", diff --git a/src/browser/app/profile/zen-browser.js b/src/browser/app/profile/zen-browser.js index b6d044329..7a966d25d 100644 --- a/src/browser/app/profile/zen-browser.js +++ b/src/browser/app/profile/zen-browser.js @@ -102,14 +102,10 @@ pref('zen.injections.match-urls', 'http://localhost/*', locked); pref('zen.rice.share.notice.accepted', false); #ifdef XP_MACOSX -pref('zen.theme.border-radius', 10); // In pixels -#else -#ifdef XP_WIN -pref('zen.theme.border-radius', 6); // In pixels +pref('zen.theme.border-radius', 11); // In pixels #else pref('zen.theme.border-radius', 8); // In pixels #endif -#endif pref('zen.theme.color-prefs.use-workspace-colors', true); pref('zen.theme.color-prefs.amoled', false); diff --git a/src/browser/base/content/ZenUIManager.mjs b/src/browser/base/content/ZenUIManager.mjs index 5f6cfe67e..11a4c6d7b 100644 --- a/src/browser/base/content/ZenUIManager.mjs +++ b/src/browser/base/content/ZenUIManager.mjs @@ -211,6 +211,7 @@ var gZenVerticalTabsManager = { this.__actualWindowButtons = !this.isWindowsStyledButtons ? document.querySelector('.titlebar-buttonbox-container') // TODO: test if it works 100% of the time : document.querySelector('#nav-bar .titlebar-buttonbox-container'); + this.__actualWindowButtons.setAttribute('overflows', 'false'); } return this.__actualWindowButtons; }, diff --git a/src/browser/base/content/zen-styles/zen-browser-container.css b/src/browser/base/content/zen-styles/zen-browser-container.css index 38feb17ea..82a19cad7 100644 --- a/src/browser/base/content/zen-styles/zen-browser-container.css +++ b/src/browser/base/content/zen-styles/zen-browser-container.css @@ -7,14 +7,7 @@ & #tabbrowser-tabbox #tabbrowser-tabpanels .browserSidebarContainer { width: -moz-available; --zen-native-content-radius: env(-moz-gtk-csd-titlebar-radius, var(--zen-border-radius)); - border-radius: var( - --zen-webview-border-radius, - /* Inner radius calculation: - * 1. If the native radius - the separation is less than 4px, use 4px. - * 2. Otherwise, use the the calculated value (inner radius = outer radius - separation). - */ - max(4px, calc(var(--zen-native-content-radius) - var(--zen-element-separation))) - ); + border-radius: var(--zen-native-inner-radius); position: relative; /* For glance */ @@ -29,7 +22,7 @@ } :root:not([zen-no-padding='true']) & { - box-shadow: 0 0 9.73px 0px light-dark(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.25)); + box-shadow: var(--zen-big-shadow); } } diff --git a/src/browser/base/content/zen-styles/zen-browser-ui.css b/src/browser/base/content/zen-styles/zen-browser-ui.css index e03c5d954..90606c635 100644 --- a/src/browser/base/content/zen-styles/zen-browser-ui.css +++ b/src/browser/base/content/zen-styles/zen-browser-ui.css @@ -149,6 +149,7 @@ display: flex; flex-direction: row; position: relative; + gap: var(--zen-element-separation); } .titlebar-buttonbox-container { diff --git a/src/browser/base/content/zen-styles/zen-popup.css b/src/browser/base/content/zen-styles/zen-popup.css index e0b591dd4..ae479e6d4 100644 --- a/src/browser/base/content/zen-styles/zen-popup.css +++ b/src/browser/base/content/zen-styles/zen-popup.css @@ -53,7 +53,7 @@ menupopup, panel { --panel-background: var(--arrowpanel-background); - --panel-border-radius: var(--zen-panel-radius); + --panel-border-radius: var(--zen-native-inner-radius); } /* app menu */ diff --git a/src/browser/base/content/zen-styles/zen-rices.css b/src/browser/base/content/zen-styles/zen-rices.css index 258f72d62..a9b89fa47 100644 --- a/src/browser/base/content/zen-styles/zen-rices.css +++ b/src/browser/base/content/zen-styles/zen-rices.css @@ -15,7 +15,7 @@ #zen-rice-share-dialog-notice { color: var(--panel-color); background: var(--arrowpanel-background); - border-radius: var(--zen-panel-radius); + border-radius: var(--zen-native-inner-radius); box-shadow: 0 0 1px 1px hsla(0, 0%, 0%, 0.2); border: var(--zen-appcontent-border); overflow: hidden; @@ -130,7 +130,7 @@ background: rgba(255, 0, 0, 0.1); padding: 5px; transition: opacity 0.3s ease; - border-radius: var(--zen-panel-radius); + border-radius: var(--zen-native-inner-radius); @starting-style { opacity: 0; diff --git a/src/browser/base/content/zen-styles/zen-sidebar-panels.css b/src/browser/base/content/zen-styles/zen-sidebar-panels.css index 2610133e4..a53824d56 100644 --- a/src/browser/base/content/zen-styles/zen-sidebar-panels.css +++ b/src/browser/base/content/zen-styles/zen-sidebar-panels.css @@ -63,6 +63,7 @@ max-width: 0; padding: 0; margin: 0; + display: none; } #zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel[pinned='true']) { @@ -79,9 +80,9 @@ } #zen-sidebar-web-panel { - border-radius: var(--zen-panel-radius); + border-radius: var(--zen-native-inner-radius); z-index: 2; - box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1); + box-shadow: var(--zen-big-shadow); border: 1px solid var(--zen-colors-border); background: var(--zen-colors-tertiary); opacity: 0; @@ -182,10 +183,6 @@ display: flex; } -#zen-sidebar-web-panel-wrapper { - margin: 0 calc(var(--zen-element-separation) / 2) 0 var(--zen-element-separation); -} - #zen-sidebar-web-panel[pinned='true'] { position: absolute; z-index: 1; @@ -289,19 +286,6 @@ animation: better-sidebar-pinned-hide 0.15s ease-in-out forwards !important; } -#zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel:not([hidden='true'])) { - :root:not([zen-right-side='true']) & { - margin-right: calc(var(--zen-element-separation) * 2 - 3px) !important; - } - - @media (-moz-bool-pref: 'zen.view.compact') and (-moz-bool-pref: 'zen.view.compact.hide-tabbar') { - :root[zen-right-side='true'] & { - margin-left: 0 !important; - margin-right: calc(var(--zen-element-separation) * 2 - 3px) !important; - } - } -} - /** UNPINNED **/ #zen-sidebar-web-panel { /* Sets perspective */ diff --git a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css index 54cdcfd87..5b1cab119 100644 --- a/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css +++ b/src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css @@ -383,15 +383,10 @@ padding-right: 0; :root[zen-single-toolbar='true'] & { - margin-left: var(--zen-toolbox-padding); & #urlbar:not([breakout-extend='true']) .urlbar-input-container { padding-left: 4px; padding-right: 4px; } - - :root[zen-right-side='true'] & { - margin-left: 0; - } } } @@ -445,9 +440,7 @@ &:not([zen-right-side='true']) { padding-right: 0; - & #titlebar { - padding-left: var(--zen-toolbox-padding); - } + padding-left: var(--zen-toolbox-padding); } & #TabsToolbar-customization-target { diff --git a/src/browser/base/content/zen-styles/zen-theme.css b/src/browser/base/content/zen-styles/zen-theme.css index d945ce362..701d11544 100644 --- a/src/browser/base/content/zen-styles/zen-theme.css +++ b/src/browser/base/content/zen-styles/zen-theme.css @@ -126,7 +126,6 @@ --browser-area-z-index-toolbox: 2 !important; --zen-appcontent-border: 1px solid var(--zen-colors-border); - --zen-panel-radius: var(--zen-border-radius); --toolbarbutton-border-radius: 6px; --urlbar-margin-inline: 1px !important; @@ -169,6 +168,18 @@ --arrowpanel-background: var(--zen-dialog-background) !important; --tab-selected-shadow: 0 0 1px 0px rgba(0, 0, 0, 0.1) !important; + --zen-big-shadow: 0 0 9.73px 0px light-dark(rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.25)); + + /* Nativity */ + --zen-native-content-radius: env(-moz-gtk-csd-titlebar-radius, var(--zen-border-radius)); + --zen-native-inner-radius: var( + --zen-webview-border-radius, + /* Inner radius calculation: + * 1. If the native radius - the separation is less than 4px, use 4px. + * 2. Otherwise, use the the calculated value (inner radius = outer radius - separation). + */ + max(4px, calc(var(--zen-native-content-radius) - var(--zen-element-separation))) + ); /** Other theme-related styles */ font-family: diff --git a/src/browser/base/content/zen-styles/zen-urlbar.css b/src/browser/base/content/zen-styles/zen-urlbar.css index a2b009039..3dc9eee02 100644 --- a/src/browser/base/content/zen-styles/zen-urlbar.css +++ b/src/browser/base/content/zen-styles/zen-urlbar.css @@ -35,7 +35,7 @@ border: none !important; margin: 1px; - box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.1) !important; + box-shadow: var(--zen-big-shadow) !important; :root[zen-single-toolbar='true'] & { box-shadow: none !important; }