catppuccin

modules/wm/hyprland/config/eww/eww.scss

@@ -1,106 +1,92 @@
+$base: #24273a;
+$text: #cad3f5;
+$pink: #f5bde6;
+$mauve: #c6a0f6;
+$red: #ed8796;
+$maroon: #ee99a0;
+$peach: #f5a97f;
+$yellow: #eed49f;
+$green: #a6da95;
+$teal: #8bd5ca;
+$sky: #91d7e3;
+$sapphire: #7dc4e4;
+$blue: #8aadf4;
+$lavender: #b7bdf8;
+$text: #cad3f5;
+$subtext1: #b8c0e0;
+$subtext0: #a5adcb;
+$overlay2: #939ab7;
+$overlay1: #8087a2;
+$overlay0: #6e738d;
+$surface2: #5b6078;
+$surface1: #494d64;
+$surface0: #363a4f;
+$base: #24273a;
+$mantle: #1e2030;
+$crust: #181926;
+
+$border-radius: 10px;
+
 * {
   all: unset;
   font-family: "JetBrains Mono";
 }
-// WINDOW RELATED CSS
+
 window {
-  background: #2e3440;
-  color: #ebcb8b;
-  border-radius: 1rem;
-  border: 3px solid #80A0C0;
+  background: $base;
+  color: $text;
+  border-radius: $border-radius;
+  border: 3px solid $lavender;
 }
 
-// MISC EDITING
 .uinfo {
   font-size: 1.25rem;
 }
+
 .cpu {
   padding: 19px 1px;
 }
 
-// METRIC LOOKS
 .metric scale trough highlight {
   all: unset;
-  color: #000000;
-  background: linear-gradient(90deg, #88c0d0 0%, #81a1c1  50%, #5E81ac 100%);
-  //border-radius: 10px;
+  color: $text;
+  background: linear-gradient(90deg, $lavender 0%, $mauve 100%);
+  border-radius: $border-radius;
 }
+
 .metric scale trough {
   all: unset;
-  background-color: #545454;
-  //border-radius: 50px;
+  background-color: $surface0;
   min-height: 10px;
   min-width: 100px;
   margin-left: 10px;
   margin-right: 5px;
+  border-radius: $border-radius;
 }
 
-.metric .label {
-  color: #B48EAD;
-  font-size: 1.5rem;
-}
-
-// POWERMENU
 .power {
   padding: 0px 9px;
 }
 
-// WIDGET MISC SETTINGS
-
 .quote-text {
   padding: 15px;
   font-size: 1rem;
   font-style: italic;
   font-weight: 600;
-  color: #BF616A;
+  color: $lavender;
 }
 
-.cal {
-  color: #8fbcbb;
-  padding: 5px;
-  padding-bottom: 1px;
+// --- Uinfo styling ---
+.uinfo-host {
+  color: $lavender;
+  font-style: italic;
 }
 
-.small-date {
-  font-weight: 700;
+.uinfo-hr {
+  color: $mauve;
+  font-weight: bold;
 }
 
-// Search App CSS
-.searchapps-bar {
-  color: #88c0d0;
-  font-size: 1.5rem;
-  margin: -2px;
-  padding: 30px 90px 30px 90px;
-  background-color: #1E222A;
-  border: 6px solid #80A0C0;
-}
-.search-bar {
-  color: #88c0d0;
-}
-.search-label {
-  font-family: "Iosevka";
-  font-size: 2rem;
-  font-weight: 700;
-  padding-right: 20px;
-}
-.app-container {
-  margin: -2px;
-  font-size: 1.25rem;
-  padding: 30px;
-  color: #88c0d0;
-}
-.item {
-  padding: 10px;
-  background: rgba(10,10,10,0.4);
-}
-
-.label-control {
-  color: #81a1c1;
-  font-size: 1.5rem;
-  padding: 15px;
-}
-
-.controls {
-  font-size: 2rem;
-  padding-bottom: 20px;
+.uinfo-date, .uinfo-ws, .uinfo-win, .uinfo-time {
+  color: $lavender;
 }