diff --git a/modules/home/ags/app/style.scss b/modules/home/ags/app/style.scss
index 9e4d14c..d589338 100644
--- a/modules/home/ags/app/style.scss
+++ b/modules/home/ags/app/style.scss
@@ -17,3 +17,20 @@
padding: 4px 12px;
color: $base05;
}
+
+.ws {
+ min-width: 20px;
+ border-radius: 6px;
+ margin: 0 2px;
+ padding: 0 6px;
+}
+
+.ws.active {
+ background: $base0D;
+ color: $base00;
+}
+
+.clock {
+ font-weight: bold;
+ margin: 0 8px;
+}
diff --git a/modules/home/ags/app/widget/Bar.tsx b/modules/home/ags/app/widget/Bar.tsx
index b4a7fdf..6a31361 100644
--- a/modules/home/ags/app/widget/Bar.tsx
+++ b/modules/home/ags/app/widget/Bar.tsx
@@ -1,4 +1,6 @@
import { App, Astal, Gdk, Gtk } from "astal/gtk3"
+import Workspaces from "./Workspaces"
+import Clock from "./Clock"
export default function Bar(gdkmonitor: Gdk.Monitor) {
const { TOP, LEFT, RIGHT } = Astal.WindowAnchor
@@ -17,12 +19,16 @@ export default function Bar(gdkmonitor: Gdk.Monitor) {
className="bar-left"
halign={Gtk.Align.START}
valign={Gtk.Align.CENTER}
- />
+ >
+
+
+ >
+
+
+ GLib.DateTime.new_now_local().format("%I:%M %p")!.replace(/^0/, "")
+)
+
+export default function Clock() {
+ return
+}
diff --git a/modules/home/ags/app/widget/Workspaces.tsx b/modules/home/ags/app/widget/Workspaces.tsx
new file mode 100644
index 0000000..7d91321
--- /dev/null
+++ b/modules/home/ags/app/widget/Workspaces.tsx
@@ -0,0 +1,20 @@
+import Hyprland from "gi://AstalHyprland"
+import { bind } from "astal"
+
+const hypr = Hyprland.get_default()
+const focused = bind(hypr, "focused-workspace").as((ws) => ws?.id ?? -1)
+
+export default function Workspaces() {
+ return (
+
+ {[1, 2, 3, 4, 5].map((i) => (
+
+ ))}
+
+ )
+}