/* --- Hyprland palette --- */ @define-color base rgba(30, 30, 46, 1.0); @define-color inactive rgba(89, 89, 89, 0.667); @define-color blue rgba(51, 204, 255, 0.933); @define-color green rgba(0, 255, 153, 0.933); @define-color text rgba(255, 255, 255, 1.0); @define-color surface1 rgba(255, 255, 255, 0.08); @define-color subtext1 rgba(255, 255, 255, 0.35); @define-color red rgba(255, 0, 0, 0.90); @define-color yellow rgba(249, 226, 175, 1.0); @define-color overlay1 rgba(255, 255, 255, 0.55); /* Active “fill” shared by active workspace + overflow */ @define-color active_fill rgba(255, 255, 255, 0.05); * { font-family: Aporetic Sans Mono, Iosevka Nerd Font, Roboto, Helvetica, Arial, sans-serif; font-size: 13px; } window#waybar { background: transparent; background-color: transparent; color: @text; /* Helps prevent right-edge clipping of last module */ padding-right: 6px; padding-left: 6px; } /* ========================================================= * Workspaces (reduced height) * ========================================================= */ #workspaces button { /* Reduce height: keep vertical padding at 0 */ padding: 0px 4px; /* Your fixed width */ min-width: 80px; /* Reduce height further: smaller vertical margin */ margin: 0px 4px; background-color: transparent; color: @text; /* Keep border thin to reduce vertical footprint */ border: 1px solid @inactive; /* Smaller radius reduces “cut off” risk at top/bottom */ border-radius: 10px; box-shadow: none; } /* Hover: keep it subtle to avoid clipping */ #workspaces button:hover { background-color: rgba(255, 255, 255, 0.1); } /* ========================================================= * Active style (and overflow style) — identical visuals * * NOTE: Big glows get clipped by the bar height. * We keep the “gradient vibe” but reduce the blur radius. * ========================================================= */ #workspaces button.active, #custom-hyprscroll_overflow.overflow { font-weight: bold; padding: 0px 4px; min-width: 80px; margin: 0px 4px; color: @text; background-color: @active_fill; border: 1px dashed @active_fill; border-radius: 10px; /* Reduced glow to minimize top/bottom clipping */ box-shadow: 0 0 0 1px rgba(51, 204, 255, 0.55), 0 0 0 2px rgba(0, 255, 153, 0.4), 0 0 4px rgba(51, 204, 255, 0.18), 0 0 4px rgba(0, 255, 153, 0.14); } #workspaces button.active:hover, #custom-hyprscroll_overflow.overflow:hover { /* Keep hover glow but still small */ box-shadow: 0 0 0 1px rgba(51, 204, 255, 0.65), 0 0 0 2px rgba(0, 255, 153, 0.48), 0 0 6px rgba(51, 204, 255, 0.22), 0 0 6px rgba(0, 255, 153, 0.18); } /* Overflow: add permanent right padding (don’t do it only on hover, it clips) */ #custom-hyprscroll_overflow.overflow { padding-right: 10px; } /* ========================================================= * Notifications * ========================================================= */ #custom-notifications { margin: 0 4px; padding: 0 4px; min-width: 0; } #custom-notifications.empty { color: @overlay1; } #custom-notifications.unread { color: @yellow; } /* ========================================================= * Other modules spacing * ========================================================= */ #clock, #idle_inhibitor, #battery, #cpu, #memory, #temperature, #network, #pulseaudio, #tray { margin: 0 5px; padding: 0 2px; } #idle_inhibitor.activated { background-color: @green; } #battery.charging { color: @green; } @keyframes blink { to { background-color: #ffffff; color: black; } } #battery.warning:not(.charging) { color: white; animation: blink 0.5s linear infinite alternate; } #network.disconnected, #temperature.critical { background-color: @red; }