fix(ags): set margins

modules/user/packages/drvs/ags/.gitignore

@@ -0,0 +1,2 @@
+accent.css
+colors.scss

modules/user/packages/drvs/ags/style.scss

@@ -3,17 +3,23 @@
 
 $radius: 10px;
 
-%item {
+* {
     all: unset;
+}
+
+%item {
     background: $bg;
     border-radius: $radius;
-    padding: 4px;
+    padding: 6px 8px;
 
-    & + &, .item + & { margin-left: 4px; }
+    & + &, .item + &, & + .item  { margin-left: 4px; }
 
-    label { margin: 0 8px; }
+    icon + label { margin-left: 4px; }
 }
 
+.item + .item { margin-left: 4px; }
+
+
 window.Bar {
     border: none;
     box-shadow: none;
@@ -28,8 +34,6 @@ window.Bar {
 
     .Workspaces  {
         button {
-            all: unset;
-
             &:hover label {
                 background: $surface0;
                 color: $accent;
@@ -59,12 +63,12 @@ window.Bar {
     .Layout.en { color: $accent; }
 
     .SysTray button {
-        all: unset;
+        padding: 4px;
-        padding: 8px;
         border-radius: inherit;
 
         &:hover {
             background: $surface0;
+            border-radius: 4px;
         }
     }
 
@@ -82,16 +86,17 @@ window.Bar {
         }
     }
 
-    .Battery label {
-        padding-left: 0;
-        margin-left: 0;
-    }
-
-    .Time { padding: 0 8px; }
-
-    .AudioSlider icon { margin-left: 8px; }
-
     .Workspaces, .Wifi, .Layout, .Media, .SysTray, .AudioSlider, .Battery, .Time {
         @extend %item;
     }
+
+    .Wifi, .AudioSlider {
+        &, button {
+            &:hover { background-color: $surface0; }
+            &:active {
+                background-color: $accent;
+                color: $bg;
+            }
+        }
+    }
 }

modules/user/packages/drvs/ags/widget/elements/Wifi.tsx

@@ -6,7 +6,9 @@ export default function Wifi() {
     const network = Network.get_default()
     const wifi = bind(network, "wifi")
 
-    return <box visible={wifi.as(Boolean)}>
+    return <box
+            visible={wifi.as(Boolean)}
+            className="item">
         {wifi.as(wifi => wifi && (
             <button
                 className="Wifi"