mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-10-05 17:36:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor l10n submodule commit reference

Browse Source
This commit is contained in:
mauro-balades
2024-09-10 20:44:01 +02:00
parent da36c5e375
commit 0e57c961c8
9 changed files with 192 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.github/workflows/windows-alpha-build.yml vendored
View File

@@ -212,6 +212,7 @@ jobs:
path: ./zen.win64-pgo-stage-1.zip
- name: Upload dist folder to github
if: ${{ !inputs.generate-gpo }}
run: |
set -x
git pull

2
l10n

Submodule l10n updated: 530f0c018c...0e976aef37

23
src/browser/base/content/zen-styles/zen-browser-ui.css
View File

@@ -37,26 +37,3 @@
display: flex;
flex-direction: row;
}
/* Notification Stack */
.notificationbox-stack {
&[notificationside="top"] {
position: absolute;
bottom: 0;
right: 0;
width: fit-content;
max-width: 30rem !important;
& notification-message {
background: var(--zen-colors-tertiary);
border-left: 1px solid var(--arrowpanel-border-color);
border-top-left-radius: var(--zen-border-radius);
&::before {
display: none;
}
}
}
}

30
src/browser/base/content/zen-styles/zen-theme.css
View File

@@ -132,6 +132,36 @@
}
}
@media (prefers-color-scheme: dark) {
@media (-moz-bool-pref: 'zen.theme.color-prefs.amoled') {
:root {
--zen-dark-color-mix-base: lch(2.467% 0 272 / 1);
--zen-urlbar-background: color-mix(in srgb, var(--zen-primary-color) 4%, rgb(0, 0, 0) 96%);
}
}
@media (-moz-bool-pref: 'zen.theme.color-prefs.colorful') {
:root {
--zen-in-content-dialog-background: rgb(28, 28, 32);
--zen-colors-primary: color-mix(in srgb, var(--zen-primary-color) 50%, black 50%);
--zen-colors-secondary: color-mix(in srgb, var(--zen-primary-color) 40%, black 60%);
--zen-colors-tertiary: color-mix(in srgb, var(--zen-primary-color) 15%, black 85%);
--zen-colors-hover-bg: color-mix(in srgb, var(--zen-primary-color) 90%, black 10%);
--zen-colors-primary-foreground: color-mix(in srgb, var(--zen-primary-color) 80%, white 20%);
--zen-colors-input-bg: color-mix(in srgb, var(--zen-primary-color) 10%, black 80%);
--zen-colors-border: color-mix(in srgb, var(--zen-colors-secondary) 80%, black 20%);
--zen-dialog-background: color-mix(in srgb, var(--zen-primary-color) 10%, black 90%);
--zen-urlbar-background: color-mix(in srgb, var(--zen-primary-color) 8%, rgb(15, 15, 15) 92%);
--zen-browser-gradient-base: color-mix(in srgb, var(--zen-primary-color) 30%, black 70%);
}
}
}
@media not (-moz-bool-pref: 'zen.theme.toolbar-themed') {
:root {
--toolbar-bgcolor: light-dark(white, #1b1b1b) !important;

41
src/browser/base/content/zen-styles/zen-urlbar.css
View File

@@ -1,12 +1,12 @@
/* URL and tool bars */
#urlbar {
--toolbarbutton-border-radius: 6px;
--toolbarbutton-border-radius: 10px;
--urlbarView-separator-color: var(--zen-colors-border);
--urlbarView-hover-background: var(--toolbarbutton-hover-background);
--urlbarView-highlight-background: var(--toolbarbutton-hover-background);
border: 1px solid var(--zen-colors-border);
border-radius: 999px;
border-radius: var(--toolbarbutton-border-radius);
overflow: hidden;
padding: 1px;
}
@@ -38,10 +38,13 @@
outline-color: none !important;
}
#urlbar .urlbar-page-action,
#urlbar #tracking-protection-icon-container,
#urlbar:not([breakout-extend='true']) #identity-box:is(:not(.chromeUI), [pageproxystate='invalid']) #identity-icon-box {
border-radius: 999px;
border-radius: var(--toolbarbutton-border-radius);
}
#urlbar .urlbar-page-action {
border-radius: calc(var(--toolbarbutton-border-radius) / 1.5);
}
#urlbar[breakout-extend='true'] .urlbar-page-action,
@@ -57,7 +60,7 @@
#identity-icon-box,
#identity-permission-box {
background: var(--zen-colors-secondary) !important;
background: color-mix(in srgb, var(--zen-colors-secondary) 40%, transparent 60%) !important;
margin: 0 8px 0 0 !important;
}
@@ -78,10 +81,6 @@
margin-right: 0 !important;
}
#urlbar:not([breakout-extend='true']) #identity-box.chromeUI:not([pageproxystate='invalid']) #identity-icon-box {
border-radius: 20px 10px 10px 20px !important;
}
#urlbar:not([extend='true']) #identity-box #identity-icon-box {
position: relative;
}
@@ -222,3 +221,27 @@ button.popup-notification-dropmarker {
}
}
}
/* Notification Stack */
.notificationbox-stack {
&[notificationside="top"] {
position: absolute;
bottom: 0;
right: 0;
width: fit-content;
max-width: 30rem !important;
& notification-message {
background: var(--zen-colors-tertiary);
border-left: 1px solid var(--arrowpanel-border-color);
border-top-left-radius: var(--zen-border-radius);
&::before {
display: none;
}
}
}
}

