From 85a32b4df60c66a2f31ec534523be4b9da8822c9 Mon Sep 17 00:00:00 2001
From: CGH0S7 <jasoncheng@hifuu.ink>
Date: Fri, 23 Jan 2026 19:43:32 +0800
Subject: [PATCH] Switch to minimalist monochrome theme for better focus

- Replace colorful Catppuccin theme with subtle grayscale palette
- Unify waybar modules with consistent gray backgrounds
- Reduce visual distraction while maintaining all information
- Keep accent colors only for critical states (warnings, errors)
- Update sway window borders to match minimalist aesthetic

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 config           |  57 +++++++----------
 waybar/style.css | 155 +++++++++++++++++++++++++----------------------
 2 files changed, 106 insertions(+), 106 deletions(-)

diff --git a/config b/config
index 4c26a02..5b925a7 100644
--- a/config
+++ b/config
@@ -21,7 +21,7 @@ set $right l
 set $term foot
 # Your preferred application launcher
 #set $menu wmenu-run
-set $menu "wofi -show drun"
+set $menu "wofi --show drun"
 set $browser firefox
 
 # ... (previous config)
@@ -38,40 +38,29 @@ default_border pixel 2
 default_floating_border pixel 2
 hide_edge_borders smart
 
-# Colors (Catppuccin Mocha Inspired)
-set $rosewater #f5e0dc
-set $flamingo #f2cdcd
-set $pink #f5c2e7
-set $mauve #cba6f7
-set $red #f38ba8
-set $maroon #eba0ac
-set $peach #fab387
-set $yellow #f9e2af
-set $green #a6e3a1
-set $teal #94e2d5
-set $sky #89dceb
-set $sapphire #74c7ec
-set $blue #89b4fa
-set $lavender #b4befe
-set $text #cdd6f4
-set $subtext1 #bac2de
-set $subtext0 #a6adc8
-set $overlay2 #9399b2
-set $overlay1 #7f849c
-set $overlay0 #6c7086
-set $surface2 #585b70
-set $surface1 #45475a
-set $surface0 #313244
-set $base #1e1e2e
-set $mantle #181825
-set $crust #11111b
+# Colors (Minimalist Monochrome)
+set $base #1a1a1a
+set $mantle #151515
+set $crust #0f0f0f
+set $text #e0e0e0
+set $subtext1 #c0c0c0
+set $subtext0 #b0b0b0
+set $surface2 #404040
+set $surface1 #333333
+set $surface0 #2a2a2a
+set $overlay2 #707070
+set $overlay1 #606060
+set $overlay0 #505050
+set $accent #888888
+set $warning #d4a574
+set $critical #c47878
 
-# class                 border  backgr. text    indicator child_border
-client.focused          $mauve  $base   $text   $rosewater $mauve
-client.focused_inactive $overlay0 $base $text   $rosewater $overlay0
-client.unfocused        $overlay0 $base $text   $rosewater $overlay0
-client.urgent           $red    $base   $peach  $overlay0  $red
-client.placeholder      $overlay0 $base $text   $overlay0  $overlay0
+# class                 border    backgr.   text      indicator  child_border
+client.focused          $accent   $base     $text     $surface2  $accent
+client.focused_inactive $surface1 $base     $subtext0 $surface2  $surface1
+client.unfocused        $surface0 $base     $subtext0 $surface2  $surface0
+client.urgent           $critical $base     $text     $surface2  $critical
+client.placeholder      $surface0 $base     $subtext0 $surface0  $surface0
 client.background       $base
 
 ### Output configuration
diff --git a/waybar/style.css b/waybar/style.css
index 68df45f..1c43e58 100644
--- a/waybar/style.css
+++ b/waybar/style.css
@@ -1,47 +1,38 @@
-@define-color base   #1e1e2e;
-@define-color mantle #181825;
-@define-color crust  #11111b;
+/* Minimalist monochrome color scheme */
+@define-color base   #1a1a1a;
+@define-color mantle #151515;
+@define-color crust  #0f0f0f;
 
-@define-color text     #cdd6f4;
-@define-color subtext0 #a6adc8;
-@define-color subtext1 #bac2de;
+@define-color text     #e0e0e0;
+@define-color subtext0 #b0b0b0;
+@define-color subtext1 #c0c0c0;
 
-@define-color surface0 #313244;
-@define-color surface1 #45475a;
-@define-color surface2 #585b70;
+@define-color surface0 #2a2a2a;
+@define-color surface1 #333333;
+@define-color surface2 #404040;
 
-@define-color overlay0 #6c7086;
-@define-color overlay1 #7f849c;
-@define-color overlay2 #9399b2;
+@define-color overlay0 #505050;
+@define-color overlay1 #606060;
+@define-color overlay2 #707070;
 
