From 81de262bf170ce4152950402e17eba1453a3ebfe Mon Sep 17 00:00:00 2001 From: Ivan Date: Wed, 24 Jan 2024 15:59:08 +0300 Subject: [PATCH] rofi: allow theme customizability (#230) --- modules/rofi/hm.nix | 143 +++++++++++++++++++++++++++++---- modules/rofi/template.mustache | 115 -------------------------- 2 files changed, 128 insertions(+), 130 deletions(-) delete mode 100644 modules/rofi/template.mustache diff --git a/modules/rofi/hm.nix b/modules/rofi/hm.nix index a6d8141c..a71fdd36 100644 --- a/modules/rofi/hm.nix +++ b/modules/rofi/hm.nix @@ -1,22 +1,20 @@ -{ pkgs, config, lib, ... }: +{ config, lib, ... }: with config.stylix.fonts; let + inherit (config.lib.formats.rasi) mkLiteral; + mkRgba = opacity: color: + let + c = config.lib.stylix.colors; + r = c."${color}-rgb-r"; + g = c."${color}-rgb-g"; + b = c."${color}-rgb-b"; + in + mkLiteral + "rgba ( ${r}, ${g}, ${b}, ${opacity} % )"; + mkRgb = mkRgba "100"; rofiOpacity = builtins.toString (builtins.ceil (config.stylix.opacity.popups * 100)); - finalString = '' - * { background: rgba ( {{base00-rgb-r}}, {{base00-rgb-g}}, {{base00-rgb-b}}, ${rofiOpacity} % ); - lightbg: rgba ( {{base01-rgb-r}}, {{base01-rgb-g}}, {{base01-rgb-b}}, ${rofiOpacity} % ); - red: rgba ( {{base08-rgb-r}}, {{base08-rgb-g}}, {{base08-rgb-b}}, ${rofiOpacity} % ); - blue: rgba ( {{base0D-rgb-r}}, {{base0D-rgb-g}}, {{base0D-rgb-b}}, ${rofiOpacity} % ); - lightfg: rgba ( {{base06-rgb-r}}, {{base06-rgb-g}}, {{base06-rgb-b}}, ${rofiOpacity} % ); - foreground: rgba ( {{base05-rgb-r}}, {{base05-rgb-g}}, {{base05-rgb-b}}, ${rofiOpacity} % ); - } - '' + builtins.toString (builtins.readFile ./template.mustache); - finalFile = config.lib.stylix.colors { - template = finalString; - extension = ".rasi"; - }; in { options.stylix.targets.rofi.enable = @@ -25,7 +23,122 @@ in config = lib.mkIf config.stylix.targets.rofi.enable { programs.rofi = { font = "${monospace.name} ${toString sizes.popups}"; - theme = finalFile; + theme = { + "*" = { + background = mkRgba rofiOpacity "base00"; + lightbg = mkRgba rofiOpacity "base01"; + red = mkRgba rofiOpacity "base08"; + blue = mkRgba rofiOpacity "base0D"; + lightfg = mkRgba rofiOpacity "base06"; + foreground = mkRgba rofiOpacity "base05"; + + background-color = mkRgb "base00"; + separatorcolor = mkLiteral "@foreground"; + border-color = mkLiteral "@foreground"; + selected-normal-foreground = mkLiteral "@lightbg"; + selected-normal-background = mkLiteral "@lightfg"; + selected-active-foreground = mkLiteral "@background"; + selected-active-background = mkLiteral "@blue"; + selected-urgent-foreground = mkLiteral "@background"; + selected-urgent-background = mkLiteral "@red"; + normal-foreground = mkLiteral "@foreground"; + normal-background = mkLiteral "@background"; + active-foreground = mkLiteral "@blue"; + active-background = mkLiteral "@background"; + urgent-foreground = mkLiteral "@red"; + urgent-background = mkLiteral "@background"; + alternate-normal-foreground = mkLiteral "@foreground"; + alternate-normal-background = mkLiteral "@lightbg"; + alternate-active-foreground = mkLiteral "@blue"; + alternate-active-background = mkLiteral "@lightbg"; + alternate-urgent-foreground = mkLiteral "@red"; + alternate-urgent-background = mkLiteral "@lightbg"; + + # Text Colors + base-text = mkRgb "base05"; + selected-normal-text = mkRgb "base01"; + selected-active-text = mkRgb "base00"; + selected-urgent-text = mkRgb "base00"; + normal-text = mkRgb "base05"; + active-text = mkRgb "base0D"; + urgent-text = mkRgb "base08"; + alternate-normal-text = mkRgb "base05"; + alternate-active-text = mkRgb "base0D"; + alternate-urgent-text = mkRgb "base08"; + }; + + window.background-color = mkLiteral "@background"; + + message.border-color = mkLiteral "@separatorcolor"; + + textbox.text-color = mkLiteral "@base-text"; + + listview.border-color = mkLiteral "@separatorcolor"; + + element-text = { + background-color = mkLiteral "inherit"; + text-color = mkLiteral "inherit"; + }; + + element-icon = { + background-color = mkLiteral "inherit"; + text-color = mkLiteral "inherit"; + }; + + "element normal.normal" = { + background-color = mkLiteral "@normal-background"; + text-color = mkLiteral "@normal-text"; + }; + "element normal.urgent" = { + background-color = mkLiteral "@urgent-background"; + text-color = mkLiteral "@urgent-text"; + }; + "element normal.active" = { + background-color = mkLiteral "@active-background"; + text-color = mkLiteral "@active-text"; + }; + + "element selected.normal" = { + background-color = mkLiteral "@selected-normal-background"; + text-color = mkLiteral "@selected-normal-text"; + }; + "element selected.urgent" = { + background-color = mkLiteral "@selected-urgent-background"; + text-color = mkLiteral "@selected-urgent-text"; + }; + "element selected.active" = { + background-color = mkLiteral "@selected-active-background"; + text-color = mkLiteral "@selected-active-text"; + }; + + "element alternate.normal" = { + background-color = mkLiteral "@alternate-normal-background"; + text-color = mkLiteral "@alternate-normal-text"; + }; + "element alternate.urgent" = { + background-color = mkLiteral "@alternate-urgent-background"; + text-color = mkLiteral "@alternate-urgent-text"; + }; + "element alternate.active" = { + background-color = mkLiteral "@alternate-active-background"; + text-color = mkLiteral "@alternate-active-text"; + }; + + scrollbar.handle-color = mkLiteral "@normal-foreground"; + sidebar.border-color = mkLiteral "@separatorcolor"; + button.text-color = mkLiteral "@normal-text"; + "button selected" = { + background-color = mkLiteral "@selected-normal-background"; + text-color = mkLiteral "@selected-normal-text"; + }; + + inputbar.text-color = mkLiteral "@normal-text"; + case-indicator.text-color = mkLiteral "@normal-text"; + entry.text-color = mkLiteral "@normal-text"; + prompt.text-color = mkLiteral "@normal-text"; + + textbox-prompt-colon.text-color = mkLiteral "inherit"; + }; }; }; } diff --git a/modules/rofi/template.mustache b/modules/rofi/template.mustache deleted file mode 100644 index 9ddeb2fc..00000000 --- a/modules/rofi/template.mustache +++ /dev/null @@ -1,115 +0,0 @@ -* { - background-color: rgba ( {{base00-rgb-r}}, {{base00-rgb-g}}, {{base00-rgb-b}}, 0 % ); - separatorcolor: @foreground; - border-color: @foreground; - selected-normal-foreground: @lightbg; - selected-normal-background: @lightfg; - selected-active-foreground: @background; - selected-active-background: @blue; - selected-urgent-foreground: @background; - selected-urgent-background: @red; - normal-foreground: @foreground; - normal-background: @background; - active-foreground: @blue; - active-background: @background; - urgent-foreground: @red; - urgent-background: @background; - alternate-normal-foreground: @foreground; - alternate-normal-background: @lightbg; - alternate-active-foreground: @blue; - alternate-active-background: @lightbg; - alternate-urgent-foreground: @red; - alternate-urgent-background: @lightbg; - - /* Text Colors */ - base-text: rgba ( {{base05-rgb-r}}, {{base05-rgb-g}}, {{base05-rgb-b}}, 100 % ); - selected-normal-text: rgba ( {{base01-rgb-r}}, {{base01-rgb-g}}, {{base01-rgb-b}}, 100 % ); - selected-active-text: rgba ( {{base00-rgb-r}}, {{base00-rgb-g}}, {{base00-rgb-b}}, 100 % ); - selected-urgent-text: rgba ( {{base00-rgb-r}}, {{base00-rgb-g}}, {{base00-rgb-b}}, 100 % ); - normal-text: rgba ( {{base05-rgb-r}}, {{base05-rgb-g}}, {{base05-rgb-b}}, 100 % ); - active-text: rgba ( {{base0D-rgb-r}}, {{base0D-rgb-g}}, {{base0D-rgb-b}}, 100 % ); - urgent-text: rgba ( {{base08-rgb-r}}, {{base08-rgb-g}}, {{base08-rgb-b}}, 100 % ); - alternate-normal-text: rgba ( {{base05-rgb-r}}, {{base05-rgb-g}}, {{base05-rgb-b}}, 100 % ); - alternate-active-text: rgba ( {{base0D-rgb-r}}, {{base0D-rgb-g}}, {{base0D-rgb-b}}, 100 % ); - alternate-urgent-text: rgba ( {{base08-rgb-r}}, {{base08-rgb-g}}, {{base08-rgb-b}}, 100 % ); -} -window { - background-color: @background; -} -message { - border-color: @separatorcolor; -} -textbox { - text-color: @base-text; -} -listview { - border-color: @separatorcolor; -} -element-text, element-icon { - background-color: inherit; - text-color: inherit; -} -element normal.normal { - background-color: @normal-background; - text-color: @normal-text; -} -element normal.urgent { - background-color: @urgent-background; - text-color: @urgent-text; -} -element normal.active { - background-color: @active-background; - text-color: @active-text; -} -element selected.normal { - background-color: @selected-normal-background; - text-color: @selected-normal-text; -} -element selected.urgent { - background-color: @selected-urgent-background; - text-color: @selected-urgent-text; -} -element selected.active { - background-color: @selected-active-background; - text-color: @selected-active-text; -} -element alternate.normal { - background-color: @alternate-normal-background; - text-color: @alternate-normal-text; -} -element alternate.urgent { - background-color: @alternate-urgent-background; - text-color: @alternate-urgent-text; -} -element alternate.active { - background-color: @alternate-active-background; - text-color: @alternate-active-text; -} -scrollbar { - handle-color: @normal-foreground; -} -sidebar { - border-color: @separatorcolor; -} -button { - text-color: @normal-text; -} -button selected { - background-color: @selected-normal-background; - text-color: @selected-normal-text; -} -inputbar { - text-color: @normal-text; -} -case-indicator { - text-color: @normal-text; -} -entry { - text-color: @normal-text; -} -prompt { - text-color: @normal-text; -} -textbox-prompt-colon { - text-color: inherit; -}