11
src/browser/components/preferences/main-inc-xhtml.patch
View File

@@ -1,7 +1,16 @@
diff --git a/browser/components/preferences/main.inc.xhtml b/browser/components/preferences/main.inc.xhtml
index 4c2637db10b7ad5d253d9588be3610c1ec5ad330..b8445b808cf9dcb54d380ae78172db4bf8250cd4 100644
index 4c2637db10b7ad5d253d9588be3610c1ec5ad330..b7861f7888b0d3f9abd5249f8356e6b9b5c3005f 100644
--- a/browser/components/preferences/main.inc.xhtml
+++ b/browser/components/preferences/main.inc.xhtml
@@ -163,7 +163,7 @@
</hbox>
<!-- Website appearance -->
-<groupbox id="webAppearanceGroup" data-category="paneGeneral" hidden="true">
+<groupbox id="webAppearanceGroup" data-category="paneZenLooks" hidden="true">
<html:h2 data-l10n-id="preferences-web-appearance-header"/>
<html:div id="webAppearanceSettings">
<description class="description-deemphasized" data-l10n-id="preferences-web-appearance-description"/>
@@ -369,6 +369,7 @@
languages-customize-add.label,
" />

57
src/browser/components/preferences/zen-settings.js
View File

@@ -216,6 +216,8 @@ var gZenMarketplaceManager = {
var gZenLooksAndFeel = {
init() {
if (this.__hasInitialized) return;
this.__hasInitialized = true;
this._initializeColorPicker(this._getInitialAccentColor());
window.zenPageAccentColorChanged = this._handleAccentColorChange.bind(this);
this._initializeTabbarExpandForm();
@@ -223,9 +225,64 @@ var gZenLooksAndFeel = {
gZenMarketplaceManager.init();
var onLegacyToolbarChange = this.onLegacyToolbarChange.bind(this);
Services.prefs.addObserver('zen.themes.tabs.legacy-location', onLegacyToolbarChange);
var onPreferColorSchemeChange = this.onPreferColorSchemeChange.bind(this);
window.matchMedia('(prefers-color-scheme: dark)').addListener(onPreferColorSchemeChange);
this.onPreferColorSchemeChange();
window.addEventListener('unload', () => {
Services.prefs.removeObserver('zen.themes.tabs.legacy-location', onLegacyToolbarChange);
window.matchMedia('(prefers-color-scheme: dark)').removeListener(onPreferColorSchemeChange);
});
setTimeout(() => {
const group = document.getElementById('zenLooksAndFeelGroup');
const webGroup = document.getElementById('webAppearanceGroup');
webGroup.style.display = 'none';
// Iterate reverse to prepend the elements in the correct order.
for (let child of [...webGroup.children].reverse()) {
group.prepend(child);
}
}, 500);
this.setDarkThemeListener();
},
onPreferColorSchemeChange(event) {
const darkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
let elem = document.getElementById("ZenDarkThemeStyles");
if (darkTheme) {
elem.removeAttribute('hidden');
} else {
elem.setAttribute('hidden', 'true');
}
},
setDarkThemeListener() {
this.chooser = document.getElementById("zen-dark-theme-styles-form");
this.radios = [...this.chooser.querySelectorAll("input")];
for (let radio of this.radios) {
if (radio.value === "amoled" && Services.prefs.getBoolPref("zen.theme.color-prefs.amoled")) {
radio.checked = true;
} else if (radio.value === "colorful" && Services.prefs.getBoolPref("zen.theme.color-prefs.colorful")) {
radio.checked = true;
} else if (radio.value === "default" && !Services.prefs.getBoolPref("zen.theme.color-prefs.amoled") && !Services.prefs.getBoolPref("zen.theme.color-prefs.colorful")) {
radio.checked = true;
}
radio.addEventListener("change", e => {
let value = e.target.value;
switch (value) {
case "amoled":
Services.prefs.setBoolPref("zen.theme.color-prefs.amoled", true);
Services.prefs.setBoolPref("zen.theme.color-prefs.colorful", false);
break;
case "colorful":
Services.prefs.setBoolPref("zen.theme.color-prefs.amoled", false);
Services.prefs.setBoolPref("zen.theme.color-prefs.colorful", true);
break;
default:
Services.prefs.setBoolPref("zen.theme.color-prefs.amoled", false);
Services.prefs.setBoolPref("zen.theme.color-prefs.colorful", false);
break;
}
});
}
},
async onLegacyToolbarChange(event) {

66
src/browser/components/preferences/zenLooksAndFeel.inc.xhtml
View File

@@ -17,27 +17,39 @@
<html:div id="zen-theme-builder-wrapper"></html:div>
<checkbox id="zenLooksAndFeelUseThemedToolbar"
<box class="indent">
<checkbox id="zenLooksAndFeelUseThemedToolbar"
data-l10n-id="zen-look-and-feel-themed-toolbar"
preference="zen.theme.toolbar-themed"/>
</box>
<label><html:h2 data-l10n-id="zen-look-and-feel-compact-view-header"/></label>
<description class="description-deemphasized" data-l10n-id="zen-look-and-feel-compact-view-description" />
<checkbox id="zenLooksAndFeelShowCompactView"
data-l10n-id="zen-look-and-feel-compact-view-enabled"
preference="zen.view.compact"/>
<vbox class="indent">
<checkbox id="zenLooksAndFeelShowCompactViewToolbar"
data-l10n-id="zen-look-and-feel-compact-view-top-toolbar"
preference="zen.view.compact.hide-toolbar"/>
<checkbox id="zenLooksAndFeelEnableToolbarFlashPopup"
data-l10n-id="zen-look-and-feel-compact-toolbar-flash-popup"
preference="zen.view.compact.toolbar-flash-popup"/>
</vbox>
<checkbox id="zenLooksAndFeelShowLegacyToolbar"
data-l10n-id="zen-look-and-feel-legacy-toolbar"
preference="zen.themes.tabs.legacy-location"/>
<html:div id="ZenDarkThemeStyles">
<html:h2 data-l10n-id="zen-dark-theme-styles-header"/>
<description class="description-deemphasized" data-l10n-id="zen-dark-theme-styles-description" />
<form xmlns="http://www.w3.org/1999/xhtml" autocomplete="off" id="zen-dark-theme-styles-form">
<label class="web-appearance-choice">
<div class="web-appearance-choice-image-container"><img role="presentation" alt="" width="54" height="42" /></div>
<div class="web-appearance-choice-footer">
<input type="radio" name="web-appearance" value="amoled" data-l10n-id="preferences-web-appearance-choice-input-auto"
/><span data-l10n-id="zen-dark-theme-styles-amoled" />
</div>
</label>
<label class="web-appearance-choice">
<div class="web-appearance-choice-image-container"><img role="presentation" alt="" width="54" height="42" /></div>
<div class="web-appearance-choice-footer">
<input type="radio" name="web-appearance" value="default" data-l10n-id="preferences-web-appearance-choice-input-light"
/><span data-l10n-id="zen-dark-theme-styles-default" />
</div>
</label>
<label class="web-appearance-choice">
<div class="web-appearance-choice-image-container"><img role="presentation" alt="" width="54" height="42" /></div>
<div class="web-appearance-choice-footer">
<input type="radio" name="web-appearance" value="colorful" data-l10n-id="preferences-web-appearance-choice-input-dark"
/><span data-l10n-id="zen-dark-theme-styles-colorful" />
</div>
</label>
</form>
</html:div>
</groupbox>
<hbox id="zenThemeCategory"
@@ -57,6 +69,24 @@
<label><html:h2 data-l10n-id="zen-look-and-feel-urlbar-header"/></label>
<description class="description-deemphasized" data-l10n-id="zen-look-and-feel-urlbar-description" />
<label><html:h2 data-l10n-id="zen-look-and-feel-compact-view-header"/></label>
<description class="description-deemphasized" data-l10n-id="zen-look-and-feel-compact-view-description" />
<checkbox id="zenLooksAndFeelShowCompactView"
data-l10n-id="zen-look-and-feel-compact-view-enabled"
preference="zen.view.compact"/>
<vbox class="indent">
<checkbox id="zenLooksAndFeelShowCompactViewToolbar"
data-l10n-id="zen-look-and-feel-compact-view-top-toolbar"
preference="zen.view.compact.hide-toolbar"/>
<checkbox id="zenLooksAndFeelEnableToolbarFlashPopup"
data-l10n-id="zen-look-and-feel-compact-toolbar-flash-popup"
preference="zen.view.compact.toolbar-flash-popup"/>
</vbox>
<checkbox id="zenLooksAndFeelShowLegacyToolbar"
data-l10n-id="zen-look-and-feel-legacy-toolbar"
preference="zen.themes.tabs.legacy-location"/>
</groupbox>
<hbox id="zenSidePanelsCategory"

14
src/browser/themes/shared/preferences/zen-preferences.css
View File

@@ -5,7 +5,7 @@
*/
:root {
--zen-settings-secondary-background: light-dark(#f2f4f4, #171717);
--zen-settings-secondary-background: light-dark(#f2f4f4, color-mix(in srgb, var(--zen-colors-tertiary) 50%, #0f0f0f 50%));
}
.main-content {
@@ -140,6 +140,18 @@ groupbox h2 {
/* Look and feel */
#webAppearanceSettings,
#zen-theme-builder-wrapper + box {
margin-bottom: 15px;
}
#zen-dark-theme-styles-form {
display: flex;
justify-content: space-between;
gap: var(--space-large);
margin-top: 5px;
}
#zen-expand-tabbar-strat {
display: flex;
flex-direction: column;