refactor styles to new color scheme basis

13 files changed, 168 insertions, 156 deletions

diff --git a/flake.nix b/flake.nix
index 9d56b2a..f80e975 100644
--- a/flake.nix
+++ b/flake.nix
@@ -54,7 +54,7 @@
         pkgs = nixpkgs.legacyPackages.${system};
       in {
         name = system;
-        value = import ./pkgs { inherit pkgs inputs system; };
+        value = import ./pkgs { inherit pkgs inputs system options; };
       }
     ) systems);
 
diff --git a/nix/programs/hypr/hyprland.nix b/nix/programs/hypr/hyprland.nix
index 7ca450d..9631674 100644
--- a/nix/programs/hypr/hyprland.nix
+++ b/nix/programs/hypr/hyprland.nix
@@ -7,6 +7,11 @@ let
   hyprland-plugins = inputs.hyprland-plugins.packages.${system};
   hy3 = inputs.hy3.packages.${system};
 
+  fg = "rgb(${config.theme.colors.fg})";
+  bg = "rgb(${config.theme.colors.bg})";
+  primary = "rgb(${config.theme.colors.primary})";
+  inactive = "rgb(${config.theme.colors.surface.bg})";
+
   debug = false;
 
 in
@@ -89,8 +94,8 @@ in
           resize_on_border = "yes";
           extend_border_grab_area = 20;
           border_size = config.theme.borderWidth;
-          "col.active_border" = "rgb(${config.theme.colors.accent})";
-          "col.inactive_border" = "rgb(${config.theme.colors.base04})";
+          "col.active_border" = "${primary}";
+          "col.inactive_border" = "${inactive}";
         };
 
         # Gestures
@@ -291,12 +296,12 @@ in
               radius = config.theme.outerRadius;
               border_width = config.theme.borderWidth;
 
