move weekday setting to settings dialog

dist/index.js

@@ -6134,13 +6134,7 @@
       },
       translations.general.setButton,
       /* @__PURE__ */ createElement("span", { class: "icon" }, "check")
-    )), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement("label", { class: "tile flex-no" }, /* @__PURE__ */ createElement("span", { class: "icon" }, "calendar_month"), /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("span", null, translations.homePage.firstDayOfWeekLabel), /* @__PURE__ */ createElement("select", { "bind:value": settingsViewModel2.firstDayOfWeekInput }, ...translations.regional.weekdays.full.map(
-      (weekdayName, i) => Option(
-        weekdayName,
-        i.toString(),
-        i.toString() == settingsViewModel2.firstDayOfWeekInput.value
-      )
-    )), /* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_drop_down"))), /* @__PURE__ */ createElement("hr", null), HomePageButton(
+    )), /* @__PURE__ */ createElement("hr", null), HomePageButton(
       settingsViewModel2.showSettingsModal,
       translations.homePage.settingsButton,
       "settings"
@@ -6646,7 +6640,7 @@
           case 0 /* Appearance */:
             return /* @__PURE__ */ createElement("div", null, "Appearance");
           case 1 /* Regional */:
-            return /* @__PURE__ */ createElement("div", null, "Regional");
+            return SettingsRegionalPane(settingsViewModel2);
           case 2 /* Info */:
             return SettingsInfoPane(settingsViewModel2);
         }
@@ -6703,6 +6697,15 @@
       settingsViewModel2.coreViewModel.BUILD
     )));
   }
+  function SettingsRegionalPane(settingsViewModel2) {
+    return /* @__PURE__ */ createElement("div", { class: "slide-up" }, /* @__PURE__ */ createElement("h2", null, translations.settings.pages.regional), /* @__PURE__ */ createElement("hr", null), /* @__PURE__ */ createElement("label", { class: "tile flex-no" }, /* @__PURE__ */ createElement("span", { class: "icon" }, "calendar_month"), /* @__PURE__ */ createElement("div", null, /* @__PURE__ */ createElement("span", null, translations.homePage.firstDayOfWeekLabel), /* @__PURE__ */ createElement("select", { "bind:value": settingsViewModel2.firstDayOfWeekInput }, ...translations.regional.weekdays.full.map(
+      (weekdayName, i) => Option(
+        weekdayName,
+        i.toString(),
+        i.toString() == settingsViewModel2.firstDayOfWeekInput.value
+      )
+    )), /* @__PURE__ */ createElement("span", { class: "icon" }, "arrow_drop_down"))));
+  }
 
   // src/index.tsx
   var storageModel = new StorageModel();

src/View/Modals/settingsModal.tsx

@@ -6,6 +6,7 @@ import SettingsViewModel, {
 } from "../../ViewModel/Global/settingsViewModel";
 import { SplitModal } from "../Components/splitModal";
 import { InfoTile } from "../Components/infoTile";
+import { Option } from "../Components/option";
 
 export function SettingsModal(settingsViewModel: SettingsViewModel) {
     const detailView = React.createProxyState(
@@ -15,7 +16,7 @@ export function SettingsModal(settingsViewModel: SettingsViewModel) {
                 case SettingsModalPages.Appearance:
                     return <div>Appearance</div>;
                 case SettingsModalPages.Regional:
-                    return <div>Regional</div>;
+                    return SettingsRegionalPane(settingsViewModel);
                 case SettingsModalPages.Info:
                     return SettingsInfoPane(settingsViewModel);
             }
@@ -103,3 +104,31 @@ function SettingsInfoPane(settingsViewModel: SettingsViewModel) {
         </div>
     );
 }
+
+function SettingsRegionalPane(settingsViewModel: SettingsViewModel) {
+    return (
+        <div class="slide-up">
+            <h2>{translations.settings.pages.regional}</h2>
+            <hr></hr>
+            <label class="tile flex-no">
+                <span class="icon">calendar_month</span>
+                <div>
+                    <span>{translations.homePage.firstDayOfWeekLabel}</span>
+                    <select bind:value={settingsViewModel.firstDayOfWeekInput}>
+                        {...translations.regional.weekdays.full.map(
+                            (weekdayName, i) =>
+                                Option(
+                                    weekdayName,
+                                    i.toString(),
+                                    i.toString() ==
+                                        settingsViewModel.firstDayOfWeekInput
+                                            .value,
+                                ),
+                        )}
+                    </select>
+                    <span class="icon">arrow_drop_down</span>
+                </div>
+            </label>
+        </div>
+    );
+}

src/View/homePage.tsx

@@ -108,28 +108,6 @@ export function HomePage(
 
             <hr></hr>
 
-            <label class="tile flex-no">
-                <span class="icon">calendar_month</span>
-                <div>
-                    <span>{translations.homePage.firstDayOfWeekLabel}</span>
-                    <select bind:value={settingsViewModel.firstDayOfWeekInput}>
-                        {...translations.regional.weekdays.full.map(
-                            (weekdayName, i) =>
-                                Option(
-                                    weekdayName,
-                                    i.toString(),
-                                    i.toString() ==
-                                        settingsViewModel.firstDayOfWeekInput
-                                            .value,
-                                ),
-                        )}
-                    </select>
-                    <span class="icon">arrow_drop_down</span>
-                </div>
-            </label>
-
-            <hr></hr>
-
             {HomePageButton(
                 settingsViewModel.showSettingsModal,
                 translations.homePage.settingsButton,