-@define-color blue      #89b4fa;
-@define-color lavender  #b4befe;
-@define-color sapphire  #74c7ec;
-@define-color sky       #89dceb;
-@define-color teal      #94e2d5;
-@define-color green     #a6e3a1;
-@define-color yellow    #f9e2af;
-@define-color peach     #fab387;
-@define-color maroon    #eba0ac;
-@define-color red       #f38ba8;
-@define-color mauve     #cba6f7;
-@define-color pink      #f5c2e7;
-@define-color flamingo  #f2cdcd;
-@define-color rosewater #f5e0dc;
+/* Accent colors - only for critical states */
+@define-color accent    #888888;
+@define-color warning   #d4a574;
+@define-color critical  #c47878;
 
 * {
     border: none;
     border-radius: 0;
     font-family: "Maple Mono NF CN", "Font Awesome 7 Free", Roboto, Helvetica, Arial, sans-serif;
-    font-size: 14px;
+    font-size: 13px;
     min-height: 0;
 }
 
 window#waybar {
     background-color: transparent;
-    color: @surface0;
+    color: @text;
     transition-property: background-color;
-    transition-duration: .5s;
+    transition-duration: .3s;
 }
 
 window#waybar.hidden {
@@ -51,7 +42,7 @@ window#waybar.hidden {
 /* Workspaces */
 #workspaces {
     background-color: @surface1;
-    border-radius: 16px;
+    border-radius: 12px;
     margin-top: 4px;
     margin-bottom: 4px;
     padding: 0px 6px;
@@ -60,9 +51,10 @@ window#waybar.hidden {
 #workspaces button {
     padding: 0 10px;
     background-color: transparent;
-    color: @text;
-    border-radius: 16px;
+    color: @subtext0;
+    border-radius: 10px;
     margin: 4px 0;
+    transition: all 0.2s ease;
 }
 
 #workspaces button:hover {
@@ -71,34 +63,34 @@ window#waybar.hidden {
 }
 
 #workspaces button.focused {
-    color: @base;
-    background-color: @mauve;
+    color: @text;
+    background-color: @accent;
 }
 
 #workspaces button.urgent {
     color: @base;
-    background-color: @red;
+    background-color: @critical;
 }
 
 /* Window Title */
 #window {
     background-color: transparent;
-    color: @text;
-    border-radius: 16px;
+    color: @subtext1;
+    border-radius: 12px;
     padding: 0 12px;
     margin: 0 4px;
+    font-weight: 500;
 }
 
 /* Modules Right - Grouped look */
 .modules-right {
     margin-top: 4px;
     margin-bottom: 4px;
-    /* background-color: @base; */
-    border-radius: 16px;
+    border-radius: 12px;
     padding: 0 2px;
 }
 
-/* Individual Module Styling */
+/* Individual Module Styling - Unified monochrome design */
 #clock,
 #battery,
 #cpu,
@@ -111,37 +103,49 @@ window#waybar.hidden {
 #tray,
 #mpd,
 #idle_inhibitor {
-    padding: 0 12px;
-    margin: 0 4px;
-    color: @text; /* Changed to @text for better contrast with @surface1 and consistency */
-    background-color: @surface1; /* Changed to @surface1 */
-    border-radius: 16px;
+    padding: 0 10px;
+    margin: 0 3px;
+    color: @text;
+    background-color: @surface1;
+    border-radius: 10px;
+    transition: background-color 0.2s ease;
 }
 
-/* Specific Module Colors */
+#clock:hover,
+#battery:hover,
+#cpu:hover,
+#memory:hover,
+#temperature:hover,
+#backlight:hover,
+#network:hover,
+#pulseaudio:hover {
+    background-color: @surface2;
+}
+
+/* Specific Module Colors - Minimalist approach */
 #clock {
-    background-color: @mauve;
-    color: @base;
-    font-weight: bold;
+    background-color: @surface2;
+    color: @text;
+    font-weight: 600;
 }
 
 #battery {
-    background-color: @green;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #battery.charging, #battery.plugged {
-    background-color: @teal;
-    color: @base;
+    background-color: @surface2;
+    color: @text;
 }
 
 #battery.warning:not(.charging) {
-    background-color: @peach;
+    background-color: @warning;
     color: @base;
 }
 
 #battery.critical:not(.charging) {
-    background-color: @red;
+    background-color: @critical;
     color: @base;
     animation-name: blink;
     animation-duration: 0.5s;
@@ -151,41 +155,43 @@ window#waybar.hidden {
 }
 
 #cpu {
-    background-color: @sapphire;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #memory {
-    background-color: @sky;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #temperature {
-    background-color: @lavender;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #temperature.critical {
-    background-color: @red;
+    background-color: @critical;
+    color: @base;
 }
 
 #backlight {
-    background-color: @yellow;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #network {
-    background-color: @blue;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #network.disconnected {
     background-color: @overlay0;
+    color: @subtext0;
 }
 
 #pulseaudio {
-    background-color: @pink;
-    color: @base;
+    background-color: @surface1;
+    color: @text;
 }
 
 #pulseaudio.muted {
@@ -194,8 +200,8 @@ window#waybar.hidden {
 }
 
 #tray {
-    background-color: @peach;
-    color: @surface0;
+    background-color: @surface1;
+    color: @text;
 }
 
 #window.empty {
@@ -207,15 +213,20 @@ window#waybar.hidden {
     color: @text;
 }
 
+#idle_inhibitor {
+    background-color: @surface1;
+    color: @text;
+}
+
 #custom-power {
-    background-color: @red;
+    background-color: @critical;
     color: @base;
     padding-right: 16px;
 }
 
 @keyframes blink {
     to {
-        background-color: @text;
+        background-color: @overlay2;
         color: @base;
     }
 }