-              "col.active" = "rgb(${config.theme.colors.base00})";
-              "col.active.border" = "rgb(${config.theme.colors.accent})";
-              "col.active.text" = "rgb(${config.theme.colors.base05})";
-              "col.inactive" = "rgb(${config.theme.colors.base00})";
-              "col.inactive.border" = "rgb(${config.theme.colors.base04})";
-              "col.inactive.text" = "rgb(${config.theme.colors.base05})";
+              "col.active" = "${bg}";
+              "col.active.border" = "${inactive}";
+              "col.active.text" = "${fg}";
+              "col.inactive" = "${bg}";
+              "col.inactive.border" = "${inactive}";
+              "col.inactive.text" = "${fg}";
             };
 
             autotile = {
diff --git a/nix/programs/hypr/hyprlock.nix b/nix/programs/hypr/hyprlock.nix
index 9324f57..8c8f63d 100644
--- a/nix/programs/hypr/hyprlock.nix
+++ b/nix/programs/hypr/hyprlock.nix
@@ -35,10 +35,10 @@
           dots_center = true;
           outer_color = "rgba(0, 0, 0, 0)";
           inner_color = "rgba(0, 0, 0, 0.5)";
-          font_color = "rgb(${config.theme.colors.base05})";
+          font_color = "rgb(${config.theme.colors.fg})";
           font_family = config.theme.font.regular;
           fade_on_empty = false;
-          placeholder_text = "<i><span foreground=\"##${config.theme.colors.base05}\">Input Password...</span></i>";
+          placeholder_text = "<i><span foreground=\"##${config.theme.colors.fg}\">Input Password...</span></i>";
           hide_input = false;
           position = "0, -120";
           halign = "center";
@@ -51,7 +51,7 @@
             monitor = "";
             text = "cmd[update:1000] echo \"$(date +\"%-H:%M:%S\")\"";
             font_size = 80;
-            font_color = "rgb(${config.theme.colors.base05})";
+            font_color = "rgb(${config.theme.colors.fg})";
             font_family = config.theme.font.header;
             position = "0, 500";
             halign = "center";
@@ -62,7 +62,7 @@
           {
             monitor = "";
             text = config.fullName;
-            font_color = "rgb(${config.theme.colors.base05})";
+            font_color = "rgb(${config.theme.colors.fg})";
             font_family = config.theme.font.header;
             font_size = 25;
             position = "0, 50";
diff --git a/nix/programs/kitty/default.nix b/nix/programs/kitty/default.nix
index 34534fb..994da43 100644
--- a/nix/programs/kitty/default.nix
+++ b/nix/programs/kitty/default.nix
@@ -39,47 +39,39 @@
         confirm_os_window_close = 0;
 
         # colors
-        background = "#${config.theme.colors.base00}";
-        foreground = "#${config.theme.colors.base05}";
-        selection_background = "#${config.theme.colors.base05}";
-        selection_foreground = "#${config.theme.colors.base00}";
-        url_color = "#${config.theme.colors.base04}";
-        cursor = "#${config.theme.colors.base05}";
-        active_border_color = "#${config.theme.colors.base03}";
-        inactive_border_color = "#${config.theme.colors.base01}";
-        active_tab_background = "#${config.theme.colors.base00}";
-        active_tab_foreground = "#${config.theme.colors.base05}";
-        inactive_tab_background = "#${config.theme.colors.base01}";
-        inactive_tab_foreground = "#${config.theme.colors.base04}";
-        tab_bar_background = "#${config.theme.colors.base01}";
+        background = "#${config.theme.colors.bg}";
+        foreground = "#${config.theme.colors.fg}";
+        selection_background = "#${config.theme.colors.surface.bg}";
+        selection_foreground = "#${config.theme.colors.surface.fg}";
+        url_color = "#${config.theme.colors.bright.yellow}";
+        cursor = "#${config.theme.colors.fg}";
+        active_border_color = "#${config.theme.colors.primary}";
+        inactive_border_color = "#${config.theme.colors.bg}";
+        active_tab_background = "#${config.theme.colors.bg}";
+        active_tab_foreground = "#${config.theme.colors.fg}";
+        inactive_tab_background = "#${config.theme.colors.bg}";
+        inactive_tab_foreground = "#${config.theme.colors.fg}";
+        tab_bar_background = "#${config.theme.colors.bg}";
 
         # normal
-        color0 = "#${config.theme.colors.base00}";
-        color1 = "#${config.theme.colors.base08}";
-        color2 = "#${config.theme.colors.base0B}";
-        color3 = "#${config.theme.colors.base0A}";
-        color4 = "#${config.theme.colors.base0D}";
-        color5 = "#${config.theme.colors.base0E}";
-        color6 = "#${config.theme.colors.base0C}";
-        color7 = "#${config.theme.colors.base05}";
+        color0 = "#${config.theme.colors.normal.black}";
+        color1 = "#${config.theme.colors.normal.red}";
+        color2 = "#${config.theme.colors.normal.green}";
+        color3 = "#${config.theme.colors.normal.yellow}";
+        color4 = "#${config.theme.colors.normal.blue}";
+        color5 = "#${config.theme.colors.normal.magenta}";
+        color6 = "#${config.theme.colors.normal.cyan}";
+        color7 = "#${config.theme.colors.normal.white}";
 
         # bright
-        color8 = "#${config.theme.colors.base03}";
-        color9 = "#${config.theme.colors.base08}";
-        color10 = "#${config.theme.colors.base0B}";
-        color11 = "#${config.theme.colors.base0A}";
-        color12 = "#${config.theme.colors.base0D}";
-        color13 = "#${config.theme.colors.base0E}";
-        color14 = "#${config.theme.colors.base0C}";
-        color15 = "#${config.theme.colors.base07}";
-
-        # extended base16 colors
-        color16 = "#${config.theme.colors.base09}";
-        color17 = "#${config.theme.colors.base0F}";
-        color18 = "#${config.theme.colors.base01}";
-        color19 = "#${config.theme.colors.base02}";
-        color20 = "#${config.theme.colors.base04}";
-        color21 = "#${config.theme.colors.base06}";
+        color8 = "#${config.theme.colors.bright.black}";
+        color9 = "#${config.theme.colors.bright.red}";
+        color10 = "#${config.theme.colors.bright.green}";
+        color11 = "#${config.theme.colors.bright.yellow}";
+        color12 = "#${config.theme.colors.bright.blue}";
+        color13 = "#${config.theme.colors.bright.magenta}";
+        color14 = "#${config.theme.colors.bright.cyan}";
+        color15 = "#${config.theme.colors.bright.white}";
       };
     };
   };
