diff --git a/README.md b/README.md
index 326e041..9266476 100644
--- a/README.md
+++ b/README.md
@@ -1,45 +1,95 @@
-# HyprPanel wallbash template
+# HyprPanel Wallbash Template



+## Wallbash Template for HyprPanel
-### Wallbash Template for HyprPanel
+This template is designed for use with the latest version of [HyprPanel](https://hyprpanel.com/) (Astal-based).
-This template is designed for use with HyprPanel. For more information, visit [HyprPanel](https://hyprpanel.com/).
+> **NOTE:** This is not a standalone package. Ensure you have HyDE installed and a working HyprPanel setup.
+> **COMPATIBILITY:** This template has been updated to support the new `astal` backend of HyprPanel. If you are using an older version of HyprPanel based on `ags`, you might need to use an older version of this repository.
-> **NOTE:** This is not a standalone package. Ensure you have HyDe installed and a working HyprPanel setup.
+## Available Templates (Default vs Split)
+
+Because of how HyprPanel handles button styling, this repository provides two different `.dcol` files. You must choose **only one** based on your HyprPanel settings:
+
+* **`hyprpanel.dcol`**: Designed for the regular/default bar style.
+
+
+* **`hyprpanel_split.dcol`**: Specifically adapted for the split button style (where the icon sits on top of a background).
+
+
+ * *To use this template, you must enable it in HyprPanel:* Go to **Settings -> Bar -> Button Style -> change from `default` to `split`**.
+
+
## Usage
-Add the file [/hyprpanel.dcol](https://github.com/HyDE-Project/HyprPanel/blob/3f20c8922d7c3547688a2b16eb74846170a9f224/hyprpanel.dcol) to either `~/.config/hyde/wallbash/Wall-Ways` or `~/.config/hyde/wallbash/Wall-Dcol`.
+Download your desired template (`hyprpanel.dcol` **OR** `hyprpanel_split.dcol`) and place it in either `~/.config/hyde/wallbash/always/` or `~/.config/hyde/wallbash/theme/`.
+
+### Directory Differences
-### Difference Between Wall-Ways and Wall-Dcol
+According to the HyDE documentation, the directory you choose changes when the template is executed:
-- **Wall-Ways**: This file is always used regardless of the theme mode or wallbash mode.
-- **Wall-Dcol**: This file attempts to find the theme template (if in theme mode) and falls back to using the dominant color of the wallpapers if no template is available.
+- **`always/`**: Templates placed here are executed during a **Theme switch**, **Wallpaper switch**, or **Mode switch**.
+- **`theme/`**: Templates placed here are executed **only** during a **Theme switch** or **Mode switch**.
### Using This Template for Themes
1. **Header Line**:
+ The `.dcol` file must start with the following target and command (header line) to properly trigger the Astal theme update:
```sh
- ${cacheDir}/landing/wallbash-hyprpanel.json | ags -r "useTheme('${cacheDir}/landing/wallbash-hyprpanel.json')"
+ ${cacheDir}/landing/wallbash-hyprpanel.json | astal -i hyprpanel useTheme ${cacheDir}/landing/wallbash-hyprpanel.json
```
- This command sets the theme using the cached wallbash-generated `.json` file.
- `$cacheDir` is the path to `~/.cache/hyde/`.
+ This generates the `wallbash-hyprpanel.json` file in your cache and immediately pipes the command to Astal to apply the theme in HyprPanel.
-2. **Wallbash Generation**:
+2. **Manual/Optional Command**:
+ If you need to trigger the theme reload manually via terminal, you can run:
```sh
- ${cacheDir}/landing/wallbash-hyprpanel.json
+ astal -i hyprpanel useTheme ~/.cache/hyde/landing/wallbash-hyprpanel.json
```
- This command generates the wallbash `.json` file.
-3. **Optional Command**:
+## Matugen Compatibility
+
+By default, this template is fully compatible as long as you **do not use Matugen**.
+
+If Matugen is enabled, it forces its own color overrides onto the bar's theme, which conflicts with this Wallbash template. If you still want to use both together, you must set up a custom workaround to trigger Matugen correctly:
+
+1. **Create a script** (e.g., `hyprpanel_matugen.sh`) in your `~/.config/hyde/wallbash/scripts/` directory. This script must automatically inject the new wallpaper path into HyprPanel's `config.json` (specifically editing the `"wallpaper.image": "/path/to/your/image"` line).
+2. **Create a trigger `.dcol` file** in your `~/.config/hyde/wallbash/always/` directory. This file acts as a dummy to call your script every time the wallpaper changes. The file should look like this:
```sh
- ags -r "useTheme('${cacheDir}/landing/wallbash-hyprpanel.json')"
+ /tmp/hyprpanel_trigger.txt|bash $WALLBASH_SCRIPTS/hyprpanel_matugen.sh
+ # Dummy file to trigger Matugen config update on wallpaper change
```
- This command uses the cached wallbash-generated `.json` file to set the theme.
+3. By dynamically changing this image path with the newly applied Wallbash wallpaper, you force Matugen to trigger and overwrite the colors correctly, allowing both systems to work side by side.
+
+
+💡 Click here for an example of the Bash script
+
+You can use `jq` to safely edit the `config.json` file, and `readlink` to get the current wallpaper applied by HyDE.
+
+**`~/.config/hyde/wallbash/scripts/hyprpanel_matugen.sh`**:
+```bash
+#!/bin/bash
+
+# Path to your HyprPanel config
+CONFIG_FILE="$HOME/.config/hyprpanel/config.json"
+
+# Get the current wallpaper set by HyDE/Wallbash
+CURRENT_WALL=$(readlink -f ~/.cache/hyde/wall.set)
+
+# Use jq to update the wallpaper.image line safely
+if command -v jq &> /dev/null && [ -f "$CONFIG_FILE" ]; then
+ jq --arg wp "$CURRENT_WALL" '."wallpaper.image" = $wp' "$CONFIG_FILE" > "${CONFIG_FILE}.tmp" && mv "${CONFIG_FILE}.tmp" "$CONFIG_FILE"
+else
+ echo "Error: jq is not installed or config.json not found."
+fi
+```
+*(Make sure to make the script executable with `chmod +x ~/.config/hyde/wallbash/scripts/hyprpanel_matugen.sh`)*
+
+
## TODO
- Dedicated installation
@@ -48,7 +98,6 @@ Add the file [/hyprpanel.dcol](https://github.com/HyDE-Project/HyprPanel/blob/3f
- Enhance the template by adding more contrast to some elements.
- Avoid making breaking changes.
-- Make readme comprehensive
- Feel free to open a PR for color corrections!
-[](https://ko-fi.com/A)
+[](https://ko-fi.com/A)
\ No newline at end of file
diff --git a/hyprpanel.dcol b/hyprpanel.dcol
index 0a0bab7..5d1ae4e 100644
--- a/hyprpanel.dcol
+++ b/hyprpanel.dcol
@@ -1,265 +1,400 @@
-${cacheDir}/landing/wallbash-hyprpanel.json | ags -r "useTheme('${cacheDir}/landing/wallbash-hyprpanel.json')"
-{
- "theme.bar.menus.background": "#",
+${cacheDir}/landing/wallbash-hyprpanel.json | astal -i hyprpanel useTheme ${cacheDir}/landing/wallbash-hyprpanel.json
+{
+ "cursor": "#",
+ "number": "#",
+ "parens": "#",
+ "result": "#",
+ "comment": "#",
+ "matched": "#",
+ "function": "#",
+ "operator": "#",
+ "variable": "#",
+ "scrollbar": "#",
+ "separator": "#",
+ "background": "#",
+ "editorbackground": "#",
"theme.bar.background": "#",
- "theme.bar.buttons.media.icon": "#",
- "theme.bar.buttons.media.text": "#",
- "theme.bar.buttons.icon": "#",
- "theme.bar.buttons.text": "#",
- "theme.bar.buttons.hover": "#",
- "theme.bar.buttons.background": "#",
- "theme.bar.menus.text": "#",
- "theme.bar.menus.border.color": "#",
- "theme.bar.buttons.media.background": "#",
- "theme.bar.menus.menu.volume.text": "#",
- "theme.bar.menus.menu.volume.card.color": "#",
- "theme.bar.menus.menu.volume.label.color": "#",
+ "theme.bar.border.color": "#",
+ "theme.bar.menus.check_radio_button.background": "#",
+ "theme.bar.menus.check_radio_button.active": "#",
+ "theme.bar.menus.background": "#",
"theme.bar.menus.popover.text": "#",
- "theme.bar.menus.popover.background": "#",
- "theme.bar.menus.menu.dashboard.powermenu.shutdown": "#",
- "theme.bar.menus.menu.dashboard.powermenu.confirmation.deny": "#",
- "theme.bar.menus.menu.dashboard.powermenu.confirmation.confirm": "#",
+ "theme.bar.menus.popover.background": "#",
+ "theme.bar.menus.popover.border": "#",
+ "theme.bar.menus.text": "#",
+ "theme.bar.menus.border.color": "#",
+ "theme.bar.menus.menu.power.border.color": "#",
+ "theme.bar.menus.menu.power.buttons.restart.background": "#",
+ "theme.bar.menus.menu.power.buttons.restart.text": "#",
+ "theme.bar.menus.menu.power.buttons.restart.icon_background": "#",
+ "theme.bar.menus.menu.power.buttons.restart.icon": "#",
+ "theme.bar.menus.menu.power.buttons.shutdown.icon_background": "#",
+ "theme.bar.menus.menu.power.buttons.shutdown.text": "#",
+ "theme.bar.menus.menu.power.buttons.shutdown.icon": "#",
+ "theme.bar.menus.menu.power.buttons.shutdown.background": "#",
+ "theme.bar.menus.menu.power.buttons.logout.icon": "#",
+ "theme.bar.menus.menu.power.buttons.logout.background": "#",
+ "theme.bar.menus.menu.power.buttons.logout.text": "#",
+ "theme.bar.menus.menu.power.buttons.logout.icon_background": "#",
+ "theme.bar.menus.menu.power.buttons.sleep.icon_background": "#",
+ "theme.bar.menus.menu.power.buttons.sleep.text": "#",
+ "theme.bar.menus.menu.power.buttons.sleep.background": "#",
+ "theme.bar.menus.menu.power.buttons.sleep.icon": "#",
+ "theme.bar.menus.menu.power.background.color": "#",
+ "theme.bar.menus.menu.power.card.color": "#",
+ "theme.bar.menus.menu.notifications.pager.button": "#",
+ "theme.bar.menus.menu.notifications.scrollbar.color": "#",
+ "theme.bar.menus.menu.notifications.pager.label": "#",
+ "theme.bar.menus.menu.notifications.pager.background": "#",
+ "theme.bar.menus.menu.notifications.switch.puck": "#",
+ "theme.bar.menus.menu.notifications.switch.disabled": "#",
+ "theme.bar.menus.menu.notifications.switch.enabled": "#",
+ "theme.bar.menus.menu.notifications.clear": "#",
+ "theme.bar.menus.menu.notifications.switch_divider": "#",
+ "theme.bar.menus.menu.notifications.border": "#",
+ "theme.bar.menus.menu.notifications.card": "#",
+ "theme.bar.menus.menu.notifications.background": "#",
+ "theme.bar.menus.menu.notifications.no_notifications_label": "#",
+ "theme.bar.menus.menu.notifications.label": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.shutdown": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.confirmation.deny": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.confirmation.confirm": "#",
"theme.bar.menus.menu.dashboard.powermenu.confirmation.button_text": "#",
"theme.bar.menus.menu.dashboard.powermenu.confirmation.body": "#",
"theme.bar.menus.menu.dashboard.powermenu.confirmation.label": "#",
- "theme.bar.menus.menu.dashboard.powermenu.confirmation.border": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.confirmation.border": "#",
"theme.bar.menus.menu.dashboard.powermenu.confirmation.background": "#",
- "theme.bar.menus.menu.dashboard.powermenu.confirmation.card": "#",
- "theme.bar.menus.menu.notifications.switch.puck": "#",
- "theme.bar.menus.menu.notifications.switch.disabled": "#",
- "theme.bar.menus.menu.notifications.switch.enabled": "#",
- "theme.bar.menus.menu.notifications.clear": "#",
- "theme.bar.menus.menu.notifications.switch_divider": "#",
- "theme.bar.menus.menu.notifications.border": "#",
- "theme.bar.menus.menu.notifications.card": "#",
- "theme.bar.menus.menu.notifications.background": "#",
- "theme.bar.menus.menu.notifications.no_notifications_label": "#",
- "theme.bar.menus.menu.notifications.label": "#",
- "theme.bar.menus.menu.dashboard.monitors.disk.label": "#",
- "theme.bar.menus.menu.dashboard.monitors.disk.bar": "#",
- "theme.bar.menus.menu.dashboard.monitors.disk.icon": "#",
- "theme.bar.menus.menu.dashboard.monitors.gpu.label": "#",
- "theme.bar.menus.menu.dashboard.monitors.gpu.bar": "#",
- "theme.bar.menus.menu.dashboard.monitors.gpu.icon": "#",
- "theme.bar.menus.menu.dashboard.monitors.ram.label": "#",
- "theme.bar.menus.menu.dashboard.monitors.ram.bar": "#",
- "theme.bar.menus.menu.dashboard.monitors.ram.icon": "#",
- "theme.bar.menus.menu.dashboard.monitors.cpu.label": "#",
- "theme.bar.menus.menu.dashboard.monitors.cpu.bar": "#",
- "theme.bar.menus.menu.dashboard.monitors.cpu.icon": "#",
- "theme.bar.menus.menu.dashboard.monitors.bar_background": "#",
- "theme.bar.menus.menu.dashboard.directories.right.bottom.color": "#",
- "theme.bar.menus.menu.dashboard.directories.right.middle.color": "#",
- "theme.bar.menus.menu.dashboard.directories.right.top.color": "#",
- "theme.bar.menus.menu.dashboard.directories.left.bottom.color": "#",
- "theme.bar.menus.menu.dashboard.directories.left.middle.color": "#",
- "theme.bar.menus.menu.dashboard.directories.left.top.color": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.confirmation.card": "#",
+ "theme.bar.menus.menu.dashboard.monitors.disk.label": "#",
+ "theme.bar.menus.menu.dashboard.monitors.disk.bar": "#",
+ "theme.bar.menus.menu.dashboard.monitors.disk.icon": "#",
+ "theme.bar.menus.menu.dashboard.monitors.gpu.label": "#",
+ "theme.bar.menus.menu.dashboard.monitors.gpu.bar": "#",
+ "theme.bar.menus.menu.dashboard.monitors.gpu.icon": "#",
+ "theme.bar.menus.menu.dashboard.monitors.ram.label": "#",
+ "theme.bar.menus.menu.dashboard.monitors.ram.bar": "#",
+ "theme.bar.menus.menu.dashboard.monitors.ram.icon": "#",
+ "theme.bar.menus.menu.dashboard.monitors.cpu.label": "#",
+ "theme.bar.menus.menu.dashboard.monitors.cpu.bar": "#",
+ "theme.bar.menus.menu.dashboard.monitors.cpu.icon": "#",
+ "theme.bar.menus.menu.dashboard.monitors.bar_background": "#",
+ "theme.bar.menus.menu.dashboard.directories.right.bottom.color": "#",
+ "theme.bar.menus.menu.dashboard.directories.right.middle.color": "#",
+ "theme.bar.menus.menu.dashboard.directories.right.top.color": "#",
+ "theme.bar.menus.menu.dashboard.directories.left.bottom.color": "#",
+ "theme.bar.menus.menu.dashboard.directories.left.middle.color": "#",
+ "theme.bar.menus.menu.dashboard.directories.left.top.color": "#",
"theme.bar.menus.menu.dashboard.controls.input.text": "#",
- "theme.bar.menus.menu.dashboard.controls.input.background": "#",
+ "theme.bar.menus.menu.dashboard.controls.input.background": "#",
"theme.bar.menus.menu.dashboard.controls.volume.text": "#",
- "theme.bar.menus.menu.dashboard.controls.volume.background": "#",
+ "theme.bar.menus.menu.dashboard.controls.volume.background": "#",
"theme.bar.menus.menu.dashboard.controls.notifications.text": "#",
- "theme.bar.menus.menu.dashboard.controls.notifications.background": "#",
+ "theme.bar.menus.menu.dashboard.controls.notifications.background": "#",
"theme.bar.menus.menu.dashboard.controls.bluetooth.text": "#",
- "theme.bar.menus.menu.dashboard.controls.bluetooth.background": "#",
+ "theme.bar.menus.menu.dashboard.controls.bluetooth.background": "#",
"theme.bar.menus.menu.dashboard.controls.wifi.text": "#",
- "theme.bar.menus.menu.dashboard.controls.wifi.background": "#",
- "theme.bar.menus.menu.dashboard.controls.disabled": "#",
- "theme.bar.menus.menu.dashboard.shortcuts.recording": "#",
+ "theme.bar.menus.menu.dashboard.controls.wifi.background": "#",
+ "theme.bar.menus.menu.dashboard.controls.disabled": "#",
+ "theme.bar.menus.menu.dashboard.shortcuts.recording": "#",
"theme.bar.menus.menu.dashboard.shortcuts.text": "#",
- "theme.bar.menus.menu.dashboard.shortcuts.background": "#",
- "theme.bar.menus.menu.dashboard.powermenu.sleep": "#",
- "theme.bar.menus.menu.dashboard.powermenu.logout": "#",
- "theme.bar.menus.menu.dashboard.powermenu.restart": "#",
- "theme.bar.menus.menu.dashboard.profile.name": "#",
- "theme.bar.menus.menu.dashboard.border.color": "#",
+ "theme.bar.menus.menu.dashboard.shortcuts.background": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.sleep": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.logout": "#",
+ "theme.bar.menus.menu.dashboard.powermenu.restart": "#",
+ "theme.bar.menus.menu.dashboard.profile.name": "#",
+ "theme.bar.menus.menu.dashboard.border.color": "#",
"theme.bar.menus.menu.dashboard.background.color": "#",
- "theme.bar.menus.menu.dashboard.card.color": "#",
- "theme.bar.menus.menu.clock.weather.hourly.temperature": "#",
- "theme.bar.menus.menu.clock.weather.hourly.icon": "#",
- "theme.bar.menus.menu.clock.weather.hourly.time": "#",
+ "theme.bar.menus.menu.dashboard.card.color": "#",
+ "theme.bar.menus.menu.clock.weather.hourly.temperature": "#",
+ "theme.bar.menus.menu.clock.weather.hourly.icon": "#",
+ "theme.bar.menus.menu.clock.weather.hourly.time": "#",
"theme.bar.menus.menu.clock.weather.thermometer.extremelycold": "#",
- "theme.bar.menus.menu.clock.weather.thermometer.cold": "#",
+ "theme.bar.menus.menu.clock.weather.thermometer.cold": "#",
"theme.bar.menus.menu.clock.weather.thermometer.moderate": "#",
- "theme.bar.menus.menu.clock.weather.thermometer.hot": "#",
- "theme.bar.menus.menu.clock.weather.thermometer.extremelyhot": "#",
+ "theme.bar.menus.menu.clock.weather.thermometer.hot": "#",
+ "theme.bar.menus.menu.clock.weather.thermometer.extremelyhot": "#",
"theme.bar.menus.menu.clock.weather.stats": "#",
- "theme.bar.menus.menu.clock.weather.status": "#",
- "theme.bar.menus.menu.clock.weather.temperature": "#",
- "theme.bar.menus.menu.clock.weather.icon": "#",
- "theme.bar.menus.menu.clock.calendar.contextdays": "#",
- "theme.bar.menus.menu.clock.calendar.days": "#",
- "theme.bar.menus.menu.clock.calendar.currentday": "#",
- "theme.bar.menus.menu.clock.calendar.paginator": "#",
- "theme.bar.menus.menu.clock.calendar.weekdays": "#",
- "theme.bar.menus.menu.clock.calendar.yearmonth": "#",
- "theme.bar.menus.menu.clock.time.timeperiod": "#",
- "theme.bar.menus.menu.clock.time.time": "#",
- "theme.bar.menus.menu.clock.text": "#",
- "theme.bar.menus.menu.clock.border.color": "#",
+ "theme.bar.menus.menu.clock.weather.status": "#",
+ "theme.bar.menus.menu.clock.weather.temperature": "#",
+ "theme.bar.menus.menu.clock.weather.icon": "#",
+ "theme.bar.menus.menu.clock.calendar.contextdays": "#",
+ "theme.bar.menus.menu.clock.calendar.days": "#",
+ "theme.bar.menus.menu.clock.calendar.currentday": "#",
+ "theme.bar.menus.menu.clock.calendar.paginator": "#",
+ "theme.bar.menus.menu.clock.calendar.weekdays": "#",
+ "theme.bar.menus.menu.clock.calendar.yearmonth": "#",
+ "theme.bar.menus.menu.clock.time.timeperiod": "#",
+ "theme.bar.menus.menu.clock.time.time": "#",
+ "theme.bar.menus.menu.clock.text": "#",
+ "theme.bar.menus.menu.clock.border.color": "#",
"theme.bar.menus.menu.clock.background.color": "#",
- "theme.bar.menus.menu.clock.card.color": "#",
- "theme.bar.menus.menu.battery.slider.puck": "#",
- "theme.bar.menus.menu.battery.slider.backgroundhover": "#",
- "theme.bar.menus.menu.battery.slider.background": "#",
- "theme.bar.menus.menu.battery.slider.primary": "#",
- "theme.bar.menus.menu.battery.icons.active": "#",
- "theme.bar.menus.menu.battery.icons.passive": "#",
- "theme.bar.menus.menu.battery.listitems.active": "#",
- "theme.bar.menus.menu.battery.listitems.passive": "#",
- "theme.bar.menus.menu.battery.text": "#",
- "theme.bar.menus.menu.battery.label.color": "#",
- "theme.bar.menus.menu.battery.border.color": "#",
+ "theme.bar.menus.menu.clock.card.color": "#",
+ "theme.bar.menus.menu.battery.card.color": "#",
"theme.bar.menus.menu.battery.background.color": "#",
- "theme.bar.menus.menu.battery.card.color": "#",
- "theme.bar.menus.menu.systray.dropdownmenu.divider": "#",
- "theme.bar.menus.menu.systray.dropdownmenu.text": "#",
+ "theme.bar.menus.menu.battery.slider.puck": "#",
+ "theme.bar.menus.menu.battery.slider.backgroundhover": "#",
+ "theme.bar.menus.menu.battery.slider.background": "#",
+ "theme.bar.menus.menu.battery.slider.primary": "#",
+ "theme.bar.menus.menu.battery.icons.active": "#",
+ "theme.bar.menus.menu.battery.icons.passive": "#",
+ "theme.bar.menus.menu.battery.listitems.active": "#",
+ "theme.bar.menus.menu.battery.listitems.passive": "#",
+ "theme.bar.menus.menu.battery.text": "#",
+ "theme.bar.menus.menu.battery.label.color": "#",
+ "theme.bar.menus.menu.battery.border.color": "#",
+ "theme.bar.menus.menu.systray.dropdownmenu.divider": "#",
+ "theme.bar.menus.menu.systray.dropdownmenu.text": "#",
"theme.bar.menus.menu.systray.dropdownmenu.background": "#",
+ "theme.bar.menus.menu.bluetooth.scroller.color": "#",
"theme.bar.menus.menu.bluetooth.iconbutton.active": "#",
- "theme.bar.menus.menu.bluetooth.iconbutton.passive": "#",
+ "theme.bar.menus.menu.bluetooth.iconbutton.passive": "#",
"theme.bar.menus.menu.bluetooth.icons.active": "#",
- "theme.bar.menus.menu.bluetooth.icons.passive": "#",
+ "theme.bar.menus.menu.bluetooth.icons.passive": "#",
"theme.bar.menus.menu.bluetooth.listitems.active": "#",
- "theme.bar.menus.menu.bluetooth.listitems.passive": "#",
- "theme.bar.menus.menu.bluetooth.switch.puck": "#",
- "theme.bar.menus.menu.bluetooth.switch.disabled": "#",
+ "theme.bar.menus.menu.bluetooth.listitems.passive": "#",
+ "theme.bar.menus.menu.bluetooth.switch.puck": "#",
+ "theme.bar.menus.menu.bluetooth.switch.disabled": "#