From 22e412a23900a41ea414e3ca147d1aea0b8a57e9 Mon Sep 17 00:00:00 2001
From: joy <mail@joygnu.org>
Date: Wed, 27 Nov 2024 16:14:50 +0100
Subject: [PATCH] jauh

---
 flake.nix                         |   2 +-
 modules/wm/firefox/userChrome.nix | 501 ++++++++++++++++--------------
 modules/wm/stylix/default.nix     | 101 +++---
 3 files changed, 322 insertions(+), 282 deletions(-)

diff --git a/flake.nix b/flake.nix
index 7bf9ba1..2004d9c 100644
--- a/flake.nix
+++ b/flake.nix
@@ -26,7 +26,7 @@
           inherit nixpath;
           inherit pkgs-stable;
         };
-        modules = modules ++ [home-manager.nixosModules.default sops-nix.nixosModules.sops];
+        modules = modules ++ [home-manager.nixosModules.default sops-nix.nixosModules.sops stylix.nixosModules.stylix];
       };
   in {
     nixOnDroidConfigurations.default = nix-on-droid.lib.nixOnDroidConfiguration {
diff --git a/modules/wm/firefox/userChrome.nix b/modules/wm/firefox/userChrome.nix
index d8a5893..085a629 100644
--- a/modules/wm/firefox/userChrome.nix
+++ b/modules/wm/firefox/userChrome.nix
@@ -10,256 +10,289 @@
         enable = true;
         profiles.${username} = {
           userChrome = ''
-               #alltabs-button { display: none !important; }
-               @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
+                    #alltabs-button { display: none !important; }
+            @namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
 
-               :root {
-                   --background: #${config.home-manager.users.${username}.stylix.base16Scheme.base00};
-                   --secondary: #${config.home-manager.users.${username}.stylix.base16Scheme.base01};
-                   --foreground: #${config.home-manager.users.${username}.stylix.base16Scheme.base05};
-                   --blue-highlight: #${config.home-manager.users.${username}.stylix.base16Scheme.base0D};
-                   --separator: #${config.home-manager.users.${username}.stylix.base16Scheme.base03};
-                   --toolbar-bgcolor: var(--secondary) !important;
-                   --tab: var(--background);
-                   --tab-inactive: var(--secondary);
-                   --tab-hover: #${config.home-manager.users.${username}.stylix.base16Scheme.base02};
-                   --url-bar: #${config.home-manager.users.${username}.stylix.base16Scheme.base01};
-               }
-
-               .titlebar-buttonbox-container {
-                   display: none !important;
-               }
-
-               .panel-arrowcontainer {
-                   background-color: var(--secondary) !important;
-               }
-
-               #PopupAutoComplete,
-               #PopupSearchAutoComplete {
-                   background-color: var(--url-bar) !important;
-                   color: var(--foreground) !important;
-               }
-
-               panelview {
-                   background-color: var(--secondary) !important;
-                   color: var(--foreground) !important;
-               }
-
-               panel[type="autocomplete-richlistbox"] {
-                   background-color: transparent !important;
-                   border-radius: 4px !important;
-                   color: var(--foreground) !important;
-               }
-
-               toolbarseparator,
-               menuseparator {
-                   border-color: var(--separator) !important;
-                   border-image: none !important;
-               }
-
-               toolbar {
-                   background-color: var(--secondary);
-               }
-
-               toolbar#TabsToolbar {
-                   background-color: var(--background);
-               }
-
-               toolbar#TabsToolbar:-moz-window-inactive {
-                   background-color: var(--toolbar-bgcolor) !important;
-               }
-
-               #titlebar,
-               #titlebar-spacer,
-               #titlebar-buttonbox-container {
-                   background-color: var(--background) !important;
-                   border: none !important;
-               }
-
-               #navigator-toolbox {
-                   border: none !important;
-               }
-
-               #urlbar,
-               #searchbar {
-                   box-shadow: none !important;
-                   border: none !important;
-                   border-radius: 4px;
-                   color: var(--foreground) !important;
-                   background-color: var(--url-bar) !important;
-               }
-
-               #urlbar-input,
-               #urlbar-input-container {
-                   color: var(--foreground) !important;
-                   background-color: var(--url-bar) !important;
-               }
-
-               #urlbar:not([open]) #urlbar-input-container:focus-within,
-               #searchbar:focus-within {
-                   border: 2px solid var(--blue-highlight) !important;
-               }
-
-               #urlbar:focus-within,
-               #urlbar[open],
-               #urlbar[open] #urlbar-input-container,
-               #urlbar[open] #urlbar-input,
-               #urlbar-input-container:focus-within,
-               #urlbar-input:focus,
-               menupop {
-                   background-color: var(--url-bar) !important;
-               }
-
-              :is(panel, menupopup)::part(content) {
-                  background:none!important;
-              }
-
-              .urlbarView button:hover,
-              #searchbar button:hover,
-              .urlbarView-row:hover .urlbarView-row-inner,
-              .search-autocomplete-richlistbox-popup .autocomplete-richlistitem:hover {
-                  background-color :var(--blue-highlight)!important;
-              }
-
-              .urlbarView-row[type="switchtab"] > span {
-                  color :var(--blue-highlight)!important;
-              }
-
-              #PopupSearchAutoComplete .autocomplete-richlistitem[selected],
-              .searchbar-engine-one-off-item[selected],
-              .urlbarView-row[selected],
-              .urlbarView-row[aria-selected="true"],
-              .urlbarView-row:not([type="tip"], [type="dynamic"])[selected] > .urlbarView-row-inner,
-              .urlbarView-row-inner[selected] {
-                  color :var(--foreground)!important;
-                  background-color :var(--blue-highlight)!important;
-                  border-radius :4px!important;
-              }
-
-              #PersonalToolbar {
-                  background-color :var(--secondary)!important;
-              }
-
-              .tab-background[selected="true"] {
-                  background-color :transparent!important;
-                  background-image :none!important;
-              }
-
-              .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]):not([multiselected]) {
-                  background-color :transparent!important;
-              }
-
-              .tabbrowser-tab[soundplaying="true"] {
-                  border-bottom-color :var(--blue-highlight)!important;
-              }
-
-              .tab-content[selected="true"] {
-                  border-color :var(--blue-highlight)!important;
-              }
-
-              .tab-text {
-                  color :var(--foreground);
-              }
-
-              tab,
-              #tabbrowser-tabs {
-                  background-color :var(--background)!important;
-                  color :var(--foreground)!important;
-              }
-
-              tab:-moz-window-inactive,
-              #tabbrowser-tabs:-moz-window-inactive,
-              #nav-bar-customization-target {
-                  background-color :var(--secondary)!important;
-              }
-
-             .tabbrowser-tab[selected] {
-                 opacity :1;
-             }
-
-             .tab-loading-burst {
-                 background-color :inherit;
-             }
-
-             .tab-content {
-                 border-radius :4px;
-                 margin :5px 0px 5px 0px!important;
-                 border :1px solid transparent!important;
-             }
-
-             .tab-content[selected="true"] {
-                 background-color :var(--secondary)!important;
-                 color :var(--foreground)!important;
-                 border :1px solid var(--blue-highlight)!important;
-             }
-
-             .tab-content:not([selected="true"]):hover {
-                 background-color :var(--tab-hover)!important;
-             }
-
-             toolbarbutton {
-                 fill :var(--foreground)!important;
-                 background-color :transparent!important;
-             }
-
-             #TabsToolbar toolbarbutton {
-                 border-radius :4px;
-                 border :1px solid transparent!important;
-             }
-
-             #alltabs-button > .toolbarbutton-badge-stack,
-             #tabs-newtab-button > .toolbarbutton-icon {
-                 background-image :none;
-                 border-radius :6px;
-             }
-
-             #alltabs-button:hover > .toolbarbutton-badge-stack,
-             #tabs-newtab-button:hover > .toolbarbutton-icon {
-                 background-color :var(--blue-highlight)!important;
-             }
-
-             #TabsToolbar #firefox-view-button > .toolbarbutton-icon {
-                 background-image :none!important;
-                 border-radius :4px;
-             }
-
-             #TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon {
-                 background-color :var(--secondary)!important;
-                 color :var(--foreground)!important;
-                 padding :9px!important;
-                 border :1px solid var(--blue-highlight)!important;
-             }
-
-            /* Hover effect for Firefox view button */
-            #TabsToolbar #firefox-view-button:not([open]):hover > .toolbarbutton-icon {
-                background-color :var(--tab-hover)!important;
+            :root {
+                --background: #1d2021;
+                --secondary: #282828;
+                --foreground: #EBDBB2;
+                --orange-highlight: #fe8019;
+                --sound-border: #68217A;
+                --separator: #665e54;
+                --toolbar-bgcolor: var(--secondary) !important;
+                --tab: var(--background);
+                --tab-btn: var(--tab-inactive);
+                --tab-inactive: var(--secondary);
+                --tab-btn-inactive: var(--tab-inactive);
+                --tab-hover: #32302f;
+                --tab-btn-hover: #3C3836;
+                --toolbar-btn-hover: #49463f;
+                --url-bar: #3C3836; /* Updated color */
+                --url-focus: #3C3836;
+                --url-bar-item-hover: #6a6257;
+                --sidebar: #3C3836;
+                --sidebar-button-hover: #5A544B;
+                --sidebar-highlight: #458588;
+            }
+
+            .titlebar-buttonbox-container {
+                display: none !important;
+            }
+
+            .panel-arrowcontainer {
+                background-color: var(--secondary) !important;
+            }
+
+            #PopupAutoComplete,
+            #PopupSearchAutoComplete {
+                background-color: var(--url-focus) !important;
+                color: var(--foreground) !important;
+            }
+
+            panelview {
+                background-color: var(--sidebar) !important;
+                color: var(--foreground) !important;
+            }
+
+            panel[type="autocomplete-richlistbox"] {
+                --panel-background: none !important;
+                border-radius: 4px !important;
+                color: var(--foreground) !important;
+            }
+
+            toolbarseparator,
+            menuseparator {
+                border-color: var(--separator) !important;
+                border-image: none !important;
+            }
+
+            toolbar {
+                background-color: var(--secondary);
+            }
+
+            toolbar#TabsToolbar {
+                background-color: var(--background);
+            }
+
+            toolbar#TabsToolbar:-moz-window-inactive {
+                background-color: var(--toolbar-bgcolor) !important;
+            }
+
+            #titlebar,
+            #titlebar-spacer,
+            #titlebar-buttonbox-container {
+                background-color: var(--background) !important;
+                border: none !important;
+            }
+
+            #navigator-toolbox {
+                --tabs-border-color: var(--orange-highlight) !important;
+            }
+
+            #navigator-toolbox::after {
+                border-bottom: 0px !important;
+            }
+
+            #navigator-toolbox {
+                border: none !important;
+            }
+
+            #urlbar,
+            #searchbar {
+                box-shadow: none !important;
+                border: none !important;
+                border-radius: 4px;
+                color: var(--foreground) !important;
+                background-color: var(--url-bar) !important;
+                --autocomplete-popup-separator-color: var(--separator) !important;
+            }
+
+            #urlbar-input,
+            #urlbar-input-container {
+                color: var(--foreground) !important;
+                background-color: var(--url-bar) !important;
+            }
+
+            #urlbar:not([open]) #urlbar-input-container:focus-within,
+            #searchbar:focus-within {
+                border: 2px solid var(--orange-highlight) !important;
+            }
+
+            #urlbar:focus-within,
+            #urlbar[open],
+            #urlbar[open] #urlbar-input-container,
+            #urlbar[open] #urlbar-input,
+            #urlbar-input-container:focus-within,
+            #urlbar-input:focus,
+            #urlbar-background,
+            .urlbarView,
+            #searchbar:focus-within,
+            menupop {
+                background-color: var(--url-focus) !important;
+            }
+
+            #searchbar:focus-within {
+                outline: none !important;
+            }
+
+            :is(panel, menupopup)::part(content) {
+                background: none !important;
+            }
+
+            .urlbarView button:hover,
+            #searchbar button:hover,
+            .urlbarView-row:hover .urlbarView-row-inner,
+            .search-autocomplete-richlistbox-popup .autocomplete-richlistitem:hover {
+                background-color: var(--url-bar-item-hover) !important;
+            }
+
+            .urlbarView-row[type="switchtab"] > span {
+                color: var(--orange-highlight) !important;
+            }
+
+            #PopupSearchAutoComplete .autocomplete-richlistitem[selected],
+            .searchbar-engine-one-off-item[selected],
+            .urlbarView-row[selected],
+            .urlbarView-row[aria-selected="true"],
+            .urlbarView-row:not([type="tip"], [type="dynamic"])[selected] > .urlbarView-row-inner,
+            .urlbarView-row-inner[selected] {
+                color: var(--foreground) !important;
+                background-color: var(--sidebar-highlight) !important;
+                border-radius: 4px !important;
+            }
+
+            #PersonalToolbar {
+                background-color: var(--secondary) !important;
+            }
+
+            .tab-background[selected="true"] {
+                background-color: transparent !important;
+                background-image: none !important;
+            }
+
+            .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]):not([multiselected]) {
+                background-color: transparent !important;
+            }
+
+            .tabbrowser-tab[soundplaying="true"] {
+                --lwt-tab-line-color: var(--sound-border) !important;
+            }
+
+            .tab-content[selected="true"] {
+                border-color: var(--orange-highlight) !important;
+                --sound-border: var(--orange-highlight) !important;
+            }
+
+            .tab-text {
+                color: var(--foreground);
+            }
+
+            tab,
+            #tabbrowser-tabs {
+                background-color: var(--background) !important;
+                color: var(--foreground) !important;
+            }
+
+            tab:-moz-window-inactive,
+            #tabbrowser-tabs:-moz-window-inactive,
+            #nav-bar-customization-target {
+                background-color: var(--secondary) !important;
+            }
+
+            .tabbrowser-tab[selected] {
+                opacity: 1;
+            }
+
+            .tab-loading-burst {
+                background-color: inherit;
+            }
+
+            .tab-content {
+                border-radius: 4px;
+                margin: 5px 0px 5px 0px !important;
+                border: 1px solid transparent !important;
+            }
+
+            .tab-content[selected="true"] {
+                background-color: var(--secondary) !important;
+                color: var(--foreground) !important;
+                border: 1px solid var(--orange-highlight) !important;
+            }
+
+            .tab-content:not([selected="true"]):hover {
+                background-color: var(--tab-hover) !important;
+            }
+
+            toolbarbutton {
+                fill: var(--foreground) !important;
+                background-color: transparent !important;
+            }
+
+            #TabsToolbar toolbarbutton {
+                border-radius: 4px;
+                border: 1px solid transparent !important;
+            }
+
+            #alltabs-button > .toolbarbutton-badge-stack,
+            #tabs-newtab-button > .toolbarbutton-icon {
+                background-image: none;
+                border-radius: 6px;
+            }
+
+            #alltabs-button:hover > .toolbarbutton-badge-stack,
+            #tabs-newtab-button:hover > .toolbarbutton-icon {
+                background-color: var(--tab-btn-hover) !important;
+            }
+
+            #TabsToolbar #firefox-view-button > .toolbarbutton-icon {
+                background-image: none !important;
+                border-radius: 4px;
+            }
+
+            #TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon {
+                background-color: var(--secondary) !important;
+                color: var(--foreground) !important;
+                padding: 9px !important;
+                border: 1px solid var(--orange-highlight) !important;
+            }
+
+            #TabsToolbar #firefox-view-button:not([open]):hover > .toolbarbutton-icon {
+                background-color: var(--tab-hover) !important;
             }
 
