Add rofi theme

Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>

hosts/common/configs/user/console/ncspot/theme.toml

@@ -6,7 +6,7 @@ library_tabs = [ "albums", "artists", "playlists", "browse" ]
 [theme]
 background = "{{colors.surface.default.hex}}"
 primary = "{{colors.on_surface.default.hex}}"
-secondary = "{{colors.surface.default.hex}}"
+secondary = "{{colors.inverse_surface.default.hex}}"
 title = "{{colors.primary.default.hex}}"
 playing = "{{colors.primary.default.hex}}"
 playing_bg = "{{colors.surface.default.hex}}"

hosts/common/configs/user/gui/astal/config/widget/components/Launcher.tsx

@@ -5,7 +5,7 @@ export default () => (
     className="launcher"
     onClickRelease={() =>
       execAsync(
-        'bash -c "rofi -cache-dir $XDG_CACHE_HOME/rofi -show drun -run-command \"uwsm app -- {cmd}\""',
+        'rofi -modes drun -show drun -run-command \"uwsm app -- {cmd}\"',
       )
     }
   >

hosts/common/configs/user/gui/clipbook/rofi.nix

@@ -21,5 +21,5 @@ in
 pkgs.writeShellApplication {
   name = "clipbook-rofi";
   runtimeInputs = [ rofi ];
-  text = "rofi -modi \"copy:${copy}\" -show copy";
+  text = "rofi -modes \"clipbook-copy:${copy}\" -show clipbook-copy";
 }

hosts/common/configs/user/gui/cliphist/rofi.nix

@@ -27,5 +27,5 @@ in
 pkgs.writeShellApplication {
   name = "cliphist-rofi";
   runtimeInputs = [ rofi ];
-  text = "rofi -modi \"copy:${copy},delete:${delete}\" -show copy";
+  text = "rofi -modes \"cliphist-copy:${copy},cliphist-delete:${delete}\" -show cliphist-copy";
 }

hosts/common/configs/user/gui/emoji/default.nix

@@ -17,7 +17,7 @@ in
 
     wayland.windowManager.hyprland.settings.bind = [
       # Super + Shift + :
-      "$mod_Shift, code:47, exec, ${lib.meta.getExe hmConfig.programs.rofi.finalPackage} -cache-dir ${home}/.cache/rofi -modi emoji -show emoji"
+      "$mod_Shift, code:47, exec, ${lib.meta.getExe hmConfig.programs.rofi.finalPackage} -cache-dir ${home}/.cache/rofi -modes emoji -show emoji"
     ];
   };
 }

hosts/common/configs/user/gui/rofi/default.nix

@@ -18,11 +18,14 @@ in
     programs.rofi = {
       enable = true;
       package = pkgs.rofi-wayland;
-      font = builtins.head hmConfig.theme.font.monospace.names;
     };
 
+    home.file.${hmConfig.programs.rofi.configPath}.enable = false;
+    theme.template.".config/rofi/config.rasi".source = ./theme.rasi;
+
     wayland.windowManager.hyprland.settings.bind = [
-      "$mod, r, exec, ${lib.meta.getExe hmConfig.programs.rofi.finalPackage} -cache-dir ${home}/.cache/rofi -modi drun,window -show drun -run-command \"uwsm app -- {cmd}\""
+      "$mod, r, exec, ${lib.meta.getExe hmConfig.programs.rofi.finalPackage} -modes drun -show drun -run-command \"uwsm app -- {cmd}\""
+      "Alt, Tab, exec, ${lib.meta.getExe hmConfig.programs.rofi.finalPackage} -modes window -show window"
     ];
   };
 }

hosts/common/configs/user/gui/rofi/theme.rasi