diff --git a/nix/programs/mako/default.nix b/nix/programs/mako/default.nix
index 93999b5..2bd2a56 100644
--- a/nix/programs/mako/default.nix
+++ b/nix/programs/mako/default.nix
@@ -13,11 +13,11 @@
         margin = toString config.theme.outerGap;
         padding = toString config.theme.innerGap;
 
-        background-color = "#${config.theme.colors.base00}";
-        progress-color = "#${config.theme.colors.base00}";
-        text-color = "#${config.theme.colors.base05}";
+        background-color = "#${config.theme.colors.bg}";
+        progress-color = "#${config.theme.colors.primary}";
+        text-color = "#${config.theme.colors.fg}";
 
-        border-color = "#${config.theme.colors.base05}";
+        border-color = "#${config.theme.colors.fg}";
         border-size = config.theme.borderWidth;
         border-radius = config.theme.outerRadius;
 
diff --git a/nix/programs/neovim/default.nix b/nix/programs/neovim/default.nix
index 0eaccd3..a88b9d7 100644
--- a/nix/programs/neovim/default.nix
+++ b/nix/programs/neovim/default.nix
@@ -203,7 +203,7 @@ with lib;
         '';
 
         plugins = with pkgs.vimPlugins; [
-          # Deoendencies
+          # Dependencies
           vim-devicons
           nvim-web-devicons
           plenary-nvim
@@ -217,36 +217,43 @@ with lib;
 
               local colorscheme = require('base16-colorscheme')
               colorscheme.setup({
-                base00 = '#${config.theme.colors.base00}',
-                base01 = '#${config.theme.colors.base01}',
-                base02 = '#${config.theme.colors.base02}',
-                base03 = '#${config.theme.colors.base03}',
-                base04 = '#${config.theme.colors.base04}',
-                base05 = '#${config.theme.colors.base05}',
-                base06 = '#${config.theme.colors.base06}',
-                base07 = '#${config.theme.colors.base07}',
-                base08 = '#${config.theme.colors.base08}',
-                base09 = '#${config.theme.colors.base09}',
-                base0A = '#${config.theme.colors.base0A}',
-                base0B = '#${config.theme.colors.base0B}',
-                base0C = '#${config.theme.colors.base0C}',
-                base0D = '#${config.theme.colors.base0D}',
-                base0E = '#${config.theme.colors.base0E}',
-                base0F = '#${config.theme.colors.base0F}',
+                base00 = '#${config.theme.colors.bg}',
+                base01 = '#${config.theme.colors.surface.bg}',
+                base02 = '#${config.theme.colors.surface.bg}',
+                base03 = '#${config.theme.colors.bright.white}',
+                base04 = '#${config.theme.colors.bright.black}',
+                base05 = '#${config.theme.colors.fg}',
+                base06 = '#${config.theme.colors.bright.white}',
+                base07 = '#${config.theme.colors.hover.bg}',
+                base08 = '#${config.theme.colors.bright.red}',
+                base09 = '#${config.theme.colors.bright.yellow}',
+                base0A = '#${config.theme.colors.bright.yellow}',
+                base0B = '#${config.theme.colors.bright.green}',
+                base0C = '#${config.theme.colors.bright.cyan}',
+                base0D = '#${config.theme.colors.bright.blue}',
+                base0E = '#${config.theme.colors.bright.magenta}',
+                base0F = '#${config.theme.colors.normal.yellow}',
               })
 
               -- make transparent background
-              vim.api.nvim_set_hl(0, "Normal", { bg = "none" })
-              vim.api.nvim_set_hl(0, "NormalFloat", { bg = "none" })
-              vim.api.nvim_set_hl(0, 'EndOfBuffer', { bg = "none" })
+              local colors = {
+                -- Text
+                "Normal", "NormalNC", "NormalFloat",
+                -- Line Numbers
+                "LineNr", "EndOfBuffer", "SignColumn",
+                -- Floating
+                "FloatBorder",
+                -- Mode/Buffer Lines
+                "TabLine", "TabLineFill", "StatusLine",
+              };
+              for _,color in pairs(colors) do
+                vim.api.nvim_set_hl(0, color, { bg = "none" });
+              end
               -- identifiers should not be colored
-              vim.api.nvim_set_hl(0, "Identifier", { fg = "#${config.theme.colors.base05}" })
-              vim.api.nvim_set_hl(0, "TSVariable", { fg = "#${config.theme.colors.base05}" })
+              vim.api.nvim_set_hl(0, "Identifier", { fg = "#${config.theme.colors.fg}" })
+              vim.api.nvim_set_hl(0, "TSVariable", { fg = "#${config.theme.colors.fg}" })
               -- macro should be colored as a keyword
-              vim.api.nvim_set_hl(0, "TSFuncMacro", { fg = "#${config.theme.colors.base0E}" })
-              -- comments are too dark
-              vim.api.nvim_set_hl(0, "Comment", { fg = "#${config.theme.colors.base07}" })
-              vim.api.nvim_set_hl(0, "@comment", { link = "Comment" })
+              vim.api.nvim_set_hl(0, "TSFuncMacro", { fg = "#${config.theme.colors.bright.magenta}" })
             '';
           }
           # Mode line