-            /* Nav bar button styles */
             #nav-bar toolbarbutton > .toolbarbutton-icon,
             #nav-bar toolbarbutton > .toolbarbutton-badge-stack {
-                border-radius :6px;
+                border-radius: 6px;
             }
 
-            /* Nav bar button hover effect */
             #nav-bar toolbarbutton:hover > .toolbarbutton-icon,
             #nav-bar toolbarbutton:hover > .toolbarbutton-badge-stack {
-                background-color :var(--blue-highlight)!important;
+                background-color: var(--toolbar-btn-hover) !important;
             }
 
-            /* Back button padding */
             #back-button {
-                padding-right :2px!important;
-                padding-left :2px!important;
-                margin-left :6px!important;
+                padding-right: 2px !important;
+                padding-left: 2px !important;
+                margin-left: 6px !important;
             }
 
-            /* Panel UI menu button styles */
             #PanelUI-menu-button {
-                background-color :var(--secondary)!important;
-                padding-right :2px!important;
-                margin-right :6px!important;
+                background-color: var(--secondary) !important;
+                padding-right: 2px !important;
+                margin-right: 6px !important;
             }
+
+            #PersonalToolbar toolbarbutton {
+                margin: 3px 0px 3px 3px !important;
+                border-radius: 4px;
+            }
+
+            #PersonalToolbar toolbarbutton:hover {
+                background-color: var(--toolbar-btn-hover) !important;
+            }
+
+
           '';
         };
       };
