Commit 71b5769

@@ -0,0 +1,241 @@
+{lib, ...}: {
+  flake.modules.homeManager.dev = {
+    config,
+    pkgs,
+    ...
+  }: let
+    tomlFormat = pkgs.formats.toml {};
+  in {
+    programs.jjui = {
+      enable = true;
+      settings = {
+        ui.theme = "stylix";
+      };
+    };
+
+    home.file."${config.programs.jjui.configDir}/themes/stylix.toml".source = tomlFormat.generate "jjui-theme-stylix" (let
+      colors = config.lib.stylix.colors.withHashtag;
+      isLight = config.lib.stylix.colors.variant == "light";
+    in {
+      # Base16/Base24 Colors Theme of JJUI - Stylix
+      # Modified from the template in https://github.com/vic/tinted-jjui
+      # I modified the border colors to base03 for better visibility
+      # Because for some reason JJUI uses border colors for preview pane texts
+      # =========================================
+      # Global Styles (apply throughout application)
+      # =========================================
+      text = {
+        fg = colors.base05;
+        bg = colors.base00;
+      };
+      dimmed = {
+        fg = colors.base03;
+        bg = colors.base00;
+      };
+      title = {
+        fg = colors.base0D;
+        bold = true;
+      };
+      shortcut = {fg = colors.base0E;};
+      matched = {fg = colors.base13;};
+      border = {fg = colors.base03;};
+      selected = {
+        bg = colors.base01;
+        fg = colors.base05;
+        bold = true;
+      };
+      # =========================================
+      # Operation-Specific Styles
+      # =========================================
+      source_marker = {
+        bg = colors.base10;
+        fg = colors.base00;
+        bold = true;
+      };
+      target_marker = {
+        bg = colors.base11;
+        fg = colors.base00;
+        bold = true;
+      };
+      # =========================================
+      # Status Bar (Bottom)
+      # =========================================
+      status = {bg = colors.base01;};
+      "status title" = {
+        fg = colors.base00;
+        bg = colors.base16;
+        bold = true;
+      };
+      # =========================================
+      # Revset (Top Bar Input)
+      # =========================================
+      "revset title" =
+        {
+          fg = colors.base0D;
+          bold = true;
+        }
+        // lib.optionalAttrs isLight {bg = colors.base01;};
+      "revset text" = {
+        fg = colors.base05;
+        bold = true;
+      };
+      "revset completion text" = {fg = colors.base05;};
+      "revset completion matched" = {
+        fg = colors.base13;
+        bold = true;
+      };
+      "revset completion dimmed" = {fg = colors.base03;};
+      "revset completion selected" =
+        if isLight
+        then {
+          bg = colors.base06;
+          fg = colors.base02;
+        }
+        else {
+          bg = colors.base02;
+          fg = colors.base05;
+        };
+      # =========================================
+      # Revisions / Oplog (Main List)
+      # =========================================
+      revisions = {fg = colors.base05;};
+      "revisions selected".bg =
+        if isLight
+        then colors.base02
+        else colors.base01;
+      "revisions dimmed" = {fg = colors.base03;};
+      "revisions details selected".bg =
+        if isLight
+        then colors.base04
+        else colors.base02;
+      "oplog selected" = {bold = true;};
+      # =========================================
+      # Evolog (Sub-List View)
+      # =========================================
+      evolog = {fg = colors.base05;};
+      "evolog selected" =
+        if isLight
+        then {
+          bg = colors.base06;
+          fg = colors.base01;
+          bold = true;
+        }
+        else {
+          bg = colors.base02;
+          fg = colors.base05;
+          bold = true;
+        };
+      # =========================================
+      # Menus (Git, Bookmarks, etc.)
+      # =========================================
+      menu = {bg = colors.base00;};
+      "menu title" = {
+        fg = colors.base00;
+        bg = colors.base17;
+        bold = true;
+      };
+      "menu shortcut" = {fg = colors.base17;};
+      "menu matched" = {
+        fg = colors.base13;
+        bold = true;
+      };
+      "menu dimmed" = {fg = colors.base03;};
+      "menu border" = {fg = colors.base03;};
+      "menu selected" =
+        if isLight
+        then {
+          bg = colors.base06;
+          fg = colors.base01;
+        }
+        else {
+          bg = colors.base02;
+          fg = colors.base05;
+        };
+      # =========================================
+      # Help Window
+      # =========================================
+      help = {bg = colors.base00;};
+      "help title" = {
+        fg = colors.base14;
+        bold = true;
+        underline = true;
+      };
+      "help border" = {fg = colors.base03;};
+      # =========================================
+      # Preview (Side Pane)
+      # =========================================
+      preview = {fg = colors.base05;};
+      "preview border" = {fg = colors.base03;};
+      # =========================================
+      # Confirmation Dialog
+      # =========================================
+      confirmation = {bg = colors.base00;};
+      "confirmation text" = {
+        fg = colors.base0D;
+        bold = true;
+      };
+      "confirmation dimmed" = {fg = colors.base03;};
+      "confirmation border" = {
+        fg = colors.base12;
+        bold = true;
+      };
+      "confirmation selected" =
+        if isLight
+        then {
+          bg = colors.base06;
+          fg = colors.base01;
+        }
+        else {
+          bg = colors.base02;
+          fg = colors.base05;
+        };
+      # =========================================
+      # Undo Operations
+      # =========================================
+      undo = {bg = colors.base00;};
+      "undo confirmation dimmed" = {fg = colors.base03;};
+      "undo confirmation selected" =
+        if isLight
+        then {
+          bg = colors.base06;
+          fg = colors.base01;
+        }
+        else {
+          bg = colors.base02;
+          fg = colors.base05;
+        };
+      # =========================================
+      # Additional commonly used selectors from Fire theme example
+      # =========================================
+      success = {
+        fg = colors.base14;
+        bold = true;
+      };
+      error = {
+        fg = colors.base12;
+        bold = true;
+      };
+      "revisions rebase source_marker" = {bold = true;};
+      "revisions rebase target_marker" = {bold = true;};
+      "status shortcut" = {fg = colors.base17;};
+      "status dimmed" = {fg = colors.base03;};
+      # =========================================
+      # Additional intermediate styles to improve inheritance
+      # =========================================
+      details = {fg = colors.base05;};
+      "details selected" = {bold = true;};
+      completion = {fg = colors.base05;};
+      "completion selected" = {bold = true;};
+      rebase = {bold = true;};
+      # =========================================
+      # Enhanced Base24 color utilization for better visual hierarchy
+      # =========================================
+      workspace = {fg = colors.base16;};
+      branch = {fg = colors.base15;};
+      commit = {fg = colors.base14;};
+      file = {fg = colors.base13;};
+      change = {fg = colors.base12;};
+      bookmark = {fg = colors.base17;};
+    });
+  };
+}