@@ -254,9 +261,12 @@ with lib;
             plugin = lualine-nvim;
             type = "lua";
             config = ''
+              local lualine_theme = require('lualine.themes.base16')
+              lualine_theme.normal.c = { fg = "#${config.theme.colors.fg}" }
+
               require('lualine').setup {
                 options = {
-                  theme = 'base16',
+                  theme = lualine_theme,
                   icons_enabled = true,
                   globalstatus = true,
                 },
@@ -292,8 +302,8 @@ with lib;
                     open_win_config = {
                       relative = "editor",
                       border = "rounded",
-                      width = 60,
-                      height = 20,
+                      width = 80,
+                      height = 30,
                       row = 1,
                       col = 1,
                     },
diff --git a/nix/programs/waybar/style.nix b/nix/programs/waybar/style.nix
index 6104140..0b84514 100644
--- a/nix/programs/waybar/style.nix
+++ b/nix/programs/waybar/style.nix
@@ -2,14 +2,14 @@
 
 let
 
-    accentColor = "#${theme.colors.accent}";
-    textColor = "#${theme.colors.base05}";
-    baseColor = "#${theme.colors.base00}";
-    mantleColor = "#${theme.colors.base01}";
-    surfaceColor = "#${theme.colors.base03}";
-    greenColor = "#${theme.colors.base0B}";
-    yellowColor = "#${theme.colors.base0A}";
-    redColor = "#${theme.colors.base08}";
+    fg = "#${theme.colors.fg}";
+    bg = "#${theme.colors.bg}";
+    surface-fg = "#${theme.colors.surface.fg}";
+    surface-bg = "#${theme.colors.surface.bg}";
+    primary = "#${theme.colors.primary}";
+    success = "#${theme.colors.success}";
+    warning = "#${theme.colors.warning}";
+    error = "#${theme.colors.error}";
     fontSize = "${toString theme.font.size}px";
     outerGap = "${toString theme.outerGap}px";
     innerGap = "${toString theme.innerGap}px";
@@ -29,8 +29,8 @@ in
 window#waybar {
     font-family: "${theme.font.regular}", "${theme.font.icon}", "${theme.font.monospace}";
     font-size: ${fontSize};
-    color: ${textColor};
-    background-color: ${baseColor};
+    color: ${fg};
+    background-color: ${bg};
 }
 
 /** Workspaces */
@@ -43,18 +43,18 @@ window#waybar {
     border-radius: ${innerRadius};
     margin: 4px 2px;
     padding: 0px 7px;
-    background: ${surfaceColor};
-    color: ${textColor};
+    background: ${surface-bg};
+    color: ${surface-fg};
 }
 
 #workspaces button.focused,
 #workspaces button.active {