diff --git a/modules/wm/stylix/default.nix b/modules/wm/stylix/default.nix
index 7fb22cc..c35aa8a 100644
--- a/modules/wm/stylix/default.nix
+++ b/modules/wm/stylix/default.nix
@@ -1,6 +1,5 @@
 {
   pkgs,
-  inputs,
   username,
   lib,
   config,
@@ -13,62 +12,70 @@ in {
     theme.enable = lib.mkEnableOption "";
   };
   config = lib.mkIf config.theme.enable {
-    home-manager.users.${username} = {
-      imports = [inputs.stylix.homeManagerModules.stylix];
+    stylix = {
+      enable = true;
+      polarity = "dark";
+      image = pkgs.fetchurl {
+        url = backgroundUrl;
+        sha256 = backgroundSha256;
+      };
+      base16Scheme = {
+        base00 = "282828"; # ----
+        base01 = "3c3836"; # ---
+        base02 = "504945"; # --
+        base03 = "665c54"; # -
+        base04 = "bdae93"; # +
+        base05 = "d5c4a1"; # ++
+        base06 = "ebdbb2"; # +++
+        base07 = "fbf1c7"; # ++++
+        base08 = "cc241d"; # red
+        base09 = "fe0819"; # orange
+        base0A = "d79921"; # yellow
+        base0B = "98971a"; # green
+        base0C = "689d6a"; # aqua/cyan
+        base0D = "458588"; # blue
+        base0E = "b16286"; # purple
+        base0F = "a89984"; # brown
+      };
+      cursor = {
+        name = "Bibata-Modern-Ice";
+        package = pkgs.bibata-cursors;
+        size = 24;
+      };
 
+      fonts = {
+        monospace = {
+          package = pkgs.nerdfonts.override {fonts = ["RobotoMono"];};
+          name = "RobotoMono Nerd Font";
+        };
+        sizes = {
+          applications = 12;
+          terminal = 13;
+          desktop = 12;
+          popups = 12;
+        };
+      };
+    };
+    home-manager.users.${username} = {
       stylix = {
         enable = true;
-        polarity = "dark";
         targets = {
           rofi.enable = false;
           dunst.enable = false;
           helix.enable = false;
         };
-
-        base16Scheme = {
-          base00 = "282828"; # ----
-          base01 = "3c3836"; # ---
-          base02 = "504945"; # --
-          base03 = "665c54"; # -
-          base04 = "bdae93"; # +
-          base05 = "d5c4a1"; # ++
-          base06 = "ebdbb2"; # +++
-          base07 = "fbf1c7"; # ++++
-          base08 = "cc241d"; # red
-          base09 = "fe0819"; # orange
-          base0A = "d79921"; # yellow
-          base0B = "98971a"; # green
-          base0C = "689d6a"; # aqua/cyan
-          base0D = "458588"; # blue
-          base0E = "b16286"; # purple
-          base0F = "a89984"; # brown
-        };
-
-        image = pkgs.fetchurl {
-          url = backgroundUrl;
-          sha256 = backgroundSha256;
-        };
-
-        cursor = {
-          name = "Bibata-Modern-Ice";
-          package = pkgs.bibata-cursors;
-          size = 24;
-        };
-
-        fonts = {
-          monospace = {
-            package = pkgs.nerdfonts.override {fonts = ["RobotoMono"];};
-            name = "RobotoMono Nerd Font";
-          };
-          sizes = {
-            applications = 12;
-            terminal = 13;
-            desktop = 12;
-            popups = 12;
-          };
-        };
       };
       xresources.path = ".config/.Xresources";
     };
+    home-manager.users.root = {
+      stylix = {
+        enable = true;
+        targets = {
+          rofi.enable = false;
+          dunst.enable = false;
+          helix.enable = false;
+        };
+      };
+    };
   };
 }