- Modularize Hyprland config into hyprland.d/ - Implement infinitely scalable monitor/workspace logic using templates and loop-based data structures - Consolidate host-specific configs (hyprlock, hyprpaper, waybar) into single templates - Resolve waybar symlink conflict and fix template execution errors - Integrate chezmoi data variables for scale, resolution, and peripherals
136 lines
5.7 KiB
Markdown
136 lines
5.7 KiB
Markdown
- [How do I add multiple instances of a module?](#how-do-i-add-multiple-instances-of-a-module)
|
|
- [The Workspace-Buttons have a strange hover effect](#the-workspace-buttons-have-a-strange-hover-effect)
|
|
- [How can I generate a debug build?](#how-can-i-generate-a-debug-build)
|
|
- [The icons from the default configuration aren't rendered](#the-icons-from-the-default-configuration-arent-rendered)
|
|
- [How do I display text?](#how-do-i-display-text)
|
|
- [How can I prevent modules from changing size?](#how-can-i-prevent-modules-from-changing-size-aka-fixed-width-modules-and-monospace-fonts)
|
|
- [How to use with Sway?](#how-to-use-with-sway)
|
|
- [How can I temporarily hide the bars?](#how-can-I-temporarily-hide-the-bars)
|
|
- [How can I reload the configuration without restarting waybar?](#how-can-I-reload-the-configuration-without-restarting-waybar)
|
|
- [Workspace buttons are too wide with some GTK themes](#workspace-buttons-are-too-wide-with-some-gtk-themes)
|
|
- [My Slider doesn't show/looks small/doesn't work properly](#slider-looks-small)
|
|
|
|
|
|
***
|
|
|
|
## How do I add multiple instances of a module?
|
|
|
|
Have a look here: [Multiple instances of a module](https://github.com/Alexays/Waybar/wiki/Configuration#multiple-instances-of-a-module)
|
|
|
|
## The Workspace-Buttons have a strange hover effect
|
|
|
|
It's not a bug, the original issue [#60](https://github.com/Alexays/Waybar/issues/60).
|
|
|
|
But if you don't like the effect you can disable it by adding the following snippet to your `style.css`:
|
|
```css
|
|
#workspaces button:hover {
|
|
box-shadow: inherit;
|
|
text-shadow: inherit;
|
|
}
|
|
```
|
|
|
|
Additionally, to remove all hover effects from workspaces, add the following in addition to the above:
|
|
```css
|
|
#workspaces button:hover {
|
|
background: <original-color>;
|
|
border: <original-color>;
|
|
padding: 0 3px;
|
|
}
|
|
```
|
|
|
|
## How can I generate a debug build?
|
|
|
|
A debug build can be helpfull when fixing bugs, because it generates a backtrace with debugging symbols.
|
|
|
|
This can be done with:
|
|
```sh
|
|
make build-debug
|
|
```
|
|
|
|
## The icons from the default configuration aren't rendered
|
|
|
|
You need to install `otf-font-awesome`. See here on how to install the [Font Awesome OTF package](https://github.com/Alexays/Waybar/wiki/Installation#how-to-use-with-sway).
|
|
|
|
## How do I display text?
|
|
|
|
Create a [Custom](./Module:-Custom) module with the `format` field specified with your text.
|
|
|
|
## How can I prevent modules from changing size? (aka. fixed-width modules, and monospace fonts)
|
|
|
|
First make sure to set a monospace font:
|
|
```css
|
|
* {
|
|
font-family: monospace;
|
|
}
|
|
```
|
|
|
|
Then change the module format so that it stays at a fixed width. Waybar uses [fmt](https://github.com/fmtlib/fmt) for formatting so the following syntax is an example of how to set the CPU percentage to be at least 2 characters wide:
|
|
```jsonc
|
|
"format": "{usage:2}%"
|
|
```
|
|
|
|
The fmt library has two issues. First it provides no way to set the _maximum_ length of a field, only the _minimum_ length. So expect width changes when the text becomes longer than the minimum width. This can be partially worked around with the `max-length`parameter. See https://github.com/Alexays/Waybar/issues/486.
|
|
|
|
The second issue concerns floating point numbers. Waybar comes with a custom formatter that enforces a fixed width for them (network bandwidth, disk usage, etc). You need to specify either `>`, `<`, or `=` as format modifier. This will align the number as requested and make it fixed width. See https://github.com/Alexays/Waybar/pull/472 for details, examples and limitations.
|
|
|
|
A last but painful issue arises with pango/cairo font rendering for custom glyphs (Font Awesome icons, most probably). Cairo keeps the font used for the last non-whitespace character to render the next whitespaces. This means that the two next lines, despite containing the same number of characters, will not render with the same width.
|
|
```
|
|
10 spaces
|
|
2 leading spaces
|
|
```
|
|
|
|
You can either move all your icons at the end of the module, so that they have no following spaces to alter, or use pango-specific markup around all the icons, like this: `<span font=\"Font Awesome 5 Free\"></span>`. This forces cairo to return to the default font when leaving the `<span>` and avoids using spaces of the wrong kind. You may experience improvements as https://gitlab.gnome.org/GNOME/pango/-/issues/249 seems to work against that.
|
|
|
|
|
|
## How to use with Sway?
|
|
|
|
You can use Waybar by defining in your Sway config file:
|
|
```
|
|
bar {
|
|
swaybar_command waybar
|
|
}
|
|
```
|
|
|
|
or at the end of your sway config file
|
|
|
|
```
|
|
exec waybar
|
|
```
|
|
|
|
## How can I temporarily hide the bars?
|
|
You can toggle the visibility of the bars with:
|
|
```sh
|
|
killall -SIGUSR1 waybar
|
|
```
|
|
|
|
## How can I reload the configuration without restarting waybar?
|
|
***Only works on waybar after version v0.9.5***
|
|
```sh
|
|
killall -SIGUSR2 waybar
|
|
```
|
|
|
|
## Workspace buttons are too wide with some GTK themes
|
|
|
|

|
|
|
|
In certain GTK themes, the button.text-button.flat element's min-width property is assigned a large value. You can override it in waybar's `style.css`
|
|
|
|
```css
|
|
#workspaces button {
|
|
min-width: 20px;
|
|
}
|
|
```
|
|
<a name="slider-looks-small"></a>
|
|
|
|
## My Slider doesn't show/looks small/doesn't work properly
|
|
|
|
Like all widgets in GTK, its width and height is determined in CSS. However, in a surprising turn, it's ever more important that you style your slider widget, otherwise its width and height will be *close to* 0, and it won't work properly when dragging around. It's worth noting that only the `trough` CSS Node actually requires any minimum height or width.
|
|
|
|
Try this if you're experiencing issues with sliders:
|
|
|
|
```css
|
|
#pulseaudio-slider trough, #backlight-slider trough {
|
|
min-height: 10px;
|
|
min-width: 80px;
|
|
}
|
|
``` |