[create-theme]: Glazing Mocha

[Somrat10369]

Name

Glazing Mocha

Description

A dark, glass-aesthetic YASB theme built on Catppuccin Mocha with acrylic blur, JetBrainsMono, and GlazeWM integration.

Homepage

https://github.com/Somrat10369/Yasb-Config

Image

https://raw.githubusercontent.com/Somrat10369/Yasb-Config/58e819b152b778738f68f9c7065db478266d3f54/assets/yasb_bar_yasb-bar_20260406_004705.png

Theme Styles

:root {
    --base: #1e1e2e;
    --mantle: #181825;
    --crust: #11111b;
    --surface0: #313244;
    --surface1: #45475a;
    --surface2: #585b70;
    --overlay0: #6c7086;
    --overlay1: #7f849c;
    --overlay2: #9399b2;
    --text: #cdd6f4;
    --subtext0: #a6adc8;
    --subtext1: #bac2de;
    --lavender: #b4befe;
    --blue: #89b4fa;
    --sapphire: #74c7ec;
    --sky: #89dceb;
    --teal: #94e2d5;
    --green: #a6e3a1;
    --yellow: #f9e2af;
    --peach: #fab387;
    --maroon: #eba0ac;
    --red: #f38ba8;
    --mauve: #cba6f7;
    --pink: #f5c2e7;
    --flamingo: #f2cdcd;
    --rosewater: #f5e0dc;
}
* {
    font-size: 13px;
    font-family: "JetBrainsMono NFP", "JetBrainsMono Nerd Font Propo", monospace;
    color: var(--text);
    margin: 0;
    padding: 0;
    border: none;
}
.yasb-bar {
    background-color: rgba(24, 24, 37, 0.85);
    border-bottom: 1px solid rgba(180, 190, 254, 0.06);
    padding-top: 2px;
}
.widget {
    padding: 0 5px;
    color: var(--text);
}
.widget .widget-container {
    border-radius: 8px;
    padding: 2px 4px;
    transition: background-color 0.12s ease;
}
.widget .label, .widget .icon {
    color: var(--text);
    padding: 0 3px;
}
.widget .icon {
    font-size: 14px;
}
.container-left, .container-center, .container-right {
    margin: 0;
    padding: 0;
}
.glazewm-workspaces {
    margin: 0;
    padding: 0 6px;
}
.glazewm-workspaces .ws-btn {
    font-size: 13px;
    background-color: transparent;
    border: none;
    padding: 4px 8px;
    margin: 0 3px;
    color: var(--overlay1);
    border-radius: 6px;
    transition: all 0.12s ease;
}
.glazewm-workspaces .ws-btn.populated {
    color: var(--subtext1);
}
.glazewm-workspaces .ws-btn.active_populated, .glazewm-workspaces .ws-btn.active_empty {
    color: var(--lavender);
    background-color: rgba(180, 190, 254, 0.15);
    font-weight: 600;
}
.glazewm-workspaces .ws-btn:hover, .glazewm-workspaces .ws-btn.populated:hover {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--text);
}
.glazewm-workspaces .offline-status {
    color: var(--red);
    font-size: 11px;
    font-weight: 600;
}
.active-window-widget {
    padding: 0 8px;
    max-width: 360px;
}
.active-window-widget .widget-container {
    background-color: transparent;
}
.active-window-widget .label {
    color: var(--subtext1);
    font-size: 12px;
    font-weight: 500;
}
.active-window-widget .icon {
    color: var(--blue);
    margin-right: 5px;
    font-size: 13px;
}
.home-widget {
    padding: 0 9px 0 11px;
}
.home-widget .icon {
    color: var(--mauve);
    font-size: 15px;
    transition: color 0.12s ease;
}
.home-widget .icon:hover {
    color: var(--lavender);
}
.home-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 8px;
}
.home-menu .menu-item {
    padding: 7px 48px 7px 16px;
    font-size: 12px;
    color: var(--subtext1);
    font-weight: 500;
    border-radius: 4px;
    margin: 2px 6px;
}
.home-menu .menu-item:hover {
    background-color: rgba(180, 190, 254, 0.1);
    color: var(--text);
}
.home-menu .separator {
    max-height: 1px;
    background-color: rgba(180, 190, 254, 0.08);
    margin: 4px 8px;
}
.clock-widget {
    padding: 0 8px;
}
.clock-widget .icon {
    color: var(--blue);
    font-size: 12px;
    padding-right: 5px;
}
.clock-widget .label {
    color: var(--text);
    font-weight: 500;
}
.clock-popup.calendar {
    background-color: rgba(24, 24, 37, 0.85);
    min-width: 420px;
}
.clock-popup.calendar .calendar-table, .clock-popup.calendar .calendar-table::item {
    background-color: transparent;
    color: rgba(162, 173, 200, 0.85);
    border: none;
    outline: none;
}
.clock-popup.calendar .calendar-table::item:selected {
    color: var(--crust);
    font-weight: bold;
    background-color: var(--lavender);
    border-radius: 12px;
}
.clock-popup.calendar .day-label, .clock-popup.calendar .month-label, .clock-popup.calendar .year-label, .clock-popup.calendar .date-label {
    font-size: 16px;
    color: var(--text);
    font-weight: 700;
}
.clock-popup.calendar .date-label {
    font-size: 72px;
    font-weight: 900;
}
.media-widget {
    padding: 0 6px;
}
.media-widget .label {
    color: var(--subtext1);
    font-size: 12px;
    padding-right: 6px;
    font-weight: 500;
}
.media-widget .btn {
    color: var(--overlay2);
    padding: 0 4px;
    font-family: "Segoe Fluent Icons";
    font-weight: 400;
    transition: color 0.1s ease;
}
.media-widget .btn:hover {
    color: var(--text);
}
.media-widget .btn.play {
    font-size: 14px;
}
.media-widget .btn.disabled, .media-widget .btn.disabled:hover {
    color: var(--surface2);
}
.media-menu {
    min-width: 420px;
    max-width: 420px;
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
}
.media-menu .title {
    font-size: 14px;
    font-weight: 600;
    margin-left: 12px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
}
.media-menu .artist {
    font-size: 12px;
    color: var(--overlay1);
    margin-left: 12px;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.media-menu .source {
    font-size: 11px;
    background-color: var(--surface0);
    color: var(--text);
    border-radius: 4px;
    padding: 3px 8px;
    font-family: "JetBrainsMono Nerd Font Propo";
    margin-top: 10px;
    margin-left: 12px;
    font-weight: 500;
}
.media-menu .source.spotify {
    background-color: #1db954;
    color: #000;
}
.media-menu .source.firefox {
    background-color: #ff7139;
    color: #fff;
}
.media-menu .source.chrome {
    background-color: #4285f4;
    color: #fff;
}
.media-menu .source.edge {
    background-color: #0078d4;
    color: #fff;
}
.media-menu .btn {
    font-family: "Segoe Fluent Icons";
    font-size: 15px;
    font-weight: 400;
    margin: 10px 3px 0;
    min-width: 40px;
    max-width: 40px;
    min-height: 40px;
    max-height: 40px;
    border-radius: 20px;
    color: var(--overlay2);
    transition: all 0.12s ease;
}
.media-menu .btn.play {
    background-color: rgba(255, 255, 255, 0.1);
    font-size: 18px;
}
.media-menu .btn:hover {
    color: var(--text);
    background-color: rgba(255, 255, 255, 0.12);
}
.media-menu .btn.disabled, .media-menu .btn.disabled:hover {
    color: var(--surface2);
    background-color: transparent;
}
.media-menu .progress-slider::groove {
    background: rgba(69, 71, 90, 0.5);
    height: 3px;
    border-radius: 2px;
}
.media-menu .progress-slider::sub-page {
    background: var(--lavender);
    border-radius: 2px;
}
.pomodoro-widget {
    padding: 0 7px;
}
.pomodoro-widget .icon {
    font-size: 13px;
    padding-right: 5px;
}
.pomodoro-widget .label.work, .pomodoro-widget .icon.work {
    color: var(--green);
}
.pomodoro-widget .label.break, .pomodoro-widget .icon.break {
    color: var(--blue);
}
.pomodoro-widget .label.paused, .pomodoro-widget .icon.paused {
    color: var(--overlay1);
}
.pomodoro-widget .label, .pomodoro-widget .icon {
    transition: color 0.12s ease;
}
.pomodoro-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
}
.pomodoro-menu .status {
    font-size: 18px;
    font-weight: 600;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.pomodoro-menu .session {
    font-size: 12px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.pomodoro-menu .button {
    background-color: var(--surface0);
    color: var(--text);
    border: none;
    border-radius: 6px;
    padding: 7px 16px;
    font-weight: 500;
    transition: all 0.12s ease;
}
.pomodoro-menu .button.pause {
    background-color: rgba(166, 227, 161, 0.18);
    color: var(--green);
}
.pomodoro-menu .button.start {
    background-color: rgba(180, 190, 254, 0.15);
}
.pomodoro-menu .button:hover {
    background-color: var(--surface1);
    transform: translateY(-1px);
}
.pomodoro-menu .button:pressed {
    background-color: var(--surface2);
    transform: translateY(0);
}
.notes-widget {
    padding: 0 7px;
}
.notes-widget .label {
    color: var(--yellow);
    font-size: 13px;
    font-weight: 500;
}
.notes-widget .icon {
    color: var(--yellow);
    font-size: 14px;
}
.notes-menu {
    min-width: 400px;
    max-width: 400px;
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
}
.notes-menu.floating {
    min-width: 580px;
    max-width: 580px;
    min-height: 580px;
    max-height: 580px;
}
.notes-menu .notes-header {
    background-color: transparent;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.notes-menu .notes-header .header-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--text);
}
.notes-menu .notes-header .float-button, .notes-menu .notes-header .close-button {
    background: transparent;
    border: none;
    color: var(--overlay2);
    font-size: 15px;
    padding: 4px 6px;
    border-radius: 5px;
    transition: all 0.12s ease;
}
.notes-menu .notes-header .float-button:hover, .notes-menu .notes-header .close-button:hover {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--text);
}
.notes-menu .note-item {
    background-color: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding: 8px 10px;
    border-radius: 6px;
    margin: 4px 8px;
    transition: background-color 0.1s ease;
}
.notes-menu .note-item:hover {
    background-color: rgba(255, 255, 255, 0.05);
}
.notes-menu .note-item .title {
    font-size: 13px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
    font-weight: 500;
}
.notes-menu .note-item .date {
    font-size: 11px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--overlay0);
    margin-top: 2px;
}
.notes-menu .delete-button {
    color: var(--red);
    background: transparent;
    border: none;
    font-size: 13px;
    padding: 4px 7px;
    border-radius: 4px;
    transition: all 0.1s ease;
}
.notes-menu .copy-button {
    color: var(--overlay2);
    background: transparent;
    border: none;
    font-size: 13px;
    padding: 4px 7px;
    border-radius: 4px;
    transition: all 0.1s ease;
}
.notes-menu .delete-button:hover, .notes-menu .copy-button:hover {
    background-color: rgba(255, 255, 255, 0.08);
}
.notes-menu .note-input {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--surface1);
    border-radius: 6px;
    color: var(--text);
    font-size: 13px;
    padding: 6px 10px;
}
.notes-menu .note-input:focus {
    border-color: var(--lavender);
}
.notes-menu .add-button, .notes-menu .cancel-button {
    background-color: rgba(255, 255, 255, 0.1);
    border: none;
    border-radius: 6px;
    color: var(--text);
    padding: 7px 14px;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 500;
    transition: all 0.12s ease;
}
.notes-menu .add-button:hover, .notes-menu .cancel-button:hover {
    background-color: rgba(255, 255, 255, 0.16);
}
.notes-menu .scroll-area {
    background: transparent;
    border: none;
}
.notes-menu .empty-list {
    color: var(--overlay0);
    font-size: 18px;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.todo-widget {
    padding: 0 7px;
}
.todo-widget .icon {
    color: var(--teal);
    font-size: 14px;
}
.todo-widget .label {
    font-size: 13px;
    font-weight: 500;
}
.todo-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 400px;
    max-width: 400px;
    min-height: 480px;
    max-height: 480px;
}
.todo-menu .header .add-task-button, .todo-menu .header .tab-buttons {
    border: none;
    border-radius: 8px;
    color: var(--text);
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo", "JetBrainsMono NFP";
    transition: all 0.12s ease;
}
.todo-menu .header .tab-buttons.in-progress:checked {
    color: var(--teal);
    background-color: rgba(148, 226, 213, 0.15);
}
.todo-menu .header .tab-buttons.completed:checked {
    color: var(--red);
    background-color: rgba(243, 139, 168, 0.15);
}
.todo-menu .header .tab-buttons.sort {
    background-color: rgba(255, 255, 255, 0.08);
    min-height: 22px;
    min-width: 22px;
    max-width: 22px;
    max-height: 22px;
    padding: 0;
    margin: 0 6px 0 0;
    border-radius: 6px;
    font-family: "JetBrainsMono NFP";
}
.todo-menu .task-item {
    background-color: rgba(255, 255, 255, 0.04);
    border-radius: 8px;
    margin: 0 10px 8px 10px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    padding: 8px 0;
    transition: all 0.12s ease;
}
.todo-menu .task-item.expanded {
    border-color: rgba(255, 255, 255, 0.12);
    background-color: rgba(255, 255, 255, 0.05);
}
.todo-menu .task-item:hover {
    background-color: rgba(255, 255, 255, 0.06);
}
.todo-menu .task-item .title {
    color: var(--text);
    font-size: 12px;
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo";
    padding: 0 10px 6px;
}
.todo-menu .task-item .description {
    color: var(--subtext0);
    font-size: 11px;
    font-family: "JetBrainsMono Nerd Font Propo";
    padding: 0 10px 6px;
}
.todo-menu .task-item.completed .title, .todo-menu .task-item.completed .description {
    text-decoration: line-through;
    color: var(--overlay0);
}
.todo-menu .task-checkbox {
    background: transparent;
    border: none;
    margin-left: 10px;
    font-size: 16px;
    color: var(--text);
    font-family: "JetBrainsMono NFP";
}
.todo-menu .task-checkbox:checked {
    color: var(--teal);
}
.todo-menu .task-info-row .date-text, .todo-menu .task-info-row .category-text {
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--overlay1);
    font-size: 11px;
    font-weight: 500;
}
.todo-menu .task-info-row .category-text.important, .todo-menu .task-info-row .category-icon.important {
    color: var(--red);
}
.todo-menu .task-info-row .category-text.urgent, .todo-menu .task-info-row .category-icon.urgent {
    color: var(--peach);
}
.todo-menu .task-info-row .category-text.soon, .todo-menu .task-info-row .category-icon.soon {
    color: var(--teal);
}
.todo-menu .task-info-row .category-text.today, .todo-menu .task-info-row .category-icon.today {
    color: var(--yellow);
}
.todo-menu .task-info-row .delete-task-button {
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--text);
    font-size: 11px;
    padding: 3px 10px;
    border-radius: 6px;
    min-height: 20px;
    max-height: 20px;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 600;
    margin-right: 8px;
    transition: all 0.1s ease;
}
.todo-menu .task-info-row .delete-task-button:hover {
    background-color: rgba(243, 139, 168, 0.2);
    color: var(--red);
}
.todo-menu .no-tasks {
    color: var(--overlay0);
    font-size: 16px;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.todo-menu .no-tasks-icon {
    font-size: 64px;
    color: var(--overlay0);
    font-family: "JetBrainsMono NFP";
}
.ai-chat-widget {
    padding: 0 7px;
}
.ai-chat-widget .icon {
    color: var(--mauve);
    font-size: 15px;
}
.ai-chat-popup {
    background-color: rgba(24, 24, 37, 0.92);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 12px;
    min-width: 430px;
    max-width: 430px;
    min-height: 480px;
    max-height: 480px;
}
.ai-chat-popup.floating {
    min-width: 960px;
    max-width: 960px;
    min-height: 740px;
    max-height: 740px;
    border-radius: 14px;
}
.ai-chat-popup .chat-header {
    background-color: transparent;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.ai-chat-popup .chat-header .provider-button, .ai-chat-popup .chat-header .model-button {
    background-color: var(--surface0);
    border: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 12px;
    color: var(--text);
    border-radius: 6px;
    padding: 5px 12px;
    min-width: 130px;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 500;
    transition: all 0.12s ease;
}
.ai-chat-popup .chat-header .provider-button:hover, .ai-chat-popup .chat-header .model-button:hover {
    background-color: var(--surface1);
    border-color: rgba(255, 255, 255, 0.15);
}
.ai-chat-popup .chat-header .float-button, .ai-chat-popup .chat-header .close-button {
    background: transparent;
    border: none;
    color: var(--overlay2);
    font-size: 15px;
    padding: 4px 6px;
    border-radius: 6px;
    transition: all 0.12s ease;
}
.ai-chat-popup .chat-header .float-button:hover, .ai-chat-popup .chat-header .close-button:hover {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--text);
}
.ai-chat-popup .chat-header .loader-line {
    color: var(--blue);
    height: 2px;
}
.ai-chat-popup .chat-content {
    background: transparent;
    border: none;
    padding: 8px;
}
.ai-chat-popup .chat-content .user-message {
    margin-left: 28px;
    padding: 10px 14px;
}
.ai-chat-popup .chat-content .assistant-message {
    background-color: rgba(49, 50, 68, 0.6);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    padding: 10px 14px;
}
.ai-chat-popup .chat-content .user-message .text, .ai-chat-popup .chat-content .assistant-message .text {
    font-size: 13px;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
    line-height: 1.5;
}
.ai-chat-popup .chat-content .assistant-icon {
    font-size: 20px;
    color: var(--mauve);
    margin-right: 8px;
    font-family: "JetBrainsMono NFP";
}
.ai-chat-popup .chat-content .copy-button {
    color: var(--overlay2);
    background: transparent;
    border: none;
    font-size: 13px;
    padding: 4px 6px;
    border-radius: 4px;
    transition: all 0.1s ease;
}
.ai-chat-popup .chat-content .copy-button:hover {
    background-color: rgba(255, 255, 255, 0.08);
    color: var(--text);
}
.ai-chat-popup .chat-content .empty-chat .greeting {
    font-size: 32px;
    font-weight: 700;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
}
.ai-chat-popup .chat-content .empty-chat .message {
    font-size: 16px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--overlay1);
    padding-top: 6px;
}
.ai-chat-popup .chat-footer {
    padding: 14px;
    background-color: rgba(0, 0, 0, 0.1);
}
.ai-chat-popup .chat-footer .chat-input-wrapper {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid var(--surface1);
    border-radius: 10px;
    padding: 6px 10px;
    max-height: 80px;
    min-height: 36px;
    transition: all 0.15s ease;
}
.ai-chat-popup .chat-footer .chat-input-wrapper.focused {
    border-color: var(--lavender);
    background-color: rgba(255, 255, 255, 0.07);
}
.ai-chat-popup .chat-footer .chat-input {
    font-size: 13px;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.ai-chat-popup .chat-footer .send-button, .ai-chat-popup .chat-footer .stop-button, .ai-chat-popup .chat-footer .clear-button, .ai-chat-popup .chat-footer .attach-button {
    color: var(--text);
    font-size: 14px;
    min-width: 32px;
    max-width: 32px;
    min-height: 32px;
    max-height: 32px;
    border-radius: 6px;
    border: none;
    font-family: "JetBrainsMono NFP";
    transition: all 0.12s ease;
}
.ai-chat-popup .chat-footer .stop-button {
    background-color: rgba(137, 180, 250, 0.25);
}
.ai-chat-popup .chat-footer .stop-button:hover {
    background-color: rgba(137, 180, 250, 0.35);
}
.ai-chat-popup .chat-footer .send-button:hover, .ai-chat-popup .chat-footer .clear-button:hover, .ai-chat-popup .chat-footer .attach-button:hover {
    background-color: var(--surface0);
}
.ai-chat-popup .chat-footer .send-button:disabled, .ai-chat-popup .chat-footer .clear-button:disabled, .ai-chat-popup .chat-footer .attach-button:disabled {
    color: var(--overlay0);
}
.ai-chat-popup .context-menu {
    background-color: var(--surface0);
    border: 1px solid rgba(255, 255, 255, 0.08);
    padding: 5px 0;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-size: 12px;
    color: var(--text);
    border-radius: 8px;
}
.ai-chat-popup .context-menu::item {
    background: transparent;
    margin: 3px 6px;
    border-radius: 5px;
    padding: 7px 12px;
    transition: all 0.1s ease;
}
.ai-chat-popup .context-menu::item:selected {
    background-color: var(--surface1);
}
.ai-chat-popup .context-menu::item:checked {
    background-color: rgba(180, 190, 254, 0.25);
    color: var(--lavender);
}
.ai-chat-popup .context-menu::item:pressed {
    background-color: var(--surface2);
}
.ai-chat-popup .attachment-chip {
    background-color: rgba(137, 180, 250, 0.15);
    border: 1px solid rgba(137, 180, 250, 0.3);
    border-radius: 6px;
    padding: 2px 6px;
    margin: 2px 4px;
}
.ai-chat-popup .attachment-chip .attachment-label {
    color: var(--subtext1);
    font-size: 11px;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.ai-chat-popup .attachment-chip .attachment-remove-button {
    color: var(--overlay1);
    font-size: 12px;
    padding: 0 2px;
}
.ai-chat-popup .attachment-chip .attachment-remove-button:hover {
    color: var(--red);
}
.ai-chat-widget .notification-dot {
    background-color: var(--red);
    border-radius: 50%;
    min-width: 6px;
    min-height: 6px;
    max-width: 6px;
    max-height: 6px;
}
.notification-widget {
    padding: 0 5px;
}
.notification-widget .icon {
    font-size: 14px;
    color: var(--overlay2);
}
.notification-widget .icon.new-notification {
    color: var(--blue);
}
.notification-widget .label.new-notification {
    color: var(--blue);
    font-weight: 600;
}
.github-widget {
    padding: 0 5px;
}
.github-widget .icon {
    font-size: 15px;
    color: var(--overlay2);
}
.github-widget .icon.new-notification {
    color: var(--red);
}
.github-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    max-height: 500px;
    min-height: 480px;
    min-width: 420px;
}
.github-menu .header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-size: 14px;
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo";
    padding: 10px 12px;
    color: var(--text);
}
.github-menu .footer {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 6px 10px 8px;
}
.github-menu .footer .label {
    font-size: 11px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--overlay1);
}
.github-menu .contents .item {
    min-height: 42px;
    padding: 8px 12px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background-color 0.1s ease;
}
.github-menu .contents .item:hover {
    background-color: rgba(255, 255, 255, 0.05);
}
.github-menu .contents .item .title {
    font-size: 13px;
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--subtext1);
}
.github-menu .contents .item .description {
    font-size: 11px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--overlay1);
    margin-top: 2px;
}
.github-menu .contents .item.new .title, .github-menu .contents .item.new .description {
    color: var(--text);
}
.github-menu .contents .item .icon {
    font-size: 15px;
    padding: 0 6px;
    color: var(--overlay1);
}
.github-menu .contents .item.new .icon {
    color: var(--green);
}
.traffic-widget {
    padding: 0 5px;
}
.traffic-widget .label {
    font-size: 12px;
    color: var(--subtext0);
    font-weight: 500;
}
.traffic-widget .icon {
    color: var(--sky);
}
.traffic-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 280px;
}
.traffic-menu .header .title {
    font-size: 15px;
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
    padding: 10px;
}
.traffic-menu .download-speed-value, .traffic-menu .upload-speed-value {
    font-size: 20px;
    font-weight: 800;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--subtext1);
}
.traffic-menu .internet-info.connected {
    background-color: rgba(166, 227, 161, 0.1);
    color: var(--green);
    border-radius: 6px;
}
.traffic-menu .internet-info.disconnected {
    background-color: rgba(243, 139, 168, 0.1);
    color: var(--red);
    border-radius: 6px;
}
.traffic-menu .data-text {
    font-size: 12px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.traffic-menu .data-value {
    font-weight: 600;
    font-size: 12px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
}
.traffic-menu .section-title {
    font-size: 11px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 600;
}
.cpu-widget {
    padding: 0 5px;
}
.cpu-widget .icon {
    color: var(--mauve);
    font-size: 13px;
}
.cpu-widget .label {
    color: var(--text);
    font-weight: 500;
}
.cpu-widget .label.status-low {
    color: var(--green);
}
.cpu-widget .label.status-medium {
    color: var(--yellow);
}
.cpu-widget .label.status-high {
    color: var(--peach);
}
.cpu-widget .label.status-critical {
    color: var(--red);
}
.cpu-popup {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 360px;
}
.cpu-popup .header .text {
    font-size: 15px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
    font-weight: 600;
    padding: 10px;
}
.cpu-popup .cpu-graph {
    color: var(--mauve);
}
.cpu-popup .cpu-graph-grid {
    color: rgba(255, 255, 255, 0.05);
}
.cpu-popup .stats {
    padding: 10px;
}
.cpu-popup .stats .stat-label {
    font-size: 12px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 500;
}
.cpu-popup .stats .stat-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.memory-widget {
    padding: 0 5px;
}
.memory-widget .icon {
    color: var(--blue);
    font-size: 13px;
}
.memory-widget .label {
    color: var(--text);
    font-weight: 500;
}
.memory-widget .label.status-low {
    color: var(--green);
}
.memory-widget .label.status-medium {
    color: var(--yellow);
}
.memory-widget .label.status-high {
    color: var(--peach);
}
.memory-widget .label.status-critical {
    color: var(--red);
}
.memory-popup {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 360px;
}
.memory-popup .header .text {
    font-size: 15px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
    font-weight: 600;
    padding: 10px;
}
.memory-popup .memory-graph {
    color: var(--blue);
}
.memory-popup .memory-graph-grid {
    color: rgba(255, 255, 255, 0.05);
}
.memory-popup .stats {
    padding: 10px;
}
.memory-popup .stats .stat-label {
    font-size: 12px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 500;
}
.memory-popup .stats .stat-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.disk-widget {
    padding: 0 5px;
}
.disk-widget .icon {
    color: var(--sapphire);
    font-size: 13px;
}
.disk-widget .label {
    color: var(--text);
    font-weight: 500;
}
.disk-widget .label.status-low {
    color: var(--green);
}
.disk-widget .label.status-medium {
    color: var(--yellow);
}
.disk-widget .label.status-high {
    color: var(--peach);
}
.disk-widget .label.status-critical {
    color: var(--red);
}
.gpu-widget {
    padding: 0 5px;
}
.gpu-widget .icon {
    color: var(--pink);
    font-size: 13px;
}
.gpu-widget .label {
    color: var(--text);
    font-weight: 500;
}
.gpu-widget .label.status-low {
    color: var(--green);
}
.gpu-widget .label.status-medium {
    color: var(--yellow);
}
.gpu-widget .label.status-high {
    color: var(--peach);
}
.gpu-widget .label.status-critical {
    color: var(--red);
}
.gpu-popup {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 360px;
}
.gpu-popup .header .text {
    font-size: 15px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
    font-weight: 600;
    padding: 10px;
}
.gpu-popup .gpu-graph {
    color: var(--pink);
}
.gpu-popup .gpu-graph-grid {
    color: rgba(255, 255, 255, 0.05);
}
.gpu-popup .stats {
    padding: 10px;
}
.gpu-popup .stats .stat-label {
    font-size: 12px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 500;
}
.gpu-popup .stats .stat-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.brightness-widget {
    padding: 0 5px;
}
.brightness-widget .icon {
    color: var(--yellow);
    font-size: 14px;
}
.brightness-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 240px;
}
.brightness-slider {
    border: none;
}
.volume-widget {
    padding: 0 5px;
}
.volume-widget .icon {
    color: var(--teal);
    font-size: 14px;
    margin-right: 3px;
}
.volume-widget .label {
    font-weight: 500;
}
.volume-widget .label.muted, .volume-widget .icon.muted {
    color: var(--overlay0);
}
.audio-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 300px;
}
.audio-menu .system-volume-container .volume-slider {
    border: none;
}
.audio-menu .audio-container .device {
    background: transparent;
    border: none;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 12px;
    transition: background-color 0.1s ease;
}
.audio-menu .audio-container .device.selected {
    background-color: rgba(255, 255, 255, 0.1);
}
.audio-menu .audio-container .device:hover {
    background-color: rgba(255, 255, 255, 0.08);
}
.bluetooth-widget {
    padding: 0 5px;
}
.bluetooth-widget .icon {
    font-size: 15px;
    color: var(--blue);
}
.wifi-widget {
    padding: 0 5px;
}
.wifi-widget .icon {
    font-size: 15px;
    color: var(--sky);
}
.wifi-menu {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 10px;
    min-width: 360px;
}
.wifi-menu .header {
    font-family: "JetBrainsMono Nerd Font Propo";
    font-size: 13px;
    font-weight: 600;
    padding: 10px 12px;
    color: var(--text);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.wifi-menu .wifi-item {
    min-height: 36px;
    padding: 6px 10px;
    margin: 4px 6px;
    border-radius: 6px;
    transition: background-color 0.1s ease;
}
.wifi-menu .wifi-item:hover {
    background-color: rgba(255, 255, 255, 0.06);
}
.wifi-menu .wifi-item[active=true] {
    background-color: rgba(255, 255, 255, 0.1);
}
.wifi-menu .wifi-item .icon {
    font-family: "Segoe Fluent Icons";
    font-size: 22px;
    margin-right: 8px;
    color: var(--sky);
}
.wifi-menu .wifi-item .name {
    font-size: 13px;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 500;
}
.wifi-menu .wifi-item .connect {
    background-color: rgba(255, 255, 255, 0.12);
    padding: 4px 16px;
    border-radius: 5px;
    font-size: 12px;
    border: none;
    font-weight: 500;
    transition: all 0.12s ease;
}
.wifi-menu .wifi-item .connect:hover {
    background-color: rgba(255, 255, 255, 0.18);
}
.wifi-menu .footer {
    font-size: 11px;
    padding: 8px 12px;
    color: var(--overlay1);
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.open-meteo-widget {
    padding: 0 7px;
}
.open-meteo-widget .icon {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.85);
}
.open-meteo-widget .label {
    font-size: 13px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
    padding-left: 4px;
    font-weight: 500;
}
.open-meteo-card {
    background-color: rgba(24, 24, 37, 0.9);
    border: 1px solid rgba(180, 190, 254, 0.08);
    border-radius: 12px;
    min-width: 500px;
}
.open-meteo-card-today .label {
    font-size: 12px;
    color: var(--subtext0);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.open-meteo-card-today .label.location {
    font-size: 26px;
    font-weight: 700;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
}
.open-meteo-card-day {
    border: 1px solid var(--surface1);
    border-radius: 8px;
    background-color: transparent;
    padding: 8px;
}
.open-meteo-card-day.active {
    background-color: rgba(255, 255, 255, 0.05);
    border-color: var(--surface2);
}
.open-meteo-card-day:hover {
    background-color: rgba(255, 255, 255, 0.04);
}
.open-meteo-card-day .day-name {
    font-size: 11px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--overlay1);
    font-weight: 600;
}
.open-meteo-card-day .day-temp-max {
    font-size: 15px;
    font-weight: 700;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--text);
}
.open-meteo-card-day .day-temp-min {
    font-size: 12px;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--subtext0);
}
.open-meteo-card .hourly-container {
    background: transparent;
    border: none;
    min-height: 120px;
}
.open-meteo-card .hourly-data {
    font-size: 11px;
    font-weight: 700;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.open-meteo-card .hourly-data.temperature {
    background-color: var(--yellow);
}
.open-meteo-card .hourly-data.rain {
    background-color: var(--blue);
}
.open-meteo-card .hourly-data.snow {
    background-color: var(--sapphire);
}
.open-meteo-card .search-input {
    border: 1px solid var(--surface1);
    border-radius: 8px;
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
    font-size: 13px;
    padding: 8px 12px;
}
.open-meteo-card .search-input:focus {
    border-color: var(--lavender);
    background-color: rgba(255, 255, 255, 0.07);
}
.open-meteo-card .search-results {
    background: transparent;
    color: var(--text);
    font-size: 13px;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.open-meteo-card .search-results::item {
    padding: 6px 10px;
    border-radius: 6px;
    margin: 2px 6px;
    transition: background-color 0.1s ease;
}
.open-meteo-card .search-results::item:hover {
    background-color: rgba(255, 255, 255, 0.08);
}
.systray {
    background: transparent;
    border: none;
}
.systray .button {
    border-radius: 4px;
    padding: 2px;
}
.systray .button:hover {
    background: rgba(255, 255, 255, 0.1);
}
.systray .unpinned-visibility-btn {
    border-radius: 4px;
    height: 20px;
    width: 16px;
    border: none;
}
.systray .unpinned-visibility-btn:hover {
    background: rgba(255, 255, 255, 0.08);
}
.systray .label {
    color: --mauve;
}
.systray .icon {
    color: --mauve;
}
.systray .label.expanded {
    color: --mauve;
}
.power-menu-widget .label {
    color: var(--red);
    font-size: 14px;
}
.power-menu-overlay {
    background-color: rgba(0, 0, 0, 0.3);
}
.power-menu-overlay .uptime {
    font-size: 14px;
    margin-bottom: 12px;
    color: var(--overlay2);
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo";
}
.power-menu-popup {
    background-color: rgba(30, 30, 46, 0.9);
    padding: 28px;
    border-radius: 12px;
    border: 1px solid rgba(180, 190, 254, 0.1);
}
.power-menu-popup .profile-info {
    padding: 0 0 16px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 14px;
}
.power-menu-popup .profile-info .profile-username {
    font-size: 20px;
    font-weight: 600;
    color: var(--text);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.power-menu-popup .profile-info .profile-account-type {
    font-size: 12px;
    color: var(--overlay1);
    font-family: "JetBrainsMono Nerd Font Propo";
}
.power-menu-popup .button {
    padding: 0;
    min-width: 130px;
    max-width: 130px;
    min-height: 90px;
    border-radius: 10px;
    background-color: var(--surface0);
    border: 1px solid rgba(255, 255, 255, 0.06);
    margin: 6px;
}
.power-menu-popup .button.hover {
    background-color: var(--surface1);
    border-color: var(--lavender);
}
.power-menu-popup .button .label {
    font-size: 12px;
    font-weight: 600;
    font-family: "JetBrainsMono Nerd Font Propo";
    color: var(--subtext1);
    margin-bottom: 6px;
}
.power-menu-popup .button .icon {
    font-size: 28px;
    color: rgba(255, 255, 255, 0.25);
    padding-top: 6px;
}
.power-menu-popup .button.hover .label, .power-menu-popup .button.hover .icon {
    color: var(--text);
}
.power-menu-popup .button.cancel .icon {
    color: rgba(243, 139, 168, 0.5);
}
.power-menu-popup .button.cancel .label {
    color: var(--red);
}
.power-menu-popup .button.shutdown .icon {
    color: rgba(137, 180, 250, 0.5);
}
.power-menu-popup .button.shutdown .label {
    color: var(--blue);
}
.context-menu {
    background-color: var(--surface0);
    border: none;
    padding: 4px 0;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-size: 12px;
    color: var(--text);
}
.context-menu::item {
    background-color: transparent;
    padding: 5px 10px;
    margin: 2px 5px;
    border-radius: 4px;
    min-width: 90px;
}
.context-menu::item:selected {
    background-color: var(--surface1);
    color: var(--text);
}
.context-menu::item:checked {
    background-color: rgba(180, 190, 254, 0.2);
    color: var(--lavender);
}
.context-menu::item:pressed {
    background-color: var(--surface2);
}
.context-menu::separator {
    height: 1px;
    background-color: var(--surface1);
    margin: 3px 7px;
}
.context-menu::item:disabled {
    color: var(--overlay0);
}
QScrollBar:vertical {
    background-color: rgba(0, 0, 0, 0.2);
    width: 8px;
    border-radius: 4px;
}
QScrollBar:horizontal {
    background-color: rgba(0, 0, 0, 0.2);
    height: 8px;
    border-radius: 4px;
}
QScrollBar::handle {
    background-color: var(--surface2);
    border-radius: 4px;
}
QScrollBar::handle:hover {
    background-color: var(--overlay0);
}
QScrollBar::add-line, QScrollBar::sub-line {
    height: 0;
    width: 0;
}
QScrollBar::add-page, QScrollBar::sub-page {
    background: none;
}
.tooltip {
    background-color: var(--surface0);
    border: 1px solid var(--surface1);
    border-radius: 4px;
    color: var(--subtext1);
    padding: 5px 10px;
    font-size: 12px;
    font-family: "JetBrainsMono Nerd Font Propo";
    font-weight: 600;
    margin-top: 4px;
}
.recycle-bin-widget {
    padding: 0 0px;
    margin: 4px 2px;
    border-radius: 8px;
    transition: background-color 0.3s ease;
}
.recycle-bin-widget:hover {
    background-color: rgba(49, 50, 68, 0.6);
}
.recycle-bin-widget .icon {
    font-size: 16px;
    margin-right: 6px;
}
.recycle-bin-widget .label {
    color: var(--text);
    font-weight: 500;
}
.recycle-bin-widget .icon.bin-empty {
    color: var(--green);
}
.recycle-bin-widget .label.bin-empty {
    color: var(--subtext0);
}
.recycle-bin-widget .icon.bin-filled {
    color: var(--red);
}
.recycle-bin-widget .label.bin-filled {
    color: var(--lavender);
    font-weight: 700;
}
.recycle-bin-widget .label {
    text-shadow: 1px 1px 2px var(--crust);
}
.wallpapers-widget .icon {
    color: var(--mauve);
    font-size: 16px;
    padding: 0 8px;
}
.wallpapers-gallery {
    background-color: rgba(30, 30, 46, 0.85);
    border: 1px solid rgba(180, 190, 254, 0.1);
    border-radius: 12px;
}
.wallpapers-gallery .image-item:hover {
    border: 2px solid var(--lavender);
    border-radius: 20px;
}
.cava-widget {
    padding: 0;
    margin: 0;
}
.notification-dot {
    background-color: var(--red);
    border-radius: 50%;
    min-width: 6px;
    min-height: 6px;
    max-width: 6px;
    max-height: 6px;
}
.widget .widget-container:hover {
    background-color: rgba(255, 255, 255, 0.03);
}
.notes-menu .scroll-area QScrollBar:vertical {
    width: 6px;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
}
.notes-menu .scroll-area QScrollBar::handle {
    background-color: var(--surface2);
    border-radius: 3px;
}
.notes-menu .scroll-area QScrollBar::handle:hover {
    background-color: var(--overlay0);
}
.todo-menu .scroll-area QScrollBar:vertical {
    width: 6px;
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
}
.todo-menu .scroll-area QScrollBar::handle {
    background-color: var(--surface2);
    border-radius: 3px;
}
.todo-menu .scroll-area QScrollBar::handle:hover {
    background-color: var(--overlay0);
}
.github-widget .notification-dot {
    background-color: var(--red);
    border-radius: 50%;
    min-width: 6px;
    min-height: 6px;
    max-width: 6px;
    max-height: 6px;
}
.power-menu-popup .button {
    transition: all 0.15s ease;
}

Theme Config

# YASB Configuration
# GlazeWM | Catppuccin Mocha | Glazing Mocha
# Place this file at: C:/users/{username}/.config/yasb/config.yaml and you need to Replace {username} with your username and insert your wallpaper path at line 87

watch_stylesheet: true
watch_config: true
debug: false
update_check: true
show_systray: true

glazewm:
  start_command: "glazewm.exe start"
  stop_command: "glazewm.exe command wm-exit"
  reload_command: "glazewm.exe command wm-exit && glazewm.exe start"

bars:
  yasb-bar:
    screens: ['primary']
    class_name: "yasb-bar"
    alignment:
      position: "top"
      align: "center"
    blur_effect:
      enabled: true
      acrylic: true
      dark_mode: true
      round_corners: true
      border_color: "None"
    window_flags:
      always_on_top: false
      windows_app_bar: true
      hide_on_fullscreen: true
    dimensions:
      width: "100%"
      height: 36
    padding:
      top: 3
      left: 6
      bottom: 0
      right: 6
    animation:
      enabled: true
      duration: 500
    widgets:
      left:
        - "power_menu"
      # - "home_menu"
      # - "active_window"
        - "notes"
        - "todo"
        - "bin"
        - "ai_chat"
     #  - "cava"
        - "glazewm_workspaces"               
      
                
      center:
      # - "media" 
        - "cpu"
        - "gpu"
        - "pomodoro"
        - "memory"
        - "disk"
      # - "traffic"
        

      right:        
      # - "github   
        - "systray" 
        - "wallpapers"          
        - "brightness"        
        - "bluetooth"
        - "wifi"
        - "open_meteo"       
        - "volume"
        - "clock"
        - "notifications"
        

widgets:

  # ─── LEFT ───────────────────────────────────────────────────────────────────
  wallpapers:
    type: "yasb.wallpapers.WallpapersWidget"
    options:
      label: "<span>󰸉</span>"
      image_path: "C:/Essantials/Documents/Code/Win 11 Config/Wallpaper" # Set your path
      update_interval: 60
      gallery:
        enabled: true
        blur: true
        image_width: 420
        image_per_page: 4
        image_spacing: 10
        lazy_load: true
        lazy_load_delay: 10
        lazy_load_fadein: 200
        image_corner_radius: 20
        orientation: "portrait"
        enable_cache: true
      callbacks:
        on_left: "toggle_gallery"
        on_right: "toggle_label"

  cava:
    type: "yasb.cava.CavaWidget"
    options:
      bar_height: 12
      min_bar_height: 0
      gradient: 1
      foreground: "#89b4fa"
      gradient_color_1: '#74c7ec'
      gradient_color_2: '#89b4fa'
      gradient_color_3: '#cba6f7'
      bars_number: 8
      bar_spacing: 2
      bar_width: 4
      bar_type: "bars"
      framerate: 60
      hide_empty: true
  
  bin:
    type: "yasb.recycle_bin.RecycleBinWidget"
    options:
      label: "<span>{icon}</span>{items_count}"
      label_alt: "Items {items_count}, Total size ({items_size})"
      icons:
        bin_empty: "\udb82\ude7a"
        bin_filled: "\udb82\ude79"
      callbacks:
        on_left: 'exec "C:/Users/{username}/Desktop/file_explorer.lnk" shell:RecycleBinFolder'
        on_right: "empty_bin"
        on_middle: "do_nothing"
      show_confirmation: true
      label_shadow:
        enabled: true
        color: "black"
        radius: 3
        offset: [ 1, 1 ]

  glazewm_workspaces:
    type: "glazewm.workspaces.GlazewmWorkspacesWidget"
    options:
      offline_label: "GlazeWM Offline"
      hide_empty_workspaces: true
      hide_if_offline: false
      monitor_exclusive: true
      enable_scroll_switching: true
      animation: true

  active_window:
    type: "yasb.active_window.ActiveWindowWidget"
    options:
      label: "{win[title]}"
      label_alt: "[{win[process][name]}]"
      label_no_window: ""
      label_icon: true
      label_icon_size: 16
      max_length: 48
      max_length_ellipsis: "..."
      monitor_exclusive: true
      callbacks:
        on_left: "toggle_label"
        on_middle: "do_nothing"
        on_right: "do_nothing"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  home_menu:
    type: "yasb.home.HomeWidget"
    options:
      label: "<span>\udb81\udf17</span>"
      menu_list:
        - { title: "Home Folder", path: "~" }
        - { title: "Downloads", path: "~/Downloads" }
        - { title: "Documents", path: "~/Documents" }
        - { separator: true }
        - { title: "Windows Settings", uri: "ms-settings:" }
        - { title: "Task Manager", command: "taskmgr.exe" }
        - { separator: true }
        - { title: "Terminal", command: "wt.exe" }
      system_menu: true
      power_menu: true
      blur: true
      round_corners: true
      round_corners_type: "normal"
      border_color: "System"
      alignment: "left"
      direction: "down"
      offset_top: 6
      offset_left: 0

  # ─── CENTER ─────────────────────────────────────────────────────────────────

  clock:
    type: "yasb.clock.ClockWidget"
    options:
      label: "<span>\uf017</span> {%H:%M}"
      label_alt: "<span>\uf017</span> {%A, %d %B %Y}"
      locale: ""
      update_interval: 1000
      timezones: []
      tooltip: true
      calendar:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "system"
        alignment: "center"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_week_numbers: false
        show_years: true
        extended: false
      callbacks:
        on_left: "toggle_label"
        on_middle: "do_nothing"
        on_right: "toggle_calendar"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  media:
    type: "yasb.media.MediaWidget"
    options:
      label: "{title}{s}{artist}"
      label_alt: "{title}"
      separator: " - "
      hide_empty: true
      max_field_size:
        label: 22
        label_alt: 30
      show_thumbnail: true
      controls_only: false
      controls_left: true
      controls_hide: false
      thumbnail_alpha: 80
      thumbnail_padding: 8
      thumbnail_corner_radius: 12
      icons:
        prev_track: "\ue892"
        next_track: "\ue893"
        play: "\ue768"
        pause: "\ue769"
      media_menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "system"
        alignment: "center"
        direction: "down"
        offset_top: 6
        offset_left: 0
        thumbnail_corner_radius: 8
        thumbnail_size: 120
        show_source: true
      callbacks:
        on_left: "toggle_label"
        on_middle: "toggle_play_pause"
        on_right: "toggle_media_menu"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  pomodoro:
    type: "yasb.pomodoro.PomodoroWidget"
    options:
      label: "<span>{icon}</span> {remaining}"
      label_alt: "<span>{icon}</span> {session}/{total_sessions} - {status}"
      work_duration: 25
      break_duration: 5
      long_break_duration: 15
      long_break_interval: 4
      auto_start_breaks: true
      auto_start_work: true
      sound_notification: true
      show_notification: true
      hide_on_break: false
      session_target: 8
      icons:
        work: "\uf252"
        break: "\uf253"
        paused: "\uf254"
      menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "center"
        direction: "down"
        offset_top: 6
        offset_left: 0
        circle_background_color: "#1e1e2e"
        circle_work_progress_color: "#cba6f7"
        circle_break_progress_color: "#a6e3a1"
        circle_thickness: 8
        circle_size: 160
      callbacks:
        on_left: "toggle_menu"
        on_middle: "reset_timer"
        on_right: "toggle_label"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  notes:
    type: "yasb.notes.NotesWidget"
    options:
      label: "<span>\udb82\udd0c</span> {count}"
      label_alt: "{count} notes"
      menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "center"
        direction: "down"
        offset_top: 6
        offset_left: 0
        max_title_size: 150
        show_date_time: true
      icons:
        note: "\udb82\udd0c"
        delete: "\ueab8"
        copy: "\uebcc"
        float_on: "\udb84\udcac"
        float_off: "\udb84\udca9"
        close: "\uf00d"
      callbacks:
        on_left: "toggle_menu"
        on_middle: "do_nothing"
        on_right: "toggle_label"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  todo:
    type: "yasb.todo.TodoWidget"
    options:
      label: "<span>\uf0ae</span> {count}"
      label_alt: "<span>\uf0ae</span> {completed}/{count} done"
      menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "system"
        alignment: "center"
        direction: "down"
        offset_top: 6
        offset_left: 0
      icons:
        add: "\uf501 New Task"
        edit: "Edit"
        delete: "Delete"
        date: "\ue641"
        category: "\uf412"
        checked: "\udb80\udd34"
        unchecked: "\udb80\udd30"
        sort: "\ueab4"
        no_tasks: "\uf4a0"
      categories:
        default:
          label: "General"
        soon:
          label: "Complete soon"
        today:
          label: "End of day"
        urgent:
          label: "Urgent"
        important:
          label: "Important"
      callbacks:
        on_left: "toggle_menu"
        on_middle: "do_nothing"
        on_right: "toggle_label"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  ai_chat:
    type: "yasb.ai_chat.AiChatWidget"
    options:
      label: "<span>\uDB81\uDE74</span>"
      chat:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "system"
        alignment: "center"
        direction: "down"
        offset_left: 0
        offset_top: 6
      icons:
        attach: "\uf067"
        send: "\uf1d8"
        stop: "\uf04d"
        clear: "\uf1f8"
        assistant: "\udb81\ude74"
        float_on: "\udb84\udcac"
        float_off: "\udb84\udca9"
        close: "\uf00d"
        copy: "\uebcc"
        copy_check: "\uf00c"
      start_floating: false
      callbacks:
        on_left: "toggle_chat"
        on_middle: "do_nothing"
        on_right: "do_nothing"
      providers:
        - provider: "Ollama"
          api_endpoint: "http://localhost:11434/v1"
          credential: "ollama"
          models:
            - name: "qwen3.5:9b"
              label: "Qwen3.5"
              default: true
            - name : "qwen2.5-coder:1.5b-base"
              label: "qwen 2.5 coder"
            - name : "huihui_ai/qwen3.5-abliterated:9b"
              label: "Qwen 3.5 alt"            
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  # ─── RIGHT ──────────────────────────────────────────────────────────────────

  notifications:
    type: "yasb.notifications.NotificationsWidget"
    options:
      label: "<span>\udb80\udc9e</span> {count}"
      label_alt: "{count} notifications"
      hide_empty: true
      tooltip: true
      icons:
        new: "\udb80\udc9e"
        default: "\udb80\udc9a"
      callbacks:
        on_left: "toggle_notification"
        on_middle: "do_nothing"
        on_right: "toggle_label"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  github:
    type: "yasb.github.GithubWidget"
    options:
      label: "<span>\ueba1</span>"
      label_alt: "{data} Notifications"
      # token: "ghp_your_token_here"  # Or use env var YASB_GITHUB_TOKEN
      token: ""
      max_notification: 30
      only_unread: false
      update_interval: 300
      notification_dot:
        enabled: true
        corner: "top_right"
        color: "#f38ba8"
        margin: [0, 2]
      menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_categories: false
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  traffic:
    type: "yasb.traffic.TrafficWidget"
    options:
      label: "\ueab4 {download_speed} \ueab7 {upload_speed}"
      label_alt: "D: {session_downloaded}  U: {session_uploaded}"
      update_interval: 1000
      hide_if_offline: false
      speed_unit: "bits"
      hide_decimal: false
      menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "system"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_interface_name: true
        show_internet_info: true
      callbacks:
        on_left: "toggle_menu"
        on_middle: "do_nothing"
        on_right: "toggle_label"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  cpu:
    type: "yasb.cpu.CpuWidget"
    options:
      label: "<span>\uf4bc</span> {info[percent][total]}%"
      label_alt: "<span>\uf437</span> {info[freq][current]} MHz"
      update_interval: 2000
      cpu_thresholds:
        low: 25
        medium: 50
        high: 90
      histogram_icons:
        - "\u2581"
        - "\u2581"
        - "\u2582"
        - "\u2583"
        - "\u2584"
        - "\u2585"
        - "\u2586"
        - "\u2587"
        - "\u2588"
      histogram_num_columns: 8
      callbacks:
        on_left: "toggle_menu"
        on_middle: "do_nothing"
        on_right: "exec cmd /c Taskmgr"
      menu:
        enabled: true
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_graph: true
        show_graph_grid: false
        graph_history_size: 60
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  memory:
    type: "yasb.memory.MemoryWidget"
    options:
      label: "<span>\uefc5</span> {virtual_mem_percent}%"
      label_alt: "<span>\uefc5</span> {virtual_mem_used}/{virtual_mem_total}"
      update_interval: 5000
      memory_thresholds:
        low: 25
        medium: 50
        high: 90
      callbacks:
        on_left: "toggle_menu"
        on_middle: "do_nothing"
        on_right: "toggle_label"
      menu:
        enabled: true
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_graph: true
        show_graph_grid: false
        graph_history_size: 60
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  disk:
    type: "yasb.disk.DiskWidget"
    options:
      label: "<span>\uf473</span> {space[used][percent]}"
      label_alt: "<span>\uf473</span> {space[used][gb]} / {space[total][gb]}"
      volume_label: "C"
      update_interval: 60
      disk_thresholds:
        low: 50
        medium: 75
        high: 90
      group_label:
        volume_labels: ["C"]
        show_label_name: true
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
      callbacks:
        on_left: "toggle_label"
        on_middle: "do_nothing"
        on_right: "exec cmd /c start \"\" \"C:/Users/{username}/Desktop/wiztree.lnk\""
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  gpu:
    type: "yasb.gpu.GpuWidget"
    options:
      label: "<span>\udb81\udd03</span> {info[utilization]}%"
      label_alt: "<span>\udb81\udd03</span> {info[temp]}°C | {info[mem_used]}"
      gpu_index: 0
      update_interval: 2000
      gpu_thresholds:
        low: 25
        medium: 50
        high: 90
      callbacks:
        on_left: "toggle_menu"
        on_middle: "do_nothing"
        on_right: "toggle_label"
      menu:
        enabled: true
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_graph: true
        show_graph_grid: false
        graph_history_size: 60
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  brightness:
    type: "yasb.brightness.BrightnessWidget"
    options:
      label: "<span>{icon}</span>"
      label_alt: "Brightness {percent}%"
      tooltip: true
      hide_unsupported: true
      brightness_toggle_level: [0, 50, 100]
      brightness_icons:
        - "\udb80\udcde"
        - "\udb80\udcdd"
        - "\udb80\udcdf"
        - "\udb80\udce0"
      brightness_menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
      callbacks:
        on_left: "toggle_label"
        on_middle: "do_nothing"
        on_right: "toggle_brightness_menu"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  volume:
    type: "yasb.volume.VolumeWidget"
    options:
      label: "<span>{icon}</span> {level}"
      label_alt: "Vol {volume}"
      volume_icons:
        - "\ueee8"
        - "\uf026"
        - "\uf027"
        - "\uf027"
        - "\uf028"
      scroll_step: 2
      slider_beep: false
      tooltip: true
      audio_menu:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "system"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
        show_apps: true
        show_app_labels: false
        show_app_icons: true
        show_apps_expanded: false
      callbacks:
        on_left: "toggle_volume_menu"
        on_middle: "do_nothing"
        on_right: "toggle_mute"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  bluetooth:
    type: "yasb.bluetooth.BluetoothWidget"
    options:
      label: "<span>{icon}</span>"
      label_alt: "{device_name}"
      label_no_device: "No devices"
      label_device_separator: ", "
      tooltip: true
      icons:
        bluetooth_on: "\udb80\udcaf"
        bluetooth_off: "\udb80\udcb2"
        bluetooth_connected: "\udb80\udcb1"
      callbacks:
        on_left: "toggle_label"
        on_right: "exec cmd.exe /c start ms-settings:bluetooth"
        on_middle: "do_nothing"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  wifi:
    type: "yasb.wifi.WifiWidget"
    options:
      label: "<span>{wifi_icon}</span>"
      label_alt: "{wifi_name} {wifi_strength}%"
      update_interval: 5000
      wifi_icons:
        - "\udb82\udd2e"
        - "\udb82\udd1f"
        - "\udb82\udd22"
        - "\udb82\udd25"
        - "\udb82\udd28"
      ethernet_icon: "\ueba9"
      ethernet_label: "<span>{wifi_icon}</span>"
      ethernet_label_alt: "<span>{wifi_icon}</span> {ip_addr}"
      hide_if_ethernet: true
      get_exact_wifi_strength: false
      callbacks:
        on_left: "toggle_label"
        on_middle: "exec cmd.exe /c start ms-settings:network"
        on_right: "toggle_menu"
      menu_config:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "System"
        alignment: "right"
        direction: "down"
        offset_top: 6
        offset_left: 0
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200

  open_meteo:
    type: "yasb.open_meteo.OpenMeteoWidget"
    options:
      label: "<span>{icon}</span> {feelslike}"
      label_alt: "{location}: {min_temp}↓ {max_temp}↑"
      tooltip: true
      update_interval: 600
      hide_decimal: true
      units: "metric"
      callbacks:
        on_left: "toggle_label"
        on_middle: "do_nothing"
        on_right: "toggle_card"
      animation:
        enabled: true
        type: "fadeInOut"
        duration: 200
        
      weather_card:
        blur: true
        round_corners: true
        round_corners_type: "normal"
        border_color: "none"
        alignment: "right"
        direction: "down"
        icon_size: 48
        show_hourly_forecast: true
        time_format: "12h"
        hourly_point_spacing: 76
        hourly_icon_size: 24
        icon_smoothing: true
        temp_line_width: 2
        current_line_color: "#8EAEE8"
        current_line_width: 1
        current_line_style: "dot"
        hourly_gradient:
          enabled: false
          top_color: "#8EAEE8"
          bottom_color: "#2A3E68"
        hourly_forecast_buttons:
          enabled: true
          default_view: "temperature"
          temperature_icon: "\udb81\udd99"
          rain_icon: "\udb81\udd96"
          snow_icon: "\udb81\udd98"
        weather_animation:
          enabled: false
          snow_overrides_rain: true
          temp_line_animation_style: both
          rain_effect_intensity: 1.0
          snow_effect_intensity: 1.0
          scale_with_chance: true
      label_shadow:
        enabled: true
        color: "black"
        radius: 3
        offset: [1, 1]      

  systray:
    type: "yasb.systray.SystrayWidget"
    options:
      class_name: "systray"
      label_collapsed: "\udb81\udfc3"
      label_expanded: "\udb81\udf98"
      label_position: "left"
      icon_size: 16
      pin_click_modifier: "alt"
      show_unpinned: true
      show_unpinned_button: true
      show_battery: false
      show_volume: false
      show_network: true
      tooltip: true

  power_menu:
    type: "yasb.power_menu.PowerMenuWidget"
    options:
      label: "<span>\uf011</span>"
      uptime: true
      show_user: true
      blur: false
      blur_background: true
      animation_duration: 120
      button_row: 3
      profile_image_size: 80
      buttons:
        lock: ["\uea75", "Lock"]
        sleep: ["\u23fe", "Sleep"]
        restart: ["\uead2", "Restart"]
        shutdown: ["\uf011", "Shut Down"]
        signout: ["\udb80\udf43", "Sign out"]
        cancel: ["\udb81\udf3a", "Cancel"]

Readme

Error
Body is too long (maximum is 65536 characters)

[github-actions]

Thank you for your contribution! 🎉

Your theme has been successfully submitted. The maintainers will review it and get back to you soon.

Here are some details about your submission:

• Your theme has been requested into this PR.
• It has been created into the create-theme-285 branch.

If you have any questions or need help, feel free to ask in the comments below or in the PR.

[Somrat10369]

🌙 Glazing Mocha — YASB Status Bar Theme

A dark, minimal, glass-and-grain status bar experience powered by Catppuccin Mocha.

---

✨ Preview

Screenshots from the config showcase:

Widget	Preview
Yasb Bar
AI Chat
Memory Popup
Notes
Todo

---

🎨 Design Philosophy

Glazing Mocha is a carefully crafted YASB theme built around the [Catppuccin Mocha](https://github.com/catppuccin/catppuccin) palette. Every widget breathes with:

• 🌑 Deep, translucent backgrounds using rgba layering
• ✨ Acrylic blur effects on the bar and all popups
• 💜 Lavender and mauve accent highlights
• 🔤 JetBrainsMono Nerd Font Propo at 12–13px for crisp monospace readability
• 🌈 Semantic color states: green → yellow → peach → red for system metrics
• ✨ Smooth fadeInOut animations on every widget interaction

---

🧩 Widget Lineup

Left Side

Widget	Description
⚡ Power Menu	Full-screen power overlay with user profile
📝 Notes	Floating note-taking with rich text support
✅ Todo	Task manager with categories (Urgent, Important, Soon, Today)
🗑️ Recycle Bin	Live item count with fill/empty icons
🤖 AI Chat	Ollama-powered local LLM chat (Qwen 3.5, Qwen Coder)
⭕ GlazeWM Workspaces	Tiling WM workspace switcher with scroll support

Center

Widget	Description
🧠 CPU	Usage % with graph popup and Task Manager shortcut
🎮 GPU	GPU utilization with temp popup (index 0)
🍅 Pomodoro	Timer with circular progress menu, work/break indicators
💾 Memory	RAM usage % with graph popup
💿 Disk	C: drive usage with threshold color states

Right Side

Widget	Description
🔔 Notifications	Windows notification count with badge
🔧 Systray	Collapsible system tray with pin-click modifier
🖼️ Wallpapers	Gallery picker (4 per page, portrait, lazy-load)
☀️ Brightness	Toggle slider with icon levels
📶 Bluetooth	Connected device name with Settings shortcut
🌐 WiFi	Signal strength icon, hides when Ethernet active
🌤️ Weather	Open-Meteo widget (no API key needed) with hourly card
🔊 Volume	Level + mute with per-app audio sliders
🕐 Clock	HH:MM with calendar popup on right-click

---

🛠️ Requirements

• [YASB](https://github.com/amnweb/yasb) — Yet Another Status Bar
• [GlazeWM](https://github.com/glzr-io/glazewm) — Tiling window manager
• [Ollama](https://ollama.com/) — Local AI (for AI Chat widget)
• [JetBrainsMono Nerd Font Propo](https://github.com/ryanoasis/nerd-fonts/releases/latest/download/JetBrainsMono.zip)
• Windows 11 (for acrylic blur and round corners)

---

🚀 Installation

1. Clone or download this config
2. Copy config.yaml and styles.css to:

   C:/Users/{username}/.config/yasb/
   

3. Update the wallpaper path in config.yaml:

   image_path: "C:/path/to/your/Wallpapers"

4. Replace {username} in any paths with your Windows username
5. Start YASB:

   yasbc start

---

⚙️ Customization

Change AI Provider

Edit the ai_chat widget's providers block to add OpenAI, GitHub Copilot, or any OpenAI-compatible API.

Change Disk Volume

Update volume_label: "C" in the disk widget to your preferred drive letter.

GitHub Notifications

Uncomment the github widget and set your token (or use YASB_GITHUB_TOKEN env var).

Weather Location

The Open-Meteo widget auto-detects location via its built-in geocoder — click the widget to set your city.

---

🎨 Color Palette

All colors are defined as CSS variables for easy customization:

--base:     #1e1e2e   /* Background */
--lavender: #b4befe   /* Primary accent */
--mauve:    #cba6f7   /* Purple highlight */
--blue:     #89b4fa   /* Info / links */
--green:    #a6e3a1   /* Success / low usage */
--yellow:   #f9e2af   /* Warning / medium usage */
--peach:    #fab387   /* Caution / high usage */
--red:      #f38ba8   /* Critical / error */
--teal:     #94e2d5   /* Volume / secondary accent */

---

📜 License

MIT — use freely, credit appreciated.

---

Made with 💜 and Catppuccin Mocha  •  Powered by YASB

[amnweb]

@Somrat10369 thanks for the themes, can you please open another issue and submit the same theme, but please clean up the README because GitHub has some limitations, the maximum is 65536 characters, so make the README cleaner, you can also remove Installation instruction since this theme will be installed from the YASB theme gallery app, also please clean up config.yaml and remove all unused keys and new lines so we can have a clean config here,
Thanks

[Somrat10369]

@amnweb thanks for your suggetions. I have:

• Decluttered the config.yaml of unused widgets
• Minified and structured the styles.css
• Removed the redundant installation section and clean uped the readme

I resubmitted the theme . you can find it here Add theme: Glazing Mocha
#288

Also, i have a pr at amnweb/yasb#847 for a few icon changes in the wiki.

[Somrat10369]

Update:
@amnweb firstly im extremely sorry to inform you that there was a indentation error in the #288 . I’ve been copying the code directly from my local repo's raw view into the issue form, but for some reason, GitHub is altering the indentation in the final post. It looks perfect on my end, so there seems to be a discrepancy during the copy-paste process. I tried to copy-paste from my editor to the form but it also alters the format #290 . You can find my repo with correct indentation Here

I’m currently looking for a solution but haven't found the cause yet. I would appreciate any insight or feedback you might have on this.

[amnweb]

Yeah, there is a problem currently with the workflow when you post a YAML config which includes new lines, the workflow will write a bad file, you can simply remove all new lines and it should be fine, or I will change it if you want.