diff --git a/.config/browser/chrome/zen-userChrome.css b/.config/browser/chrome/zen-userChrome.css index 4f5a37b7..6a391dcf 100644 --- a/.config/browser/chrome/zen-userChrome.css +++ b/.config/browser/chrome/zen-userChrome.css @@ -1,11 +1,12 @@ -/* Theming */ +/* Catppuccin Macchiato Lavender userChrome.css*/ + @media (prefers-color-scheme: dark) { :root { - --zen-colors-primary: #24273a !important; + --zen-colors-primary: #363a4f !important; --zen-primary-color: #b7bdf8 !important; --zen-colors-secondary: #363a4f !important; --zen-colors-tertiary: #1e2030 !important; - --zen-colors-border: #363a4f !important; + --zen-colors-border: #b7bdf8 !important; --toolbarbutton-icon-fill: #b7bdf8 !important; --lwt-text-color: #cad3f5 !important; --toolbar-field-color: #cad3f5 !important; @@ -22,10 +23,13 @@ --newtab-background-color: #24273a !important; --zen-themed-toolbar-bg: #1e2030 !important; --zen-main-browser-background: #1e2030 !important; - --newtab-primary-action-background: #b7bdf8 !important; --toolbox-bgcolor-inactive: #1e2030 !important; } + #permissions-granted-icon { + color: #1e2030 !important; + } + .sidebar-placesTree { background-color: #24273a !important; } @@ -39,7 +43,7 @@ } #urlbar-background { - background-color: #1e2030 !important; + background-color: #24273a !important; } .content-shortcuts { @@ -54,6 +58,75 @@ #zenEditBookmarkPanelFaviconContainer { background: #181926 !important; } + + #zen-media-controls-toolbar { + & #zen-media-progress-bar { + &::-moz-range-track { + background: #363a4f !important; + } + } + } + + toolbar .toolbarbutton-1 { + &:not([disabled]) { + &:is([open], [checked]) + > :is( + .toolbarbutton-icon, + .toolbarbutton-text, + .toolbarbutton-badge-stack + ) { + fill: #181926; + } + } + } + + .identity-color-blue { + --identity-tab-color: #8aadf4 !important; + --identity-icon-color: #8aadf4 !important; + } + + .identity-color-turquoise { + --identity-tab-color: #8bd5ca !important; + --identity-icon-color: #8bd5ca !important; + } + + .identity-color-green { + --identity-tab-color: #a6da95 !important; + --identity-icon-color: #a6da95 !important; + } + + .identity-color-yellow { + --identity-tab-color: #eed49f !important; + --identity-icon-color: #eed49f !important; + } + + .identity-color-orange { + --identity-tab-color: #f5a97f !important; + --identity-icon-color: #f5a97f !important; + } + + .identity-color-red { + --identity-tab-color: #ed8796 !important; + --identity-icon-color: #ed8796 !important; + } + + .identity-color-pink { + --identity-tab-color: #f5bde6 !important; + --identity-icon-color: #f5bde6 !important; + } + + .identity-color-purple { + --identity-tab-color: #c6a0f6 !important; + --identity-icon-color: #c6a0f6 !important; + } + + hbox#titlebar { + background-color: #1e2030 !important; + } + + #zen-appcontent-navbar-container { + background-color: #1e2030 !important; + } } #zen-essentials-container { diff --git a/.config/browser/chrome/zen-userContent.css b/.config/browser/chrome/zen-userContent.css index 409e7703..12e044b1 100644 --- a/.config/browser/chrome/zen-userContent.css +++ b/.config/browser/chrome/zen-userContent.css @@ -1,3 +1,5 @@ +/* Catppuccin Macchiato Lavender userContent.css*/ + @media (prefers-color-scheme: dark) { /* Common variables affecting all pages */ @-moz-document url-prefix("about:") { @@ -19,6 +21,7 @@ --newtab-element-hover-color: #363a4f !important; --newtab-text-primary-color: #cad3f5 !important; --newtab-wordmark-color: #cad3f5 !important; + --newtab-primary-action-background: #b7bdf8 !important; } .icon { @@ -83,6 +86,46 @@ .main-content { background-color: #181926 !important; } + + .identity-color-blue { + --identity-tab-color: #8aadf4 !important; + --identity-icon-color: #8aadf4 !important; + } + + .identity-color-turquoise { + --identity-tab-color: #8bd5ca !important; + --identity-icon-color: #8bd5ca !important; + } + + .identity-color-green { + --identity-tab-color: #a6da95 !important; + --identity-icon-color: #a6da95 !important; + } + + .identity-color-yellow { + --identity-tab-color: #eed49f !important; + --identity-icon-color: #eed49f !important; + } + + .identity-color-orange { + --identity-tab-color: #f5a97f !important; + --identity-icon-color: #f5a97f !important; + } + + .identity-color-red { + --identity-tab-color: #ed8796 !important; + --identity-icon-color: #ed8796 !important; + } + + .identity-color-pink { + --identity-tab-color: #f5bde6 !important; + --identity-icon-color: #f5bde6 !important; + } + + .identity-color-purple { + --identity-tab-color: #c6a0f6 !important; + --identity-icon-color: #c6a0f6 !important; + } } /* Variables and styles specific to about:addons */