Simplify theming with color aliases

[merikan]

Is your feature request related to a problem? Please describe. To more easily manage several different themes/layouts for zjstatus statusbar, it would be great if you could manage them externally and then specify which one you want to use.

Describe the solution you'd like I have several themes for zjstatus and can, when I load zjstatus, specify which theme to use.

The solution could be like this: read config file gruvbox-dark.kdl, relative to Zellij config.kdl

zjstatus location="file:~/.local/share/zellij/plugins/zjstatus.wasm" {
    config_file "themes/zjstatus/gruvbox-dark.kdl"
}

read config file current.kdl, a symlink to catppuccin-mocha.kdl, relative to Zellij config.kdl file.

zjstatus location="file:~/.local/share/zellij/plugins/zjstatus.wasm" {
    config_file "themes/zjstatus/current.kdl"
}

Folder structure

├── config.kdl
└── themes
    └── zjstatus
        ├── catppuccin-frappe.kdl
        ├── catppuccin-latte.kdl
        ├── catppuccin-macchiato.kdl
        ├── catppuccin-mocha.kdl
        ├── current.kdl -> catppuccin-mocha.kdl
        ├── gruvbox-dark.kdl
        └── gruvbox-light.kdl

Additional context The config file could be loaded from (1)absolute path or (2) relative path to the config.kdl file used. It should support symlinks when loading the config file.

And a bonus when switching between themes. When Zellij resurrection serializes the session it resolves all configuration properties for zjstatus. This means that you can not easily change to another theme without changing the layout file in the resurrection folder

session_layout.kdl file in resurrection folder

zjstatus location="file:~/.local/share/zellij/plugins/zjstatus.wasm" {
    format_left   "#[bg=#313244,fg=#eba0ac]#[bg=#eba0ac,fg=#181926,bold] {session} {mode}#[bg=#282828] {tabs}"
    format_center "{notifications}"
    <snip>
}

If you could load the configuration from an external file that is symlinked, it would be enough to redicrect the symlink. (1)kill the session, (2)redirect the symlink and then (3)attach to the session (resurrected), to change the theme.

session_layout.kdl file in resurrection folder

zjstatus location="file:~/.local/share/zellij/plugins/zjstatus.wasm" {
    config_file "themes/zjstatus/current.kdl"
}

[dj95]

Hi, thanks a lot for the feature request! I really like the idea and really appreciate your detailed request.

Unfortunately, this is technically not possible to implement. Zellij plugins are executed in a WASM sandbox, that restricts file access. There are some temporary directories and a mount to the directory in which zellij is started. But unfortunately it's not possible to access arbitrary files on the disk.

Since there is currently a theming proposal in the works on zellijs side, I don't really want to build my own theme spec, as they might interfere with each other and would just cause confusion.

What do you think about customizable aliases for colors? This way you could specify colors by name and swap their colorcode, such that only smaller changes are required. Together with plugin aliases, this could lower the effort a lot

[merikan]

@dj95 you're absolutely right, I totally forgot that it operates in a web assembly sandbox 🙈

Yes I saw the proposal about using themes and I agree with you that it is better to wait and then use it, when ever it is implemented.

I like the idea of ​​customizable aliases. Then we could declare a "variable" early and use it later in one or more places, kind of like we do with commands. Is that what you mean?

It would really make it easier to maintain and restyle if it was possibility to define string variables that can be used in the configuration itself. Such variable could then contain the color code, glyphs, or a combination of these (styling block). When I was working with my configurations, I tried to solve it with KDL, although KDL is a nice format but lacks define and reuse variables, as YAML does.

Example before

format_left   "#[bg=239,fg=248] {session} {mode}#[bg=237]{tabs}"

after

// gruvbox dark
color_bg  "235"
color_bg1 "237"
color_bg2 "239"
color_fg3 "248"
format_left   "#[bg={color_b2},fg={color_fg3}] {session} {mode}#[bg={color_bg1}]{tabs}"

What do you think, is it possible?

[dj95]

That's exactly what I mean. Except that the aliases will only work for colors because otherwise the renderer won't work.

I'll give it a shot when I have some time and try to implement color aliases. This way you can at least swap colors easier.

[merikan]

it sounds great. Take your time, no rush.

[dj95]

Thanks for your suggestion! I took a similar syntax you proposed.

Colors are defined with

color_red    "#ff0000"
color_blue   "blue"
color_bg     "#181825"

like all colors before. Also the ANSI names are possible.

Later on you can use them by their name. E.g.

format_left               "{mode}#[fg={blue},bg={bg},bold] {session}"

Hope this helps you to simplify the theming! Happy hacking! 🚀

---

Edit: I really really enjoyed to tinker around with them while testing the aliases :D so I feel it was some missing important piece for more/better usability!

[dj95]

Before release, I will switch the syntax from {blue} to $blue. While further playing around it gets otherwise confusing with the widgets.

Sorry for the confusion