From f0afce206e5ad654744efcdfe3c2a02ea815d549 Mon Sep 17 00:00:00 2001
From: Pihkaal <pihkaal@proton.me>
Date: Wed, 14 Jan 2026 23:33:52 +0100
Subject: [PATCH] feat(settings/clock/date): implement

---
 .../BottomScreen/Menus/Clock/Date.vue         | 48 +++++++++++++++++++
 .../Settings/BottomScreen/Menus/Menus.vue     |  3 ++
 i18n/locales/en.json                          |  7 ++-
 3 files changed, 57 insertions(+), 1 deletion(-)
 create mode 100644 app/components/Settings/BottomScreen/Menus/Clock/Date.vue

diff --git a/app/components/Settings/BottomScreen/Menus/Clock/Date.vue b/app/components/Settings/BottomScreen/Menus/Clock/Date.vue
new file mode 100644
index 0000000..7acfd51
--- /dev/null
+++ b/app/components/Settings/BottomScreen/Menus/Clock/Date.vue
@@ -0,0 +1,48 @@
+<script setup lang="ts">
+import { SettingsBottomScreenNumberInput as NumberInput } from "#components";
+
+const store = useSettingsStore();
+const confirmationModal = useConfirmationModal();
+
+const now = new Date();
+
+const handleCancel = () => {
+  store.closeSubMenu();
+};
+
+const handleConfirm = () => {
+  store.closeSubMenu();
+};
+
+defineOptions({ render: () => null });
+</script>
+
+<template>
+  <NumberInput
+    :model-value="now.getMonth() + 1"
+    title="Month"
+    :x="1 * 16"
+    :disabled="true"
+  />
+  <NumberInput
+    :model-value="now.getDate()"
+    title="Day"
+    :x="5 * 16"
+    :disabled="true"
+  />
+  <NumberInput
+    :model-value="now.getFullYear()"
+    title="Year"
+    :digits="4"
+    :x="9 * 16"
+    :disabled="true"
+  />
+
+  <CommonButtons
+    :y-offset="0"
+    b-label="Cancel"
+    a-label="Confirm"
+    @activate-b="handleCancel"
+    @activate-a="handleConfirm"
+  />
+</template>
diff --git a/app/components/Settings/BottomScreen/Menus/Menus.vue b/app/components/Settings/BottomScreen/Menus/Menus.vue
index cd4b088..0c61bf4 100644
--- a/app/components/Settings/BottomScreen/Menus/Menus.vue
+++ b/app/components/Settings/BottomScreen/Menus/Menus.vue
@@ -9,6 +9,7 @@ import UserColor from "./User/Color.vue";
 import UserBirthday from "./User/Birthday.vue";
 
 import ClockMenu from "./Clock/Menu.vue";
+import ClockDate from "./Clock/Date.vue";
 import TouchScreenMenu from "./TouchScreen/Menu.vue";
 import Selector from "~/components/Common/ButtonSelector.vue";
 
@@ -164,6 +165,8 @@ const viewComponents: Record<string, Component> = {
   optionsLanguage: OptionsLanguage,
   optionsGbaMode: OptionsGbaMode,
 
+  clockDate: ClockDate,
+
   userColor: UserColor,
   userBirthday: UserBirthday,
 };
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 1905289..6ae7fc9 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -33,7 +33,12 @@
     },
     "clock": {
       "title": "Clock",
-      "description": "Change date, time, and alarm settings."
+      "description": "Change date, time, and alarm settings.",
+
+      "date": {
+        "title": "Date",
+        "description": "Today's date."
+      }
     },
     "user": {
       "title": "User",