✨ ags(bar, notifications, control-center): add status icons to bar, notification history fixed, notification history below control-center

ags/style/_apps-window.scss

@@ -1,5 +1,43 @@
-.apps-window.container {
-  & > entry {
+@use "mixins";
+@use "colors";
 
+.apps-window-container {
+  padding: 24px;
+
+  & > entry {
+    background: rgba(colors.$bg-primary, .4);
+    padding: 10px 9px;
+    margin-bottom: 32px;
+    border-radius: 12px;
+    min-width: 350px;
+
+    &:focus {
+      box-shadow: inset 0 0 0 2px colors.$bg-secondary;
+    }
+
+    & image.left {
+      margin-right: 6px;
+    }
+  }
+
+  & flowbox {
+    padding: 16px 24px;
+
+    & > flowboxchild > button {
+      padding: 8px;
+      border-radius: 24px;
+
+      &:hover {
+        background: colors.$bg-translucent;
+      }
+
+      & icon {
+        font-size: 64px;
+      }
+
+      & label {
+        margin-top: 6px;
+      }
+    }
   }
 }

ags/style/_bar.scss

@@ -171,7 +171,7 @@
     }
   }
 
-  .audio {
+  .status {
     @include mixins.reset-props;
 
     &:hover > box,
@@ -211,13 +211,17 @@
         font-size: 12px;
       }
 
-      & .bell {
-        margin: 0 4px;
+      & .status-icons {
+        padding: 0 4px;
+
+        & > * {
+          margin: 0 4px;
+        }
       }
     }
   }
 
-  .logo {
+  .apps {
     & > box {
       border-radius: 12px;
       transition: 100ms linear;
@@ -225,7 +229,6 @@
 
       & > label {
         font-size: 14px;
-        margin-right: 1px;
       }
     }
     &:hover {

ags/style/_control-center.scss

@@ -66,6 +66,43 @@
   }
 }
 
+box.history {
+  margin-top: 10px;
+  background: colors.$bg-translucent;
+  border-radius: 24px;
+  padding: 20px 14px;
+
+  & scrollable viewport .notifications > eventbox {
+    & > box {
+      margin: 4px 0;
+    }
+
+    &:first-child {
+      & > box {
+        margin-top: 0;
+      }
+    }
+
+    &:last-child {
+      & > box {
+        margin-bottom: 0;
+      }
+    }
+  }
+
+  & > .button-row {
+    & button {
+      & label.nf {
+        font-size: 16px;
+      }
+      & label:not(.nf) {
+        font-size: 12px;
+        font-weight: 600;
+      }
+    }
+  }
+}
+
 .tiles-container {
   @include mixins.reset-props;
 
@@ -150,15 +187,16 @@
     font-weight: 500;
   }
 
-  &.bluetooth {
-    .connections button {
-      @include mixins.hover-shadow;
-      padding: 6px;
-      border-radius: 12px;
+  & button {
+    @include mixins.hover-shadow;
 
-      &.connected {
-        background: colors.$bg-tertiary;
-      }
+    padding: 6px;
+    border-radius: 12px;
+  }
+
+  &.bluetooth {
+    button.connected {
+      background: colors.$bg-tertiary;
     }
   }
 }

ags/style/_wal.scss

@@ -1,26 +1,26 @@
 // SCSS Variables
 // Generated by 'wal'
-$wallpaper: "/home/joaov/wallpapers/Miku Guitar.jpg";
+$wallpaper: "/home/joaov/wallpapers/Garden Kita.png";
 
 // Special
-$background: #171418;
-$foreground: #c5c4c5;
-$cursor: #c5c4c5;
+$background: #101212;
+$foreground: #c3c3c3;
+$cursor: #c3c3c3;
 
 // Colors
-$color0: #171418;
-$color1: #607985;
-$color2: #208FB6;
-$color3: #4C9CB4;
-$color4: #63ADC9;
-$color5: #C3B49C;
-$color6: #89BBCF;
-$color7: #96909b;
-$color8: #715c71;
-$color9: #6aa4bf;
-$color10: #62a5bc;
-$color11: #78b3c5;
-$color12: #90becf;
-$color13: #dac7ab;
-$color14: #a7cbd9;
-$color15: #c5c4c5;
+$color0: #101212;
+$color1: #778839;
+$color2: #6C965F;
+$color3: #B4B350;
+$color4: #96A460;
+$color5: #658388;
+$color6: #B0B493;
+$color7: #8e9898;
+$color8: #596d6d;
+$color9: #a3b757;
+$color10: #85c373;
+$color11: #c6c67a;
+$color12: #b7c67a;
+$color13: #6eb7c1;
+$color14: #ced59e;
+$color15: #c3c3c3;