Fix: Improve settings layout and wording

src/languages/en.js

@@ -281,6 +281,6 @@ export default {
     promosmsPhoneNumber: "Phone number (for Polish recipient You can skip area codes)",
     promosmsSMSSender: "SMS Sender Name : Pre-registred name or one of defaults: InfoSMS, SMS Info, MaxSMS, INFO, SMS",
     // End notification form
-    "Monitor History": "Monitor History",
+    "Monitor History": "Monitor History:",
-    clearDataOlderThan: "Remove monitor data older than {0} days",
+    clearDataOlderThan: "Keep monitor history data for {0} days.",
 };

src/pages/Settings.vue

@@ -119,6 +119,15 @@
                                 </div>
                             </div>
 
+                            <!-- Monitor History -->
+                            <div class="mb-4">
+                                <h4 class="mt-4">{{ $t("Monitor History") }}</h4>
+                                <div class="mt-2">
+                                    <label for="keepDataPeriodDays" class="form-label">{{ $t("clearDataOlderThan", [ settings.keepDataPeriodDays ]) }}</label>
+                                    <input id="keepDataPeriodDays" v-model="settings.keepDataPeriodDays" type="number" class="form-control" required min="1" step="1">
+                                </div>
+                            </div>
+
                             <div>
                                 <button class="btn btn-primary" type="submit">
                                     {{ $t("Save") }}
@@ -212,14 +221,6 @@
                                 {{ importAlert }}
                             </div>
 
-                            <div class="mt-3 mb-3">
-                                <h2 class="mb-2">{{ $t("Monitor History") }}</h2>
-                                <div class="my-3">
-                                    <label for="keepDataPeriodDays" class="form-label">{{ $t("clearDataOlderThan", [ settings.keepDataPeriodDays ]) }}</label>
-                                    <input id="keepDataPeriodDays" v-model="settings.keepDataPeriodDays" type="number" class="form-control" required min="1" step="1">
-                                </div>
-                            </div>
-
                             <h2 class="mt-5 mb-2">{{ $t("Advanced") }}</h2>
 
                             <div class="mb-3">