diff --git a/l10n b/l10n
index 19e2af33c..91d6c42ee 160000
--- a/l10n
+++ b/l10n
@@ -1 +1 @@
-Subproject commit 19e2af33c4d901a4edece2b95c4372b40d50a942
+Subproject commit 91d6c42eebc1fb9ba6411419eb4830334808f7f1
diff --git a/src/browser/base/content/ZenStartup.mjs b/src/browser/base/content/ZenStartup.mjs
index e25539c50..c4c1ed945 100644
--- a/src/browser/base/content/ZenStartup.mjs
+++ b/src/browser/base/content/ZenStartup.mjs
@@ -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();
diff --git a/src/browser/base/content/browser-js.patch b/src/browser/base/content/browser-js.patch
index db2f39965..db842f9ea 100644
--- a/src/browser/base/content/browser-js.patch
+++ b/src/browser/base/content/browser-js.patch
@@ -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 */);
-
diff --git a/src/browser/base/content/zen-assets.inc.xhtml b/src/browser/base/content/zen-assets.inc.xhtml
index eefa0a5dd..ae919c76a 100644
--- a/src/browser/base/content/zen-assets.inc.xhtml
+++ b/src/browser/base/content/zen-assets.inc.xhtml
@@ -24,6 +24,8 @@
+
+
# Scripts used all over the browser
diff --git a/src/browser/base/content/zen-assets.jar.inc.mn b/src/browser/base/content/zen-assets.jar.inc.mn
index 563908e14..3c0aadb23 100644
--- a/src/browser/base/content/zen-assets.jar.inc.mn
+++ b/src/browser/base/content/zen-assets.jar.inc.mn
@@ -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)
diff --git a/src/browser/base/content/zen-styles/zen-panels/dialog.css b/src/browser/base/content/zen-styles/zen-panels/dialog.css
new file mode 100644
index 000000000..3c8799ee9
--- /dev/null
+++ b/src/browser/base/content/zen-styles/zen-panels/dialog.css
@@ -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);
+ }
+}
diff --git a/src/browser/base/content/zen-styles/zen-panels/welcome.css b/src/browser/base/content/zen-styles/zen-panels/welcome.css
deleted file mode 100644
index ea933a9bf..000000000
--- a/src/browser/base/content/zen-styles/zen-panels/welcome.css
+++ /dev/null
@@ -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;
-}
diff --git a/src/browser/base/content/zen-styles/zen-popup.css b/src/browser/base/content/zen-styles/zen-popup.css
index adc2fb884..0fe1dc861 100644
--- a/src/browser/base/content/zen-styles/zen-popup.css
+++ b/src/browser/base/content/zen-styles/zen-popup.css
@@ -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;
diff --git a/src/browser/base/content/zen-styles/zen-welcome.css b/src/browser/base/content/zen-styles/zen-welcome.css
new file mode 100644
index 000000000..4e7849250
--- /dev/null
+++ b/src/browser/base/content/zen-styles/zen-welcome.css
@@ -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;
+ }
+ }
+}
diff --git a/src/browser/base/zen-components/ZenWelcome.mjs b/src/browser/base/zen-components/ZenWelcome.mjs
new file mode 100644
index 000000000..139a891d7
--- /dev/null
+++ b/src/browser/base/zen-components/ZenWelcome.mjs
@@ -0,0 +1,57 @@
+
+{
+ function clearBrowserElements() {
+ for (const element of document.getElementById('browser').children) {
+ element.style.display = 'none';
+ }
+ }
+
+ function getMotion() {
+ return gZenUIManager.motion;
+ }
+
+ async function animate(...args) {
+ return getMotion().animate(...args);
+ }
+
+ function initializeZenWelcome() {
+ const XUL = `
+
+
+
+
+
+
+ `;
+ const fragment = window.MozXULElement.parseXULToFragment(XUL);
+ document.getElementById('browser').appendChild(fragment);
+ window.MozXULElement.insertFTLIfNeeded("browser/zen-welcome.ftl");
+ }
+
+ async function animateInitialStage() {
+ const [title1, title2] = await document.l10n.formatValues([{id:'zen-welcome-title-line1'}, {id:'zen-welcome-title-line2'}]);
+ const titleElement = document.getElementById('zen-welcome-title');
+ titleElement.innerHTML = `${title1}${title2}`;
+ await animate("#zen-welcome-title span", { opacity: [0, 1], y: [100, 0] }, {
+ delay: getMotion().stagger(0.6),
+ type: 'spring',
+ ease: 'ease-out',
+ bounce: 0,
+ });
+ await animate("#zen-welcome-start-button", { opacity: [0, 1], y: [100, 0] }, {
+ delay: 0.5,
+ type: 'spring',
+ ease: 'ease-in-out',
+ bounce: 0.4,
+ });
+ }
+
+ function startZenWelcome() {
+ clearBrowserElements();
+ initializeZenWelcome();
+ animateInitialStage();
+ }
+
+ startZenWelcome();
+}
diff --git a/src/browser/components/BrowserGlue-sys-mjs.patch b/src/browser/components/BrowserGlue-sys-mjs.patch
index cc19b6ee6..f2a09f011 100644
--- a/src/browser/components/BrowserGlue-sys-mjs.patch
+++ b/src/browser/components/BrowserGlue-sys-mjs.patch
@@ -1,5 +1,5 @@
diff --git a/browser/components/BrowserGlue.sys.mjs b/browser/components/BrowserGlue.sys.mjs
-index b888a753a7f23a9800fe04da51a4e6b898314ff2..35eea774e1ea4b1807ec65ebc767f423d81602bd 100644
+index b888a753a7f23a9800fe04da51a4e6b898314ff2..a6a01cf035253b05ea7b20b434cf2002ff115d96 100644
--- a/browser/components/BrowserGlue.sys.mjs
+++ b/browser/components/BrowserGlue.sys.mjs
@@ -121,6 +121,7 @@ ChromeUtils.defineESModuleGetters(lazy, {
@@ -18,28 +18,3 @@ index b888a753a7f23a9800fe04da51a4e6b898314ff2..35eea774e1ea4b1807ec65ebc767f423
// A channel for "remote troubleshooting" code...
let channel = new lazy.WebChannel(
"remote-troubleshooting",
-@@ -4761,6 +4763,7 @@ BrowserGlue.prototype = {
- },
-
- async _maybeShowDefaultBrowserPrompt() {
-+ this._ZenMaybeShowWelcomeScreen();
- // Highest priority is about:welcome window modal experiment
- // Second highest priority is the upgrade dialog, which can include a "primary
- // browser" request and is limited in various ways, e.g., major upgrades.
-@@ -5302,6 +5305,16 @@ BrowserGlue.prototype = {
- "nsIObserver",
- "nsISupportsWeakReference",
- ]),
-+
-+ _ZenMaybeShowWelcomeScreen() {
-+ const welcomeEnabled = Services.prefs.getBoolPref("zen.welcome-screen.enabled", true)
-+ const welcomeSeen = Services.prefs.getBoolPref("zen.welcome-screen.seen", false)
-+ if (welcomeEnabled && !welcomeSeen) {
-+ lazy.BrowserWindowTracker.getTopWindow().gDialogBox.open(
-+ "chrome://browser/content/zen-welcome/welcome.html"
-+ );
-+ }
-+ },
- };
-
- var ContentBlockingCategoriesPrefs = {
diff --git a/src/browser/components/moz-build.patch b/src/browser/components/moz-build.patch
deleted file mode 100644
index 59b696168..000000000
--- a/src/browser/components/moz-build.patch
+++ /dev/null
@@ -1,12 +0,0 @@
-diff --git a/browser/components/moz.build b/browser/components/moz.build
-index 6cbb7ce0037c1457eeae5c331a996719691ebd6b..611707852198740c9b4103f5e2a66e8ee4099a21 100644
---- a/browser/components/moz.build
-+++ b/browser/components/moz.build
-@@ -27,6 +27,7 @@ with Files("controlcenter/**"):
-
-
- DIRS += [
-+ "zen-welcome",
- "about",
- "aboutlogins",
- "aboutwelcome",
diff --git a/src/browser/components/zen-welcome/IMPORTANT.md b/src/browser/components/zen-welcome/IMPORTANT.md
deleted file mode 100644
index 8dc6bb9e9..000000000
--- a/src/browser/components/zen-welcome/IMPORTANT.md
+++ /dev/null
@@ -1,7 +0,0 @@
-# Important notes!
-
-Inside browser.js, we hardcoded-ly detect the path name for `zen-welcome` so we can add special attributes to the welcome page. If this path name changes, the welcome page will not work properly.
-
-Make sure to update the path name in browser.js if you change the path name of `zen-welcome`.
-
-The constant that contains this path name is `ZEN_WELCOME_PATH`.
diff --git a/src/browser/components/zen-welcome/jar.mn b/src/browser/components/zen-welcome/jar.mn
deleted file mode 100644
index 14633857d..000000000
--- a/src/browser/components/zen-welcome/jar.mn
+++ /dev/null
@@ -1,9 +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/.
-
-browser.jar:
-% content browser %content/browser/ contentaccessible=yes
- content/browser/zen-welcome/welcome.html (welcome.html)
- content/browser/zen-welcome/welcome.css (welcome.css)
- content/browser/zen-welcome/welcome.js (welcome.js)
diff --git a/src/browser/components/zen-welcome/moz.build b/src/browser/components/zen-welcome/moz.build
deleted file mode 100644
index 4f61c47b9..000000000
--- a/src/browser/components/zen-welcome/moz.build
+++ /dev/null
@@ -1,4 +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/.
-JAR_MANIFESTS += ["jar.mn"]
diff --git a/src/browser/components/zen-welcome/welcome.css b/src/browser/components/zen-welcome/welcome.css
deleted file mode 100644
index b165780b5..000000000
--- a/src/browser/components/zen-welcome/welcome.css
+++ /dev/null
@@ -1,451 +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/.
-*/
-
-:root {
- --noise: url('data:image/png;base64,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');
-}
-
-html {
- width: 100%;
- height: 100%;
-}
-
-body {
- display: flex;
- position: relative;
- width: 100%;
- height: 100%;
- overflow: hidden;
- user-select: none;
-}
-
-body {
- background: var(--zen-branding-bg);
-}
-
-#main-view {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- position: relative;
- width: fit-content;
- margin: auto;
-}
-
-#welcome .zen-branding-title,
-#thanks .zen-branding-title {
- text-align: center;
- font-size: 7rem;
-}
-
-#buttons-footer {
- margin-top: auto;
- padding: 20px 0;
- width: 100%;
- display: flex;
- justify-content: space-between;
- align-items: center;
- z-index: 2;
-
- & button {
- opacity: 0;
- animation: fadeIn 0.5s ease-in-out forwards;
- animation-delay: 0.8s;
- }
-
- & button:nth-child(2) {
- animation-delay: 1s;
- }
-}
-
-body:has(:is(#welcome, #thanks):not([hidden='true'])) {
- & #buttons-footer {
- justify-content: center;
- position: fixed;
- bottom: 40px;
- margin: 0 auto;
-
- & button {
- background: var(--zen-branding-paper) !important;
- color: var(--zen-branding-dark) !important;
- }
- }
-}
-
-:is(#theme, #search) > div:nth-child(2) {
- width: 100%;
-}
-
-#main-view:has(:is(#welcome, #thanks):not([hidden='true'])) {
- width: 100%;
-
- & #back {
- display: none;
- }
-}
-
-button {
- padding: 8px;
- border-radius: 999px;
- font-size: 16px;
- font-weight: 600;
- cursor: pointer;
-}
-
-button.primary {
- background: var(--zen-branding-bg-reverse) !important;
- color: var(--zen-branding-bg) !important;
- transition: background 0.2s ease-in-out;
-
- &:hover {
- background: color-mix(in srgb, var(--zen-branding-bg-reverse) 80%, transparent 20%) !important;
- }
-}
-
-.page {
- display: flex;
- flex-direction: column;
- justify-content: center;
- width: -moz-available;
- align-items: center;
- margin: 32px;
-}
-
-h2 {
- font-size: 17px;
- font-weight: 600;
- margin: 35px 0 20px 0;
- line-height: 1;
-}
-
-.page-split:not([hidden='true']) {
- flex-direction: column;
- margin: auto;
- justify-content: start;
-}
-
-.page-split:not(#import, #theme) > div:first-child {
- margin-bottom: 20px;
-}
-
-:not(#theme) .card h3 {
- margin: auto;
- text-align: center;
-}
-
-#theme {
- & > div:first-child p {
- margin-bottom: 0 !important;
- }
-}
-
-#theme .card[disabled='true'] {
- opacity: 0.7;
- cursor: not-allowed;
-}
-
-.cardGroup {
- display: flex;
- flex-wrap: wrap;
- align-items: stretch;
- gap: 8px;
- margin-bottom: 8px;
-}
-
-.cardGroup .card {
- width: 140px;
- display: flex;
- flex-direction: column;
- align-items: center;
- align-content: space-between;
- border: 2px solid transparent !important;
- transition: all 0.1s ease-in-out !important;
- margin: 0 10px;
- border-radius: 7px;
- outline: none !important;
- cursor: auto;
- user-select: none;
-}
-
-.cardGroup .card.selected {
- border: 2px solid var(--zen-colors-primary) !important;
- transform: scale(1.1);
-}
-
-h1 {
- font-size: 32px;
- font-weight: 700;
- margin: 16px 0 5px 0;
- line-height: 1;
-}
-
-.page > div:nth-child(2) h1 {
- margin-bottom: 15px;
- margin-top: 10px;
- font-size: 18px;
-}
-
-p {
- font-size: 16px;
- opacity: 0.8;
- margin: 0;
- margin-bottom: 30px;
-}
-
-#zen-logo {
- -moz-context-properties: fill;
- fill: currentColor;
- display: inline-block;
- height: 42px;
- width: 42px;
- position: absolute;
- top: 40px;
- left: 50%;
- transform: translateX(-50%);
-}
-
-.asset {
- width: 500px;
- padding-bottom: 32px;
-}
-
-@media (prefers-color-scheme: light) {
- .dark-only {
- display: none;
- }
-}
-
-@media (prefers-color-scheme: dark) {
- .light-only {
- display: none;
- }
-}
-
-input[type='checkbox'] {
- display: inline-block;
- vertical-align: middle;
-}
-
-#importNext {
- margin-left: 30px;
- color: var(--in-content-primary-button-background);
-}
-
-#themeNext,
-#searchNext,
-#thanksNext {
- margin-top: 20px;
-}
-
-.page[hidden='true'] {
- display: none;
-}
-
-.page:not([hidden='true']) {
- display: flex;
-}
-
-.page:not([hidden='true']) > *:not(:has(.delay-animation)),
-.delay-animation,
-.delay-animation-2 {
- opacity: 0;
- animation: fadeIn 0.5s ease-in-out forwards;
-}
-
-#importBrowser {
- width: 100%;
- background: transparent !important;
- border: 1px solid var(--zen-branding-bg-reverse);
- color: var(--zen-branding-bg-reverse);
- padding: 16px;
- border-radius: 8px;
- margin-bottom: 20px;
- justify-content: start;
- display: flex;
-}
-
-#layout {
- text-align: center;
-}
-
-#layoutList {
- display: flex;
- gap: 20px;
-
- & > [layout] {
- display: flex;
- flex-direction: column;
- gap: 3px;
- font-weight: 600;
- cursor: pointer;
-
- &[disabled='true'] {
- opacity: 0.7;
- cursor: not-allowed;
- }
-
- & img {
- width: 250px;
- border-radius: 10px;
- border: 4px solid transparent;
- }
-
- &.selected img {
- border: 4px solid var(--zen-colors-primary);
- }
- }
-}
-
-@keyframes fadeIn {
- from {
- opacity: 0;
- transform: translate3d(0, 40px, 0);
- filter: blur(15px);
- }
-
- to {
- opacity: 1;
- filter: blur(0);
- transform: translate3d(0, 0, 0);
- }
-}
-
-/* There should be no more than 5 elements in a page */
-.page:not([hidden='true']) > *:nth-child(2):not(:has(.delay-animation)) {
- animation-delay: 0.2s;
-}
-.page:not([hidden='true']) > *:nth-child(3),
-.delay-animation:nth-child(1) {
- animation-delay: 0.4s;
-}
-.page:not([hidden='true']) > *:nth-child(4),
-.delay-animation:nth-child(2) {
- animation-delay: 0.6s;
-}
-.page:not([hidden='true']) > *:nth-child(5),
-.delay-animation:nth-child(3),
-.delay-animation-2:nth-child(1) {
- animation-delay: 0.8s;
-}
-
-.page:not([hidden='true']) > *:nth-child(6),
-.delay-animation:nth-child(4),
-.delay-animation-2:nth-child(2) {
- animation-delay: 1s;
-}
-
-#welcome {
- & h1 {
- animation-duration: 0.8s !important;
- }
-}
-
-.card h3 {
- margin-top: 10px;
-}
-
-#circular-progress {
- --size: 220px;
- --half-size: calc(var(--size) / 2);
- --stroke-width: 20px;
- --radius: calc((var(--size) - var(--stroke-width)) / 2);
- --circumference: calc(var(--radius) * pi * 2);
- --dash: calc((var(--progress) * var(--circumference)) / 100);
- position: absolute;
- top: 15px;
- right: 10px;
- width: 55px;
- height: 40px;
-}
-
-#circular-progress circle {
- cx: var(--half-size);
- cy: var(--half-size);
- r: var(--radius);
- stroke-width: var(--stroke-width);
- fill: none;
- stroke-linecap: round;
-}
-
-#circular-progress circle.bg {
- stroke: transparent;
-}
-
-#circular-progress circle.fg {
- transform: rotate(-90deg);
- transform-origin: var(--half-size) var(--half-size);
- stroke-dasharray: var(--dash) calc(var(--circumference) - var(--dash));
- transition: stroke-dasharray 0.3s linear 0s;
- stroke: var(--zen-branding-coral);
-}
-
-#colorListWrapper {
- display: flex;
- align-items: center;
-}
-
-#colorListWrapper > div {
- border-radius: 999px;
- height: 20px;
- width: 20px;
- border: 3px solid transparent;
- margin: 0 5px;
-}
-
-#colorListWrapper > div.selected {
- border: 3px solid light-dark(#000, #fff);
-}
-
-#welcome,
-#thanks {
- justify-content: center;
-}
-
-#themeList {
- display: flex;
- flex-wrap: nowrap;
-}
-
-#themeList > svg {
- border: 3px solid transparent;
- border-radius: 15px;
- height: -moz-available;
-}
-
-#themeList > svg.selected {
- border: 3px solid var(--zen-colors-primary);
-}
-
-#searchList.cardGroup {
- display: grid;
- grid-template-columns: 1fr 1fr;
- gap: 15px;
-}
-
-#searchList .card {
- width: -moz-available !important;
- margin: 0;
- display: flex;
- flex-direction: row;
- border-radius: 15px;
-
- & h3 {
- text-align: start;
- margin: 0;
- margin-left: 20px;
- }
-
- &.selected {
- transform: scale(1.01);
- }
-
- & img {
- width: 30px;
- height: 30px;
- border-radius: 15px;
- }
-}
diff --git a/src/browser/components/zen-welcome/welcome.html b/src/browser/components/zen-welcome/welcome.html
deleted file mode 100644
index 30cb70db8..000000000
--- a/src/browser/components/zen-welcome/welcome.html
+++ /dev/null
@@ -1,186 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 
-
-
-
- 
-
-
-
- 
-
-
-
-
-
-
-
-
-
-
-
-
-