-    background: ${accentColor};
-    color: ${mantleColor};
+    background: ${primary};
+    color: ${bg};
 }
 
 #workspaces button.urgent {
-    background: ${redColor};
+    background: ${error};
 }
 
 /** Tray */
@@ -83,32 +83,32 @@ window#waybar {
 /** Battery */
 
 #battery.charging {
-    color: ${greenColor};
+    color: ${success};
 }
 
 #battery.warning:not(.charging) {
-    color: ${yellowColor};
+    color: ${warning};
 }
 
 #battery.critical:not(.charging) {
-    color: ${redColor};
+    color: ${error};
 }
 
 /** Wireplumber */
 
 #wireplumber.muted {
-    color: ${redColor};
+    color: ${error};
 }
 
 /** Network */
 
 #network.wifi,
 #network.ethernet {
-    color: ${greenColor};
+    color: ${success};
 }
 
 #network.disconnected {
-    color: ${redColor};
+    color: ${error};
 }
 
 ''
diff --git a/nix/programs/wofi/style.nix b/nix/programs/wofi/style.nix
index b73ae28..40fb861 100644
--- a/nix/programs/wofi/style.nix
+++ b/nix/programs/wofi/style.nix
@@ -2,10 +2,11 @@
 
 let
 
-  accentColor = "#${theme.colors.accent}";
-  textColor = "#${theme.colors.base05}";
-  baseColor = "#${theme.colors.base00}";
-  surfaceColor = "#${theme.colors.base02}";
+  fg = "#${theme.colors.fg}";
+  bg = "#${theme.colors.bg}";
+  surface-fg = "#${theme.colors.surface.fg}";
+  surface-bg = "#${theme.colors.surface.bg}";
+  primary = "#${theme.colors.primary}";
   fontSize = "${toString theme.font.size}px";
   outerGap = "${toString theme.outerGap}px";
   innerGap = "${toString theme.innerGap}px";
@@ -24,9 +25,9 @@ in
 /* Window */
 window {
    margin: 0px;
-   border: ${borderWidth} solid ${accentColor};
+   border: ${borderWidth} solid ${primary};
    border-radius: ${outerRadius};
-   background-color: ${baseColor};
+   background-color: ${bg};
 }
 
 /* Outer Box */
@@ -46,14 +47,14 @@ window {
   margin: ${innerGap};
   padding: ${innerGap};
   border: none;
-  color: ${textColor};
-  background-color: ${surfaceColor};
+  color: ${surface-fg};
+  background-color: ${surface-bg};
   border-radius: ${outerRadius};
 }
 
 #input:focus,
 #input:active {
-  border: ${borderWidth} solid ${accentColor};
+  border: ${borderWidth} solid ${primary};
   box-shadow: none;
   outline: none;
 }
@@ -63,17 +64,17 @@ window {
    margin: ${innerGap};
    padding: ${innerGap};
    border: none;
-   color: ${textColor};
+   color: ${fg};
 }
 
 /* Selected Entry */
 #entry:selected {
-  background-color: ${accentColor};
+  background-color: ${primary};
   border-radius: ${outerRadius};
 }
 
 #entry:selected #text {
-   color: ${baseColor};
+   color: ${bg};
 }
 
 ''
diff --git a/pkgs/astal/default.nix b/pkgs/astal/default.nix
index 73ada9c..dc19a19 100644
--- a/pkgs/astal/default.nix
+++ b/pkgs/astal/default.nix
@@ -2,6 +2,7 @@
   pkgs,
   inputs,
   system,
+  options,
   runCommand,
   dart-sass,
   ...
@@ -10,6 +11,7 @@
 let
   apkgs = inputs.astal.packages.${system};
   scss = "${dart-sass}/bin/sass";
