add(ags/bar): network section + tweak styles

ags/lib/utils.ts

@@ -60,4 +60,22 @@ export const skip = <T>(list: T[], items: number) => list.filter((_, i) => {
     if (items > (list.length - 1)) items = list.length;
 
     return i > (items - 1);
-});
+});
+
+export const toHumanReadable = (bytes: number, unit: string, fractionDigits = 1) => {
+    const div = 1024;
+    if (Math.abs(bytes) < div) {
+        return bytes.toFixed(fractionDigits) + unit;
+    }
+
+    const units = ["ki", "Mi", "Gi", "Ti"];
+    let u = -1;
+    const r = 10 ** fractionDigits;
+
+    while (Math.round(Math.abs(bytes) * r) / r >= div && u < units.length) {
+        bytes /= div;
+        u++;
+    }
+
+    return bytes.toFixed(fractionDigits) + units[u] + unit;
+}

ags/lib/widgets/separator.tsx

@@ -0,0 +1,8 @@
+import { Gio } from "astal";
+
+export default function Separator() {
+    return <image
+        cssClasses={["separator"]}
+        gicon={Gio.Icon.new_for_string("switch-on-symbolic")}
+    />
+}