Added better UI for transparency in windows

This commit is contained in:
mr. M
2024-11-05 22:27:37 +01:00
parent 4f9b59ed6d
commit 3049bc8215
5 changed files with 13 additions and 4 deletions

View File

@@ -31,6 +31,7 @@
#browser { #browser {
width: 100%; width: 100%;
background: var(--zen-main-browser-background);
} }
#sidebar-box { #sidebar-box {
@@ -40,14 +41,16 @@
@supports (-moz-osx-font-smoothing: auto) { @supports (-moz-osx-font-smoothing: auto) {
#zen-main-app-wrapper { #zen-main-app-wrapper,
#zen-appcontent-wrapper,
#zen-sidebar-splitter {
appearance: -moz-window-titlebar !important; appearance: -moz-window-titlebar !important;
} }
} }
#zen-main-app-wrapper { #zen-main-app-wrapper {
background: var(--zen-main-browser-background); background: transparent;
& > * { & > * {
z-index: 1; z-index: 1;
} }

View File

@@ -55,8 +55,10 @@
padding: var(--zen-toolbox-padding) !important; padding: var(--zen-toolbox-padding) !important;
position: relative; position: relative;
background: var(--zen-dialog-background); background: var(--zen-dialog-background);
border: 1px solid var(--zen-colors-border);
@media (-moz-bool-pref: 'zen.view.compact.color-sidebar') { @media (-moz-bool-pref: 'zen.view.compact.color-sidebar') {
--zen-themed-toolbar-bg-transparency: 1 !important;
background: var(--zen-main-browser-background) !important; background: var(--zen-main-browser-background) !important;
background-attachment: fixed !important; background-attachment: fixed !important;
background-size: 2000px !important; /* Dont ask me why */ background-size: 2000px !important; /* Dont ask me why */
@@ -133,6 +135,7 @@
background: var(--zen-dialog-background); background: var(--zen-dialog-background);
@media (-moz-bool-pref: 'zen.view.compact.color-toolbar') { @media (-moz-bool-pref: 'zen.view.compact.color-toolbar') {
--zen-themed-toolbar-bg-transparency: 1 !important;
background-attachment: fixed; background-attachment: fixed;
backdrop-filter: blur(5px); backdrop-filter: blur(5px);
background: var(--zen-main-browser-background); background: var(--zen-main-browser-background);

View File

@@ -9,6 +9,7 @@
/* Watermark */ /* Watermark */
#zen-watermark { #zen-watermark {
--zen-themed-toolbar-bg-transparency: 1 !important;
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;

View File

@@ -600,6 +600,7 @@
z-index: 100 !important; z-index: 100 !important;
width: 250px !important; width: 250px !important;
--zen-themed-toolbar-bg-transparency: 1 !important;
background: var(--zen-main-browser-background) !important; background: var(--zen-main-browser-background) !important;
background-attachment: fixed !important; background-attachment: fixed !important;
background-size: 2000px !important; /* Dont ask me why */ background-size: 2000px !important; /* Dont ask me why */

View File

@@ -129,7 +129,8 @@
--zen-themed-toolbar-bg: light-dark(#f7f7f7, var(--zen-colors-tertiary)); --zen-themed-toolbar-bg: light-dark(#f7f7f7, var(--zen-colors-tertiary));
@supports (-moz-osx-font-smoothing: auto) { @supports (-moz-osx-font-smoothing: auto) {
--zen-themed-toolbar-bg: light-dark(rgba(255, 255, 255, 0.2), rgba(0, 0, 0, 0.2)) !important; --zen-themed-toolbar-bg-transparency: 0.2;
--zen-themed-toolbar-bg: light-dark(rgba(255, 255, 255, var(--zen-themed-toolbar-bg-transparency)), rgba(0, 0, 0, var(--zen-themed-toolbar-bg-transparency)));
} }
--toolbar-field-background-color: var(--zen-colors-input-bg) !important; --toolbar-field-background-color: var(--zen-colors-input-bg) !important;