Implement Zen Welcome page with initial animation and styling; remove deprecated files

This commit is contained in:
mr. M
2025-02-14 00:42:18 +01:00
parent 721e121ebe
commit 425d0ea951
18 changed files with 126 additions and 1118 deletions

View File

@@ -38,6 +38,8 @@
gZenVerticalTabsManager.init();
gZenUIManager.init();
this._checkForWelcomePage();
document.l10n.setAttributes(document.getElementById('tabs-newtab-button'), 'tabs-toolbar-new-tab');
} catch (e) {
console.error('ZenThemeModifier: Error initializing browser layout', e);
@@ -119,6 +121,17 @@
gURLBar._initPasteAndGo();
gURLBar._initStripOnShare();
},
_checkForWelcomePage() {
if (!Services.prefs.getBoolPref('zen.welcome-screen.seen', false) && Services.prefs.getBoolPref('zen.welcome-screen.enabled', true)) {
//Services.prefs.setBoolPref('zen.welcome-screen.seen', true);
console.log('ZenStartup: Show welcome page');
Services.scriptloader.loadSubScript(
"chrome://browser/content/zen-components/ZenWelcome.mjs",
window
);
}
}
};
ZenStartup.init();

View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/browser.js b/browser/base/content/browser.js
index 019b168c1aeae7e1c97a3ae58c99a48a27f54134..1f051e8a1e8a58e8bb721196deecfa36f4089dd6 100644
index 019b168c1aeae7e1c97a3ae58c99a48a27f54134..5225d0539aa7dabf81a8fd60af3e839f203d296c 100644
--- a/browser/base/content/browser.js
+++ b/browser/base/content/browser.js
@@ -32,6 +32,7 @@ ChromeUtils.defineESModuleGetters(this, {
@@ -10,23 +10,7 @@ index 019b168c1aeae7e1c97a3ae58c99a48a27f54134..1f051e8a1e8a58e8bb721196deecfa36
DevToolsSocketStatus:
"resource://devtools/shared/security/DevToolsSocketStatus.sys.mjs",
DownloadUtils: "resource://gre/modules/DownloadUtils.sys.mjs",
@@ -632,6 +633,15 @@ XPCOMUtils.defineLazyPreferenceGetter(
false
);
+const ZEN_WELCOME_PATH = "zen-welcome";
+const ZEN_WELCOME_ELEMENT_ATTR = "zen-dialog-welcome-element";
+XPCOMUtils.defineLazyServiceGetter(
+ this,
+ "ProfileService",
+ "@mozilla.org/toolkit/profile-service;1",
+ "nsIToolkitProfileService"
+);
+
customElements.setElementCreationCallback("screenshots-buttons", () => {
Services.scriptloader.loadSubScript(
"chrome://browser/content/screenshots/screenshots-buttons.js",
@@ -3440,6 +3450,10 @@ var XULBrowserWindow = {
@@ -3440,6 +3441,10 @@ var XULBrowserWindow = {
AboutReaderParent.updateReaderButton(gBrowser.selectedBrowser);
TranslationsParent.onLocationChange(gBrowser.selectedBrowser);
@@ -37,7 +21,7 @@ index 019b168c1aeae7e1c97a3ae58c99a48a27f54134..1f051e8a1e8a58e8bb721196deecfa36
PictureInPicture.updateUrlbarToggle(gBrowser.selectedBrowser);
if (!gMultiProcessBrowser) {
@@ -4435,7 +4449,7 @@ nsBrowserAccess.prototype = {
@@ -4435,7 +4440,7 @@ nsBrowserAccess.prototype = {
// Passing a null-URI to only create the content window,
// and pass true for aSkipLoad to prevent loading of
// about:blank
@@ -46,7 +30,7 @@ index 019b168c1aeae7e1c97a3ae58c99a48a27f54134..1f051e8a1e8a58e8bb721196deecfa36
null,
aParams,
aWhere,
@@ -4443,6 +4457,10 @@ nsBrowserAccess.prototype = {
@@ -4443,6 +4448,10 @@ nsBrowserAccess.prototype = {
aName,
true
);
@@ -57,16 +41,3 @@ index 019b168c1aeae7e1c97a3ae58c99a48a27f54134..1f051e8a1e8a58e8bb721196deecfa36
},
openURIInFrame: function browser_openURIInFrame(
@@ -7285,6 +7303,12 @@ var gDialogBox = {
parentElement.showModal();
this._didOpenHTMLDialog = true;
+ if (uri.includes(ZEN_WELCOME_PATH)) {
+ parentElement.setAttribute(ZEN_WELCOME_ELEMENT_ATTR, true);
+ } else if (parentElement.hasAttribute(ZEN_WELCOME_ELEMENT_ATTR)) {
+ parentElement.removeAttribute(ZEN_WELCOME_ELEMENT_ATTR);
+ }
+
// Disable menus and shortcuts.
this._updateMenuAndCommandState(false /* to disable */);

View File

@@ -24,6 +24,8 @@
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-compact-mode.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/skin/zen-icons/icons.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-branding.css" />
<link rel="stylesheet" type="text/css" href="chrome://browser/content/zen-styles/zen-welcome.css" />
</linkset>
# Scripts used all over the browser

View File

@@ -24,6 +24,7 @@
content/browser/zen-components/ZenActorsManager.mjs (zen-components/ZenActorsManager.mjs)
content/browser/zen-components/ZenRices.mjs (zen-components/ZenRices.mjs)
content/browser/zen-components/ZenEmojies.mjs (zen-components/ZenEmojies.mjs)
content/browser/zen-components/ZenWelcome.mjs (zen-components/ZenWelcome.mjs)
content/browser/zen-styles/zen-theme.css (content/zen-styles/zen-theme.css)
content/browser/zen-styles/zen-buttons.css (content/zen-styles/zen-buttons.css)
@@ -47,11 +48,12 @@
content/browser/zen-styles/zen-gradient-generator.css (content/zen-styles/zen-gradient-generator.css)
content/browser/zen-styles/zen-rices.css (content/zen-styles/zen-rices.css)
content/browser/zen-styles/zen-branding.css (content/zen-styles/zen-branding.css)
content/browser/zen-styles/zen-welcome.css (content/zen-styles/zen-welcome.css)
content/browser/zen-styles/zen-panels/bookmarks.css (content/zen-styles/zen-panels/bookmarks.css)
content/browser/zen-styles/zen-panels/extensions.css (content/zen-styles/zen-panels/extensions.css)
content/browser/zen-styles/zen-panels/print.css (content/zen-styles/zen-panels/print.css)
content/browser/zen-styles/zen-panels/welcome.css (content/zen-styles/zen-panels/welcome.css)
content/browser/zen-styles/zen-panels/dialog.css (content/zen-styles/zen-panels/dialog.css)
* content/browser/zen-styles/zen-compact-mode.css (content/zen-styles/zen-compact-mode.css)

View File

@@ -0,0 +1,11 @@
/*
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
/* Zen Welcome idalog override */
@media (prefers-color-scheme: dark) {
.dialogBox:not(.spotlightBox) {
border: 1px solid var(--zen-colors-border);
}
}

View File

@@ -1,33 +0,0 @@
/*
* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
/* Zen Welcome idalog override */
@media (prefers-color-scheme: dark) {
.dialogBox:not(.spotlightBox) {
border: 1px solid var(--zen-colors-border);
}
}
#window-modal-dialog[zen-dialog-welcome-element='true'] .dialogBox:not(.spotlightBox) {
margin: 0 !important;
}
#window-modal-dialog[zen-dialog-welcome-element='true'],
#window-modal-dialog[zen-dialog-welcome-element='true'] .dialogOverlay,
#window-modal-dialog[zen-dialog-welcome-element='true'] .dialogFrame,
#window-modal-dialog[zen-dialog-welcome-element='true'] .dialogBox {
width: 100% !important;
height: 100% !important;
max-height: none !important;
max-width: none !important;
}
#window-modal-dialog[zen-dialog-welcome-element='true'] {
--zen-welcome-dialog-space: 7px;
margin: 0 auto !important;
max-width: calc(100% - calc(var(--zen-welcome-dialog-space) * 2)) !important;
max-height: calc(100% - calc(var(--zen-welcome-dialog-space) * 2)) !important;
margin-top: var(--zen-welcome-dialog-space) !important;
}

View File

@@ -6,7 +6,7 @@
@import url('chrome://browser/content/zen-styles/zen-panels/bookmarks.css');
@import url('chrome://browser/content/zen-styles/zen-panels/extensions.css');
@import url('chrome://browser/content/zen-styles/zen-panels/print.css');
@import url('chrome://browser/content/zen-styles/zen-panels/welcome.css');
@import url('chrome://browser/content/zen-styles/zen-panels/dialog.css');
:root {
--panel-subview-body-padding: 2px 0;

View File

@@ -0,0 +1,33 @@
#zen-welcome,
#zen-welcome-start {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
#zen-welcome-start {
flex-direction: column;
#zen-welcome-start-button {
opacity: 0;
list-style-image: url(chrome://browser/skin/zen-icons/forward.svg);
position: absolute;
bottom: 10%;
}
#zen-welcome-title {
text-align: center;
font-size: 5rem;
line-height: 1.1;
max-width: 50%;
font-weight: 500;
& > span {
display: block;
opacity: 0;
}
}
}