unixporn

8325 readers

26 users here now

unixporn

Submit screenshots of all your *NIX desktops, themes, and nifty configurations, or submit anything else that will make ricers happy. Maybe a server running on an Amiga, or a Thinkpad signed by Bjarne Stroustrup? Show the world how pretty your computer can be!

Rules

Post On-Topic
No Defaults
Busy Screenshot
Use High-Quality Images
Include a Details Comment
No NSFW

founded 3 years ago

MODERATORS

StardustKyun@lemmy.world

buffet@lemmy.world

ElKowar@lemmy.world

Less than 60 lines of code, a functional waybar that doesn't look too bad (lemmy.zip)

submitted 1 day ago by variety4me@lemmy.zip to c/unixporn@lemmy.world

8 comments fedilink hide all child comments

Can this be further reduced? config.jsonc

{
    "layer": "top",
    "position": "top",
    "modules-left": ["niri/workspaces", "cpu", "memory", "temperature"],
    "modules-center": ["niri/window"],
    "modules-right": ["wireplumber", "battery", "network", "clock"],
    "reload_style_on_change": true,

    "cpu": { "format": " {avg_frequency}GHz" },
    "memory": { "format": "  {used:0.1f}G" },
    "temperature": { "format": " {temperatureC}°C" },
    "wireplumber": {
        "format": "{icon} {volume}%",
        "format-muted": "󰝟",
        "format-icons": ["󰖀", "󰕾"],
    },
    "battery": {
        "format": "{icon} {capacity}%",
        "format-icons": ["󰁺", "󰁻", "󰁼", "󰁽", "󰁾", "󰁿", "󰂀", "󰂁", "󰂂", "󰁹"],
    },
    "network": {
        "format-ethernet": "",
        "format-wifi": "{icon} {signalStrength}%",
        "format-disconnected": "󰤭",
        "format-icons": ["󰤟", "󰤢", "󰤥", "󰤨"],
    },
    "clock": { "format": "󱦟 {:%I:%M}" },
}

style.css

@define-color primary #67CBFC;
@define-color secondary #FFD866;
@define-color background #2D2A2E;
window#waybar {
    background-color: @background;
    color: @secondary;
}
#workspaces,
#clock,
#wireplumber,
#battery,
#network,
#cpu,
#temperature,
#memory {
    font-family: "Monaspace Argon NF";
    padding: 4px 12px;
}
#workspaces button {
    all: initial;
    box-shadow: inset 0 -3px transparent;
    padding: 4px 12px;
    color: @secondary;
    transition: all 0.2s ease-in-out;
}
#workspaces button.active {
    color: @primary;
}

you are viewing a single comment's thread
view the rest of the comments

[–] Micromot@piefed.social 10 points 1 day ago (1 children)

You can remove the empty id entries in the style.css

[–] variety4me@lemmy.zip 7 points 1 day ago (1 children)

Nice!! Thanks!! 21 lines css now

@define-color primary #67CBFC;
@define-color secondary #FFD866;
@define-color background #2D2A2E;
window#waybar {
    background-color: @background;
    color: @secondary;
}
.module {
    font-family: "Monaspace Argon NF";
    padding: 4px 12px;
}
#workspaces button {
    all: initial;
    box-shadow: inset 0 -3px transparent;
    padding: 4px 12px;
    color: @secondary;
    transition: all 0.2s ease-in-out;
}
#workspaces button.active {
    color: @primary;
}

[–] Micromot@piefed.social 5 points 1 day ago

Awesome, all hail short css files