+  theme = import ./theme.nix { inherit options; };
 in
 inputs.astal.lib.mkLuaPackage {
   pkgs = pkgs // {
@@ -20,6 +22,7 @@ inputs.astal.lib.mkLuaPackage {
     mkdir -p $out
     cp -r ${./src}/{*.lua,widget} $out/
     cp -r ${./src}/style/* .
+    echo '${theme}' > theme.scss
     cat theme.scss style.scss widget/* > main.scss
     ${scss} main.scss $out/main.css
   '';
diff --git a/pkgs/astal/src/style/style.scss b/pkgs/astal/src/style/style.scss
index 77c8b36..7be2b2f 100644
--- a/pkgs/astal/src/style/style.scss
+++ b/pkgs/astal/src/style/style.scss
@@ -8,22 +8,21 @@
 }
 
 window {
-    color: $text;
+    color: $fg;
     font-family: $font-name;
 }
 
 button {
-    color: $text;
+    color: $fg;
     background: $surface-bg;
 
     &:hover {
-        color: $hover;
         background: $hover-bg;
     }
 
     &.primary {
-        color: $primary;
-        background: $primary-bg;
+        color: $bg;
+        background: $primary;
     }
 }
 
@@ -33,7 +32,7 @@ menu {
     border-radius: $outer-radius;
 
     menuitem {
-        color: $text;
+        color: $fg;
         margin: $inner-gap $outer-gap;
         padding: $inner-gap;
         border-radius: $inner-radius;
@@ -44,7 +43,7 @@ menu {
         }
 
         &:disabled {
-            color: $subtext;
+            color: darken($fg, 5%);
         }
     }
 
diff --git a/pkgs/astal/src/style/theme.scss b/pkgs/astal/src/style/theme.scss
deleted file mode 100644
index 2af74f5..0000000
--- a/pkgs/astal/src/style/theme.scss
+++ /dev/null
@@ -1,32 +0,0 @@
-
-$text: #cdd6f4;
-$subtext: #a6adc8;
-
-$bg: #1e1e2e;
-$surface-bg: #313244;
-
-$hover: $text;
-$hover-bg: #6c7086;
-
-$primary: $bg;
-$primary-bg: #89b4fa;
-
-$success: #a6e3a1;
-$success-bg: $bg;
-
-$warning: #f9e2af;
-$warning-bg: $bg;
-
-$error: #f38ba8;
-$error-bg: $bg;
-
-$border: 2px;
-
-$inner-radius: 4px;
-$outer-radius: 8px;
-
-$inner-gap: 3px;
-$outer-gap: 10px;
-
-$font-name: "JetBrains Mono", "monospace";
-$font-size: 14px;
diff --git a/pkgs/astal/theme.nix b/pkgs/astal/theme.nix
new file mode 100644
index 0000000..1efd1fe
--- /dev/null
+++ b/pkgs/astal/theme.nix
@@ -0,0 +1,33 @@
+{
+  options,
+  ...
+}:
+
+''
+
+$fg: #${options.theme.colors.fg};
+$bg: #${options.theme.colors.bg};
+
+$surface-fg: #${options.theme.colors.surface.fg};
+$surface-bg: #${options.theme.colors.surface.bg};
+
+$hover-fg: #${options.theme.colors.hover.fg};
+$hover-bg: #${options.theme.colors.hover.bg};
+
+$primary: #${options.theme.colors.primary};
+$success: #${options.theme.colors.success};
+$warning: #${options.theme.colors.warning};
+$error: #${options.theme.colors.error};
+
+$border: ${toString options.theme.borderWidth}px;
+
+$inner-radius: ${toString options.theme.innerRadius}px;
+$outer-radius: ${toString options.theme.outerRadius}px;
+
+$inner-gap: ${toString options.theme.innerGap}px;
+$outer-gap: ${toString options.theme.outerGap}px;
+
+$font-name: "${options.theme.font.regular}", "${options.theme.font.monospace}";
+$font-size: ${toString options.theme.font.size}px;
+
+''
diff --git a/pkgs/default.nix b/pkgs/default.nix
index 58e8f05..18b7c50 100644
--- a/pkgs/default.nix
+++ b/pkgs/default.nix
@@ -1,10 +1,11 @@
-{ pkgs, inputs, system, ... }:
+{ pkgs, inputs, system, options, ... }:
 
 let
 	build = (path: pkgs.callPackage path {
 		inherit pkgs;
 		inherit inputs;
 		inherit system;
+		inherit options;
 	});
 in
 {