✨ ags: optimizations, add media and separator widgets

ags/style/_bar.scss

@@ -40,10 +40,23 @@
       }
     }
   }
+
   & > .bar-centerbox > * {
     background: rgba($color: wal.$background, $alpha: .6);
     padding: 6px;
     border-radius: 18px;
+
+    & > * {
+      margin: 0 2px;
+
+      &:first-child {
+        margin-left: 0;
+      }
+
+      &:last-child {
+        margin-right: 0;
+      }
+    }
   }
 }
 
@@ -104,6 +117,19 @@
   }
 }
 
+.media-eventbox {
+  & > .media > box {
+    border-radius: 12px;
+    background: wal.$color2;
+    padding: 0 6px;
+
+    & .icon {
+      margin-right: 6px;
+      font-size: 14px;
+    }
+  }
+}
+
 .tray {
   padding: 0 6px;
 

ags/style/_wal.scss

@@ -1,26 +1,26 @@
 // SCSS Variables
 // Generated by 'wal'
-$wallpaper: "/home/joaov/wallpapers/Bocchi The Rock!.png";
+$wallpaper: "/home/joaov/wallpapers/Garden Kita.png";
 
 // Special
-$background: #0a0a0c;
-$foreground: #c1c1c2;
-$cursor: #c1c1c2;
+$background: #101212;
+$foreground: #c3c3c3;
+$cursor: #c3c3c3;
 
 // Colors
-$color0: #0a0a0c;
-$color1: #935d6d;
-$color2: #967e84;
-$color3: #ac8486;
-$color4: #bcae7a;
-$color5: #a49c9c;
-$color6: #bcb79c;
-$color7: #8a8a96;
-$color8: #565669;
-$color9: #C57C92;
-$color10: #C9A9B0;
-$color11: #E6B1B3;
-$color12: #FBE8A3;
-$color13: #DBD1D0;
-$color14: #FBF5D1;
-$color15: #c1c1c2;
+$color0: #101212;
+$color1: #59662a;
+$color2: #517047;
+$color3: #87863c;
+$color4: #707b48;
+$color5: #4b6266;
+$color6: #84876e;
+$color7: #8e9898;
+$color8: #596d6d;
+$color9: #778839;
+$color10: #6C965F;
+$color11: #B4B350;
+$color12: #96A460;
+$color13: #658388;
+$color14: #B0B493;
+$color15: #c3c3c3;