mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2026-08-28 17:31:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: Update welcome page CSS and build configurations

Browse Source
This commit is contained in:
Mauro Balades
2024-08-01 22:10:58 +02:00
parent 406f11dd9a
commit 5d946db186
4 changed files with 111 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/browser/components/zen-welcome/welcome.css
View File

@@ -12,7 +12,6 @@ html {
body {
display: flex;
position: relative;
flex-flow: row nowrap;
width: 100%;
height: 100%;
overflow: hidden;
@@ -20,6 +19,25 @@ body {
-moz-transform: scale(1.1); /* zoom */
}
#first-view {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
border-radius: 10px;
margin: 20px;
background: var(--zen-dialog-background);
width: 100%;
position: relative;
}
#second-view {
width: 100%;
height: 100%;
position: relative;
}
button {
padding: 10px 40px;
}

146
src/browser/components/zen-welcome/welcome.html
View File

@@ -27,85 +27,91 @@ file, You can obtain one at http://mozilla.org/MPL/2.0/.
<script src="chrome://browser/content/zenThemeModifier.js"></script>
</head>
<body>
<div class="page" id="welcome">
<img class="icon" src="chrome://branding/content/about-logo.png" />
<h1 data-l10n-id="welcome-dialog-welcome"></h1>
<p data-l10n-id="welcome-dialog-welcome-subtext"></p>
<button
id="welcomeNext"
class="primary"
data-l10n-id="welcome-dialog-get-started"
></button>
</div>
<div class="page page-split" id="import">
<div>
<h1 data-l10n-id="welcome-dialog-import"></h1>
<p data-l10n-id="welcome-dialog-import-subtext"></p>
<div id="first-view">
<div class="page" id="welcome">
<img class="icon" src="chrome://branding/content/about-logo.png" />
<h1 data-l10n-id="welcome-dialog-welcome"></h1>
<p data-l10n-id="welcome-dialog-welcome-subtext"></p>
<button
id="welcomeNext"
class="primary"
data-l10n-id="welcome-dialog-get-started"
></button>
</div>
<div>
<hbox>
<button
class="primary"
id="importBrowser"
data-l10n-id="welcome-dialog-import-action"
></button>
<button
class="text-link ghost-button"
id="importNext"
data-l10n-id="welcome-dialog-skip"
></button>
</hbox>
</div>
</div>
<div class="page page-split" id="theme">
<div>
<h1 data-l10n-id="welcome-dialog-theme"></h1>
<p data-l10n-id="welcome-dialog-theme-subtext"></p>
</div>
<div>
<h1 data-l10n-id="welcome-dialog-theme-header-1"></h1>
<div id="themeList" class="cardGroup"></div>
<h1 data-l10n-id="welcome-dialog-theme-header-2"></h1>
<div id="colorListWrapper">
<canvas id="colorList" class="cardGroup"></canvas>
<div id="dragBall"></div>
<div id="colorPreview"></div>
<div class="page page-split" id="import">
<div>
<h1 data-l10n-id="welcome-dialog-import"></h1>
<p data-l10n-id="welcome-dialog-import-subtext"></p>
</div>
<div>
<hbox>
<button
class="primary"
id="importBrowser"
data-l10n-id="welcome-dialog-import-action"
></button>
<button
class="text-link ghost-button"
id="importNext"
data-l10n-id="welcome-dialog-skip"
></button>
</hbox>
</div>
</div>
<div class="page page-split" id="theme">
<div>
<h1 data-l10n-id="welcome-dialog-theme"></h1>
<p data-l10n-id="welcome-dialog-theme-subtext"></p>
</div>
<div>
<h1 data-l10n-id="welcome-dialog-theme-header-1"></h1>
<div id="themeList" class="cardGroup"></div>
<h1 data-l10n-id="welcome-dialog-theme-header-2"></h1>
<div id="colorListWrapper">
<canvas id="colorList" class="cardGroup"></canvas>
<div id="dragBall"></div>
<div id="colorPreview"></div>
</div>
<button
id="themeNext"
class="primary"
data-l10n-id="welcome-dialog-theme-action"
></button>
</div>
</div>
<div class="page page-split" id="search">
<div>
<h1 data-l10n-id="welcome-dialog-search"></h1>
<p data-l10n-id="welcome-dialog-search-subtext"></p>
</div>
<div>
<div id="searchList" class="cardGroup"></div>
<button
id="searchNext"
class="primary"
data-l10n-id="welcome-dialog-search-action"
></button>
</div>
</div>
<div class="page" id="thanks">
<h1 data-l10n-id="welcome-dialog-thanks"></h1>
<p data-l10n-id="welcome-dialog-thanks-subtext"></p>
<button
id="themeNext"
id="thanksNext"
class="primary"
data-l10n-id="welcome-dialog-theme-action"
data-l10n-id="welcome-dialog-thanks-action"
></button>
</div>
</div>
<div class="page page-split" id="search">
<div>
<h1 data-l10n-id="welcome-dialog-search"></h1>
<p data-l10n-id="welcome-dialog-search-subtext"></p>
</div>
<div>
<div id="searchList" class="cardGroup"></div>
<button
id="searchNext"
class="primary"
data-l10n-id="welcome-dialog-search-action"
></button>
</div>
</div>
<div id="second-view">
<div class="page" id="thanks">
<h1 data-l10n-id="welcome-dialog-thanks"></h1>
<p data-l10n-id="welcome-dialog-thanks-subtext"></p>
<button
id="thanksNext"
class="primary"
data-l10n-id="welcome-dialog-thanks-action"
></button>
</div>
<div id="dots"></div>