Merge remote-tracking branch 'origin/master' into feature/#1221-clickable-hostaname-on-status-page

src/components/settings/About.vue

@@ -4,6 +4,11 @@
             <object class="my-4" width="200" height="200" data="/icon.svg" />
             <div class="fs-4 fw-bold">Uptime Kuma</div>
             <div>{{ $t("Version") }}: {{ $root.info.version }}</div>
+            <div class="frontend-version">{{ $t("Frontend Version") }}: {{ $root.frontendVersion }}</div>
+
+            <div v-if="!$root.isFrontendBackendVersionMatched" class="alert alert-warning mt-4" role="alert">
+                ⚠️ {{ $t("Frontend Version do not match backend version!") }}
+            </div>
 
             <div class="my-3 update-link"><a href="https://github.com/louislam/uptime-kuma/releases" target="_blank" rel="noopener">{{ $t("Check Update On GitHub") }}</a></div>
 
@@ -46,6 +51,16 @@ export default {
 }
 
 .update-link {
-    font-size: 0.9em;
+    font-size: 0.8em;
 }
+
+.frontend-version {
+    font-size: 0.9em;
+    color: #cccccc;
+
+    .dark & {
+        color: #333333;
+    }
+}
+
 </style>

src/components/settings/Notifications.vue

@@ -23,6 +23,7 @@
         <div class="my-4 pt-4">
             <h5 class="my-4 settings-subheading">{{ $t("settingsCertificateExpiry") }}</h5>
             <p>{{ $t("certificationExpiryDescription") }}</p>
+            <p>{{ $t("notificationDescription") }}</p>
             <div class="mt-1 mb-3 ps-2 cert-exp-days col-12 col-xl-6">
                 <div v-for="day in settings.tlsExpiryNotifyDays" :key="day" class="d-flex align-items-center justify-content-between cert-exp-day-row py-2">
                     <span>{{ day }} {{ $tc("day", day) }}</span>