From 3ddc75029cdc9dfeb78fb4d124c3e5ef62e2e42a Mon Sep 17 00:00:00 2001
From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>
Date: Tue, 18 Feb 2025 22:40:03 +1100
Subject: bar: better datetime for vertical mode

---
 src/modules/bar.tsx | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/modules/bar.tsx b/src/modules/bar.tsx
index 33a5a9b..55a0102 100644
--- a/src/modules/bar.tsx
+++ b/src/modules/bar.tsx
@@ -516,9 +516,22 @@ const DateTime = () => (
     <button
         onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")}
     >
-        <box vertical={config.vertical} className="module date-time">
+        <box className="module date-time">
             <label className="icon" label="calendar_month" />
-            <label angle={config.vertical ? 270 : 0} label={bindCurrentTime(config.dateTimeFormat)} />
+            <label label={bindCurrentTime(config.dateTimeFormat)} />
+        </box>
+    </button>
+);
+
+const DateTimeVertical = () => (
+    <button
+        onClick={(self, event) => event.button === Astal.MouseButton.PRIMARY && togglePopup(self, event, "sideright")}
+        setup={self => setupCustomTooltip(self, bindCurrentTime(config.dateTimeFormat))}
+    >
+        <box vertical className="module date-time">
+            <label className="icon" label="calendar_month" />
+            <label label={bindCurrentTime("%H")} />
+            <label label={bindCurrentTime("%M")} />
         </box>
     </button>
 );
@@ -571,7 +584,7 @@ export default ({ monitor }: { monitor: Monitor }) => (
                 <PkgUpdates />
                 <NotifCount />
                 {AstalBattery.get_default().isBattery && <Battery />}
-                <DateTime />
+                {config.vertical ? <DateTimeVertical /> : <DateTime />}
                 <Power />
             </box>
         </centerbox>
-- 
cgit v1.2.3-freya