mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-09-05 19:08:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update Zen theme styles for improved button color mixing and enhance welcome page button styling

Browse Source
This commit is contained in:
mr. M
2025-02-14 01:00:45 +01:00
parent 425d0ea951
commit d003a31353
3 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -46,20 +46,20 @@
--in-content-primary-button-background: color-mix(
in srgb,
var(--zen-primary-color) 10%,
var(--zen-branding-bg) 90%
var(--zen-primary-color) 30%,
var(--zen-branding-bg-reverse) 70%
) !important;
--in-content-primary-button-background-hover: color-mix(
in srgb,
var(--zen-primary-color) 15%,
var(--zen-branding-bg) 85%
var(--zen-primary-color) 35%,
var(--zen-branding-bg-reverse) 65%
) !important;
--in-content-primary-button-background-active: color-mix(
in srgb,
var(--zen-primary-color) 20%,
var(--zen-branding-bg) 80%
var(--zen-primary-color) 40%,
var(--zen-branding-bg-reverse) 60%
) !important;
--button-text-color-primary: var(--zen-branding-bg-reverse) !important;
--button-text-color-primary: var(--zen-branding-bg) !important;
--in-content-primary-button-text-color: var(--zen-colors-primary-foreground) !important;
--in-content-primary-button-border-color: transparent !important;
--in-content-primary-button-border-hover: transparent !important;

6
src/browser/base/content/zen-styles/zen-welcome.css
View File

@@ -11,11 +11,17 @@
#zen-welcome-start {
flex-direction: column;
--zen-primary-color: light-dark(black, white);
#zen-welcome-start-button {
opacity: 0;
list-style-image: url(chrome://browser/skin/zen-icons/forward.svg);
position: absolute;
bottom: 10%;
.button-icon {
filter: invert(1);
}
}
#zen-welcome-title {

2
src/browser/base/zen-components/ZenWelcome.mjs
View File

@@ -19,7 +19,7 @@
<html:div id="zen-welcome">
<html:div id="zen-welcome-start">
<html:h1 class="zen-branding-title" id="zen-welcome-title"></html:h1>
<button id="zen-welcome-start-button">
<button class="footer-button primary" id="zen-welcome-start-button">
</button>
</html:div>
</html:div>