waybar style problems

[Micha-Btz]

Hi there,

I have created two waybars, one for the top and one for the bottom. I would like to have some starters on my dock, but from my configured 7 are only 5 shown and overlap each other. I have tried with spacing in the modul section and wit margin in the styles, nothing helps. Can someone point me please in the right direction?

I'm using hyprland on arch linux.

waybar -c ~/.config/waybar/config-bottom.jsonc -s ~/.config/waybar/style-bottom.css

style-bottom.css

* {
    /* `otf-font-awesome` is required to be installed for icons */
    font-family: FontAwesome, Roboto, Helvetica, Arial, sans-serif;
    font-size: 40px;
}

window#waybar {
    background: rgba(21, 18, 27, 0);
    color: #f6f7fc;
    margin-right: 15px;
}

.modules-left {
    margin-left: 15px;
    min-width:  340px;
}

.modules-center {
    margin-right: 15px;
    min-width:  140px;
}

.modules-right { 
    margin-right: 15px;
}

/* launcher bottom */
#custom-weather,
#taskbar {
    margin: 1px;
}

#custom-launch_wofi,
#custom-launch_firefox,
#custom-launch_kitty,
#custom-launch_mail,
#custom-launch_file,
#custom-launch_audacious,
#custom-launch_keepass {
    margin: 8px;
}

config-bottom.jsonc

{
    "layer": "top",
    "position": "bottom",
    "mod": "dock",
    "exclusive": true,
    //"spacing": 8,
    "passthrough": false,
    "gtk-layer-shell": true,
    //"height": 45,
    "modules-left": [
        "custom/launch_wofi",
        "custom/launch_firefox",
        "custom/launch_thunderbird",
        "custom/launch_kitty",
        "custom/launch_thunar",
        "custom/launch_audacious",
        "custom/launch_keepass"
    ],
    "modules-center": ["wlr/taskbar"],
    "modules-right": ["custom/weather"],

    "custom/launch_firefox": {
        "format": "",
        "on-click": "firefox",
        "tooltip": true,
        "tooltip-format": "{name} - {title}"
    },

    "custom/launch_mail": {
        "format": "󰇰",
        "on-click": "evolution",
        "tooltip": true
    },
    
    "custom/launch_audacious": {
        "format": "󰇰",
        "on-click": "audacious",
        "tooltip": true
    },

    "custom/launch_keepass": {
        "format": "󰇰",
        "on-click": "keepassxc",
        "tooltip": true
    },

    "custom/launch_file": {
        "format": "",
        "on-click": "exec thunar",
        "tooltip": true
    },

    "custom/launch_kitty": {
        "format": "",
        "on-click": "exec kitty",
        "tooltip": false
    },
   
    "custom/weather": {
    //shows the current weather and forecast
    "tooltip" : true,
    "format" : "{}",
    "interval" : 30,
    "exec" : "~/.config/waybar/scripts/waybar-wttr-c.py",
    "return-type" : "json"
    },

    "custom/launch_wofi": {
        "format": "󱗼",
        "on-click": "sh -c '(sleep 0.5s; pkill wofi || wofi -c ~/.config/wofi/config-lmenu)' & disown",
        "tooltip": false
    },

    "wlr/taskbar": {
        "format": "{icon}",
        "icon-size": 40,
        "all-outputs": true,
        "tooltip-format": "{name} - {title}",
        "on-click": "activate",
        "max-length": 100,
        "on-click-middle": "close",
        "ignore-list": [
            "wofi"
        ]
    }
}

Does it make sence to specify more than one font?
What is the best way to find an icon, for example for a media player?

Thanks Micha

[Micha-Btz]

[Micha-Btz]

have had a bad day