From 3df09862574062e4e366b6e2560bd5584edc6816 Mon Sep 17 00:00:00 2001 From: Martin Berg Alstad Date: Tue, 15 Apr 2025 18:25:25 +0200 Subject: [PATCH] :Moved zen styling to hosts: --- .../home-manager/zen/chrome/userChrome.css | 113 +++++++++++++ .../home-manager/zen/chrome/userContent.css | 158 ++++++++++++++++++ .../home-manager/zen/chrome/zen-logo.svg | 13 ++ hosts/desktop/home-manager/zen/default.nix | 7 + hosts/thinkpad/home-manager/zen/default.nix | 8 +- 5 files changed, 294 insertions(+), 5 deletions(-) create mode 100644 hosts/desktop/home-manager/zen/chrome/userChrome.css create mode 100644 hosts/desktop/home-manager/zen/chrome/userContent.css create mode 100644 hosts/desktop/home-manager/zen/chrome/zen-logo.svg create mode 100644 hosts/desktop/home-manager/zen/default.nix diff --git a/hosts/desktop/home-manager/zen/chrome/userChrome.css b/hosts/desktop/home-manager/zen/chrome/userChrome.css new file mode 100644 index 0000000..b37a865 --- /dev/null +++ b/hosts/desktop/home-manager/zen/chrome/userChrome.css @@ -0,0 +1,113 @@ +/* Catppuccin Mocha Blue userChrome.css*/ + +@media (prefers-color-scheme: dark) { + :root { + --zen-colors-primary: #313244 !important; + --zen-primary-color: #89b4fa !important; + --zen-colors-secondary: #313244 !important; + --zen-colors-tertiary: #181825 !important; + --zen-colors-border: #89b4fa !important; + --toolbarbutton-icon-fill: #89b4fa !important; + --lwt-text-color: #cdd6f4 !important; + --toolbar-field-color: #cdd6f4 !important; + --tab-selected-textcolor: rgb(171, 197, 247) !important; + --toolbar-field-focus-color: #cdd6f4 !important; + --toolbar-color: #cdd6f4 !important; + --newtab-text-primary-color: #cdd6f4 !important; + --arrowpanel-color: #cdd6f4 !important; + --arrowpanel-background: #1e1e2e !important; + --sidebar-text-color: #cdd6f4 !important; + --lwt-sidebar-text-color: #cdd6f4 !important; + --lwt-sidebar-background-color: #11111b !important; + --toolbar-bgcolor: #313244 !important; + --newtab-background-color: #1e1e2e !important; + --zen-themed-toolbar-bg: #181825 !important; + --zen-main-browser-background: #181825 !important; + } + + #permissions-granted-icon { + color: #181825 !important; + } + + .sidebar-placesTree { + background-color: #1e1e2e !important; + } + + #zen-workspaces-button { + background-color: #1e1e2e !important; + } + + #TabsToolbar { + background-color: #181825 !important; + } + + #urlbar-background { + background-color: #1e1e2e !important; + } + + .content-shortcuts { + background-color: #1e1e2e !important; + border-color: #89b4fa !important; + } + + .urlbarView-url { + color: #89b4fa !important; + } + + #zenEditBookmarkPanelFaviconContainer { + background: #11111b !important; + } + + toolbar .toolbarbutton-1 { + &:not([disabled]) { + &:is([open], [checked]) + > :is( + .toolbarbutton-icon, + .toolbarbutton-text, + .toolbarbutton-badge-stack + ) { + fill: #11111b; + } + } + } + + .identity-color-blue { + --identity-tab-color: #89b4fa !important; + --identity-icon-color: #89b4fa !important; + } + + .identity-color-turquoise { + --identity-tab-color: #94e2d5 !important; + --identity-icon-color: #94e2d5 !important; + } + + .identity-color-green { + --identity-tab-color: #a6e3a1 !important; + --identity-icon-color: #a6e3a1 !important; + } + + .identity-color-yellow { + --identity-tab-color: #f9e2af !important; + --identity-icon-color: #f9e2af !important; + } + + .identity-color-orange { + --identity-tab-color: #fab387 !important; + --identity-icon-color: #fab387 !important; + } + + .identity-color-red { + --identity-tab-color: #f38ba8 !important; + --identity-icon-color: #f38ba8 !important; + } + + .identity-color-pink { + --identity-tab-color: #f5c2e7 !important; + --identity-icon-color: #f5c2e7 !important; + } + + .identity-color-purple { + --identity-tab-color: #cba6f7 !important; + --identity-icon-color: #cba6f7 !important; + } +} diff --git a/hosts/desktop/home-manager/zen/chrome/userContent.css b/hosts/desktop/home-manager/zen/chrome/userContent.css new file mode 100644 index 0000000..036655d --- /dev/null +++ b/hosts/desktop/home-manager/zen/chrome/userContent.css @@ -0,0 +1,158 @@ +/* Catppuccin Mocha Blue userContent.css*/ + +@media (prefers-color-scheme: dark) { + /* Common variables affecting all pages */ + @-moz-document url-prefix("about:") { + :root { + --in-content-page-color: #cdd6f4 !important; + --color-accent-primary: #89b4fa !important; + --color-accent-primary-hover: rgb(163, 197, 251) !important; + --color-accent-primary-active: rgb(138, 153, 250) !important; + background-color: #1e1e2e !important; + --in-content-page-background: #1e1e2e !important; + } + } + + /* Variables and styles specific to about:newtab and about:home */ + @-moz-document url("about:newtab"), url("about:home") { + :root { + --newtab-background-color: #1e1e2e !important; + --newtab-background-color-secondary: #313244 !important; + --newtab-element-hover-color: #313244 !important; + --newtab-text-primary-color: #cdd6f4 !important; + --newtab-wordmark-color: #cdd6f4 !important; + --newtab-primary-action-background: #89b4fa !important; + } + + .icon { + color: #89b4fa !important; + } + + .search-wrapper .logo-and-wordmark .logo { + background: + url("zen-logo-mocha.svg"), + url("https://raw.githubusercontent.com/IAmJafeth/zen-browser/main/themes/Mocha/Blue/zen-logo-mocha.svg") + no-repeat center !important; + display: inline-block !important; + height: 82px !important; + width: 82px !important; + background-size: 82px !important; + } + + @media (max-width: 609px) { + .search-wrapper .logo-and-wordmark .logo { + background-size: 64px !important; + height: 64px !important; + width: 64px !important; + } + } + + .card-outer:is(:hover, :focus, .active):not(.placeholder) .card-title { + color: #89b4fa !important; + } + + .top-site-outer .search-topsite { + background-color: #89b4fa !important; + } + + .compact-cards .card-outer .card-context .card-context-icon.icon-download { + fill: #a6e3a1 !important; + } + } + + /* Variables and styles specific to about:preferences */ + @-moz-document url-prefix("about:preferences") { + :root { + --zen-colors-tertiary: #181825 !important; + --in-content-text-color: #cdd6f4 !important; + --link-color: #89b4fa !important; + --link-color-hover: rgb(163, 197, 251) !important; + --zen-colors-primary: #313244 !important; + --in-content-box-background: #313244 !important; + --zen-primary-color: #89b4fa !important; + } + + groupbox, + moz-card { + background: #1e1e2e !important; + } + + button, + groupbox menulist { + background: #313244 !important; + color: #cdd6f4 !important; + } + + .main-content { + background-color: #11111b !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 */ + @-moz-document url-prefix("about:addons") { + :root { + --zen-dark-color-mix-base: #181825 !important; + --background-color-box: #1e1e2e !important; + } + } + + /* Variables and styles specific to about:protections */ + @-moz-document url-prefix("about:protections") { + :root { + --zen-primary-color: #1e1e2e !important; + --social-color: #cba6f7 !important; + --coockie-color: #89dceb !important; + --fingerprinter-color: #f9e2af !important; + --cryptominer-color: #b4befe !important; + --tracker-color: #a6e3a1 !important; + --in-content-primary-button-background-hover: rgb(81, 83, 105) !important; + --in-content-primary-button-text-color-hover: #cdd6f4 !important; + --in-content-primary-button-background: #45475a !important; + --in-content-primary-button-text-color: #cdd6f4 !important; + } + + .card { + background-color: #313244 !important; + } + } +} diff --git a/hosts/desktop/home-manager/zen/chrome/zen-logo.svg b/hosts/desktop/home-manager/zen/chrome/zen-logo.svg new file mode 100644 index 0000000..3038ff2 --- /dev/null +++ b/hosts/desktop/home-manager/zen/chrome/zen-logo.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/hosts/desktop/home-manager/zen/default.nix b/hosts/desktop/home-manager/zen/default.nix new file mode 100644 index 0000000..fa562fc --- /dev/null +++ b/hosts/desktop/home-manager/zen/default.nix @@ -0,0 +1,7 @@ +{ + # TODO merge with shared + home.file.".zen/audtxq7n.default/chrome" = { + source = ./chrome; + recursive = true; + }; +} diff --git a/hosts/thinkpad/home-manager/zen/default.nix b/hosts/thinkpad/home-manager/zen/default.nix index 721d1a9..15d93cc 100644 --- a/hosts/thinkpad/home-manager/zen/default.nix +++ b/hosts/thinkpad/home-manager/zen/default.nix @@ -1,9 +1,7 @@ { # TODO merge with shared - home = { - file.".zen/xdaxqlov.default/chrome" = { - source = ./chrome; - recursive = true; - }; + home.file.".zen/xdaxqlov.default/chrome" = { + source = ./chrome; + recursive = true; }; }