From 22586bfcc0a109a1ad110e419230d602ad406b51 Mon Sep 17 00:00:00 2001
From: SiriusXT <1160925501@qq.com>
Date: Sun, 1 Jun 2025 16:18:54 +0800
Subject: [PATCH] feat(insert time): Add configurable date/time format for
 Alt+T shortcut

---
 .../options/text_notes/date_time_format.ts    | 38 +++++++------------
 1 file changed, 13 insertions(+), 25 deletions(-)

diff --git a/apps/client/src/widgets/type_widgets/options/text_notes/date_time_format.ts b/apps/client/src/widgets/type_widgets/options/text_notes/date_time_format.ts
index aeace6939..5728ac8b4 100644
--- a/apps/client/src/widgets/type_widgets/options/text_notes/date_time_format.ts
+++ b/apps/client/src/widgets/type_widgets/options/text_notes/date_time_format.ts
@@ -7,34 +7,22 @@ import linkService from "../../../.././services/link.js";
 
 const TPL = /*html*/`
 <div class="options-section">
-  <h4>${t("custom_date_time_format.title")}</h4>
+    <h4>${t("custom_date_time_format.title")}</h4>
 
-  <p class="description">
-    ${t("custom_date_time_format.description")}
-  </p>
+    <p class="description">
+        ${t("custom_date_time_format.description")}
+    </p>
 
-  <table class="table table-borderless">
-    <tr>
-      <td>
-        ${t("custom_date_time_format.format_string")}
-      </td>
-      <td>
-        <input type="text" id="custom-date-time-format" class="form-control custom-date-time-format"
-          placeholder="YYYY-MM-DD HH:mm">
-      </td>
-    </tr>
-
-    <tr>
-      <td>
-        ${t("custom_date_time_format.formatted_time")}
-      </td>
-      <td>
-        <div class="formatted-date" style="padding-left: 0.5rem;">
+    <div class="form-group row align-items-center">
+        <div class="col-6">
+            <label for="custom-date-time-format">${t("custom_date_time_format.format_string")}</label>
+            <input type="text" id="custom-date-time-format" class="form-control custom-date-time-format" placeholder="YYYY-MM-DD HH:mm">
         </div>
-      </td>
-    </tr>
-  </table>
-
+        <div class="col-6">
+            <label>${t("custom_date_time_format.formatted_time")}</label>
+            <div class="formatted-date"></div>
+        </div>
+    </div>
 </div>
 `;