mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2026-01-05 12:57:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improved light theme and compact mode

Browse Source
This commit is contained in:
mr. M
2024-10-13 11:44:10 +02:00
parent 5aa17208a5
commit e840184e7f
2 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css
View File

@@ -204,7 +204,7 @@
content: '';
display: block;
height: 1px;
background: color-mix(in srgb, var(--zen-colors-border) 80%, transparent 20%);
background: var(--zen-colors-border);
width: 99%;
left: 50%;
transform: translateX(-50%);
@@ -303,6 +303,12 @@
}
}
}
@media (-moz-bool-pref: 'zen.view.compact') and (-moz-bool-pref: 'zen.view.compact.hide-toolbar') and (not (-moz-bool-pref: 'zen.view.compact.hide-tabbar')) {
& {
margin-top: var(--zen-element-separation) !important;
}
}
}
/* Mark: toolbox as collapsed */
@@ -352,7 +358,7 @@
content: '';
display: block;
height: 1px;
background: color-mix(in srgb, var(--zen-colors-border) 80%, transparent 20%);
background: var(--zen-colors-border);
width: 70%;
left: 50%;
transform: translateX(-50%);

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

@@ -23,10 +23,10 @@
--zen-colors-primary-foreground: color-mix(in srgb, var(--zen-primary-color) 80%, black 20%);
--zen-colors-border: color-mix(in srgb, var(--zen-colors-secondary) 98%, black 2%);
--zen-colors-input-bg: color-mix(in srgb, var(--zen-primary-color) 10%, white 80%);
--zen-colors-input-bg: color-mix(in srgb, var(--zen-primary-color) 1%, var(--zen-colors-tertiary) 99%);
--zen-dialog-background: var(--zen-colors-tertiary);
--zen-urlbar-background: color-mix(in srgb, var(--zen-primary-color) 8%, #f7f7f7 92%);
--zen-urlbar-background: color-mix(in srgb, var(--zen-primary-color) 3%, #f4f4f4 97%);
--zen-secondary-btn-color: var(--zen-colors-primary-foreground);
@@ -53,7 +53,7 @@
color-mix(in srgb, var(--zen-primary-color) 10%, transparent 90%)
) !important;
--in-content-button-background-hover: light-dark(
color-mix(in srgb, var(--zen-primary-color) 25%, transparent 75%),
color-mix(in srgb, var(--zen-primary-color) 5%, rgba(0, 0, 0, 0.1) 95%),
color-mix(in srgb, var(--zen-primary-color) 15%, transparent 85%)
) !important;
--button-bgcolor: var(--in-content-button-background) !important;
@@ -83,6 +83,7 @@
/* Other colors */
--urlbar-box-bgcolor: var(--zen-urlbar-background) !important;
--urlbar-box-active-bgcolor: var(--toolbarbutton-hover-background) !important;
--toolbar-field-focus-background-color: var(--urlbar-box-bgcolor) !important;
--zen-input-border-color: light-dark(rgb(204, 204, 204), rgb(66, 65, 77));
@@ -124,7 +125,7 @@
:host(:is(.anonymous-content-host, notification-message)),
:root {
--zen-in-content-dialog-background: rgb(23, 23, 23);
--zen-dark-color-mix-base: #171717;
--zen-dark-color-mix-base: rgb(21, 21, 21);
--zen-colors-primary: color-mix(in srgb, var(--zen-primary-color) 20%, var(--zen-dark-color-mix-base) 80%);
--zen-colors-secondary: color-mix(in srgb, var(--zen-primary-color) 30%, var(--zen-dark-color-mix-base) 70%);
--zen-colors-tertiary: color-mix(in srgb, var(--zen-primary-color) 1%, var(--zen-dark-color-mix-base) 99%);