@@ -0,0 +1,288 @@
+configuration {
+    cache-dir:                  "~/.cache/rofi";
+
+    show-icons:                 false;
+    display-drun:               "";
+    display-run:                "";
+    display-window:             "";
+    display-cliphist-copy:      "󰅇";
+    display-cliphist-delete:    "󱘚";
+    display-clipbook-copy:      "";
+    display-emoji:              "󰞅";
+
+    drun-display-format:        "{name} [<span weight='light' size='small'><i>({generic})</i></span>]";
+    window-format:              "{w} · {c} · {t}";
+}
+
+* {
+    background:                  {{colors.surface.default.hex}};
+    background-alt:              {{colors.surface_container.default.hex}};
+    foreground:                  {{colors.on_surface.default.hex}};
+    foreground-inactive:         {{colors.outline_variant.default.hex}};
+    selected:                    {{colors.primary.default.hex}};
+    active:                      {{colors.secondary.default.hex}};
+    urgent:                      {{colors.tertiary.default.hex}};
+}
+
+* {
+    font: "{{custom.font_monospace}} Mono {{custom.font_size}}";
+}
+
+* {
+    border-color:                var(selected);
+    handle-color:                var(selected);
+    background-color:            var(background);
+    foreground-color:            var(foreground);
+    alternate-background:        var(background-alt);
+    normal-background:           var(background);
+    normal-foreground:           var(foreground);
+    urgent-background:           var(urgent);
+    urgent-foreground:           var(background);
+    active-background:           var(active);
+    active-foreground:           var(background);
+    selected-normal-background:  var(selected);
+    selected-normal-foreground:  var(background);
+    selected-urgent-background:  var(active);
+    selected-urgent-foreground:  var(background);
+    selected-active-background:  var(urgent);
+    selected-active-foreground:  var(background);
+    alternate-normal-background: var(background);
+    alternate-normal-foreground: var(foreground);
+    alternate-urgent-background: var(urgent);
+    alternate-urgent-foreground: var(background);
+    alternate-active-background: var(active);
+    alternate-active-foreground: var(background);
+}
+
+window {
+    transparency:                "real";
+    location:                    center;
+    anchor:                      center;
+    fullscreen:                  false;
+    width:                       600px;
+    x-offset:                    0px;
+    y-offset:                    0px;
+
+    enabled:                     true;
+    margin:                      0px;
+    padding:                     0px;
+    border:                      1px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    cursor:                      "default";
+    background-color:            @background-color;
+}
+
+mainbox {
+    enabled:                     true;
+    spacing:                     5px;
+    margin:                      0px;
+    padding:                     5px;
+    border:                      0px solid;
+    border-radius:               0px 0px 0px 0px;
+    border-color:                @border-color;
+    background-color:            transparent;
+    children:                    [ "inputbar", "listview" ];
+}
+
+inputbar {
+    enabled:                     true;
+    spacing:                     10px;
+    margin:                      0px;
+    padding:                     5px;
+    border:                      0px 0px 1px dash 0px;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            @background-color;
+    text-color:                  @foreground-color;
+    children:                    [ "prompt", "entry" ];
+}
+
+prompt {
+    enabled:                     true;
+    background-color:            inherit;
+    text-color:                  inherit;
+}
+
+textbox-prompt-colon {
+    enabled:                     true;
+    expand:                      false;
+    str:                         "::";
+    background-color:            inherit;
+    text-color:                  inherit;
+}
+
+entry {
+    enabled:                     true;
+    background-color:            inherit;
+    text-color:                  inherit;
+    cursor:                      text;
+    placeholder:                 "Search...";
+    placeholder-color:           @foreground-inactive;
+}
+
+listview {
+    enabled:                     true;
+    columns:                     1;
+    lines:                       12;
+    cycle:                       true;
+    dynamic:                     true;
+    scrollbar:                   false;
+    layout:                      vertical;
+    reverse:                     false;
+    fixed-height:                true;
+    fixed-columns:               true;
+
+    spacing:                     0px;
+    margin:                      0px;
+    padding:                     0px;
+    border:                      0px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            transparent;
+    text-color:                  @foreground-color;
+    cursor:                      "default";
+}
+
+scrollbar {
+    handle-width:                5px ;
+    handle-color:                @handle-color;
+    border-radius:               0px;
+    background-color:            @alternate-background;
+}
+
+element {
+    enabled:                     true;
+    spacing:                     10px;
+    margin:                      0px;
+    padding:                     5px;
+    border:                      0px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            transparent;
+    text-color:                  @foreground-color;
+    cursor:                      pointer;
+}
+
+element normal.normal {
+    background-color:            var(normal-background);
+    text-color:                  var(normal-foreground);
+}
+
+element normal.urgent {
+    background-color:            var(urgent-background);
+    text-color:                  var(urgent-foreground);
+}
+
+element normal.active {
+    background-color:            var(active-background);
+    text-color:                  var(active-foreground);
+}
+
+element selected.normal {
+    background-color:            var(selected-normal-background);
+    text-color:                  var(selected-normal-foreground);
+}
+
+element selected.urgent {
+    background-color:            var(selected-urgent-background);
+    text-color:                  var(selected-urgent-foreground);
+}
+
+element selected.active {
+    background-color:            var(selected-active-background);
+    text-color:                  var(selected-active-foreground);
+}
+
+element alternate.normal {
+    background-color:            var(alternate-normal-background);
+    text-color:                  var(alternate-normal-foreground);
+}
+
+element alternate.urgent {
+    background-color:            var(alternate-urgent-background);
+    text-color:                  var(alternate-urgent-foreground);
+}
+
+element alternate.active {
+    background-color:            var(alternate-active-background);
+    text-color:                  var(alternate-active-foreground);
+}
+
+element-icon {
+    background-color:            transparent;
+    text-color:                  inherit;
+    size:                        24px;
+    cursor:                      inherit;
+}
+
+element-text {
+    background-color:            transparent;
+    text-color:                  inherit;
+    highlight:                   inherit;
+    cursor:                      inherit;
+    vertical-align:              0.5;
+    horizontal-align:            0.0;
+}
+
+mode-switcher {
+    enabled:                     true;
+    spacing:                     10px;
+    margin:                      0px;
+    padding:                     0px;
+    border:                      0px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            transparent;
+    text-color:                  @foreground-color;
+}
+
+button {
+    padding:                     10px;
+    border:                      0px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            @alternate-background;
+    text-color:                  inherit;
+    cursor:                      pointer;
+}
+
+button selected {
+    background-color:            var(selected-normal-background);
+    text-color:                  var(selected-normal-foreground);
+}
+
+message {
+    enabled:                     true;
+    margin:                      0px;
+    padding:                     0px;
+    border:                      0px solid;
+    border-radius:               0px 0px 0px 0px;
+    border-color:                @border-color;
+    background-color:            transparent;
+    text-color:                  @foreground-color;
+}
+
+textbox {
+    padding:                     5px;
+    border:                      0px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            @alternate-background;
+    text-color:                  @foreground-color;
+    vertical-align:              0.5;
+    horizontal-align:            0.0;
+    highlight:                   none;
+    placeholder-color:           @foreground-color;
+    blink:                       true;
+    markup:                      true;
+}
+
+error-message {
+    padding:                     5px;
+    border:                      0px solid;
+    border-radius:               0px;
+    border-color:                @border-color;
+    background-color:            @background-color;
+    text-color:                  @foreground-color;
+}