From 0602aa503f664b7b6f7bf2fec7878e4b8e4234c5 Mon Sep 17 00:00:00 2001
From: Dimitra Angelidou <dangelidou@csd.auth.gr>
Date: Tue, 5 May 2026 23:46:33 +0300
Subject: [PATCH 1/2] Fixed #329 (about us bottom being clipped)

---
 src/routes/personalInfo/about.svelte | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/routes/personalInfo/about.svelte b/src/routes/personalInfo/about.svelte
index 6f149393..b3af4290 100644
--- a/src/routes/personalInfo/about.svelte
+++ b/src/routes/personalInfo/about.svelte
@@ -9,6 +9,7 @@
   import contributors from "$lib/components/personalInfo/contributors.json";
   import { t, locale, locales} from "$lib/i18n";
   import SubPageHeader from '$shared/subPageHeader.svelte';
+  import IonPage from 'ionic-svelte/components/IonPage.svelte';
   import { construct } from 'ionicons/icons';
 
   interface Contributor {
@@ -51,7 +52,7 @@
 
 </script>
 
-
+<IonPage>
 <SubPageHeader title={$t("about.title")} stackedNav/>
 <ion-content class="ion-padding">
 <div>
@@ -121,6 +122,7 @@
 </div>
 </div>
 </ion-content>
+</IonPage>
 
 <style>
   
@@ -128,10 +130,10 @@
   padding: 20px;
 }
 
-.section {
+/* .section {
   margin-bottom: 30px;
   align-items: flex-start;
-}
+} */
 
 .section-title {
   color: var(--ion-color-primary);
@@ -164,5 +166,9 @@
   transform: scale(1.2);
 }
 
+ion-content {
+		--padding-end: 0.6rem;
+		--padding-start: 0.6rem;
+}
+
 </style>
-  
\ No newline at end of file

From 7234ec8e3e9de561f58442c32684b3c8c9fbbbc1 Mon Sep 17 00:00:00 2001
From: iliaspapan <93546136+iliaspapan@users.noreply.github.com>
Date: Sat, 9 May 2026 16:04:51 +0300
Subject: [PATCH 2/2] Update darkMode.ts
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

αυτόματο dark mode, έπρεπε να μπεί...
---
 src/lib/globalFunctions/darkMode.ts | 33 ++++++++++++++++++++++++-----
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/src/lib/globalFunctions/darkMode.ts b/src/lib/globalFunctions/darkMode.ts
index 9f806d62..b74291de 100644
--- a/src/lib/globalFunctions/darkMode.ts
+++ b/src/lib/globalFunctions/darkMode.ts
@@ -4,17 +4,25 @@ import CapacitorPersistedStore from "../storage/capacitorPersistedStore";
 import { get } from "svelte/store";
 
 export const darkMode = new CapacitorPersistedStore<boolean>(false, "darkMode");
+export const autoDarkMode = new CapacitorPersistedStore<boolean>(true, "autoDarkMode");
+
 
 // Check if dark mode is enabled and set it if it is
 export async function checkAppMode() {
+	let isAuto = get(autoDarkMode);
     let isDark = get(darkMode);
-    if (isDark == null || isDark == undefined) { // Setting default dark mode | Fixes the toggle being ticked wrongly
-        darkMode.set(false);
+    if (isAuto) {
+        isDark = typeof window !== 'undefined' ? window.matchMedia('(prefers-color-scheme: dark)').matches : false;
+        darkMode.set(isDark);
+    } else if (isDark == null || isDark == undefined) {        darkMode.set(false);
         isDark = false;
-        document.body.classList.add('dark');
-        await StatusBar.setStyle({ style: Style.Dark });
     }
     document.body.classList.toggle('dark', isDark);
+	if (isDark) {
+        await StatusBar.setStyle({ style: Style.Dark });
+    } else {
+        await StatusBar.setStyle({ style: Style.Light });
+    }
 	
 }
 
@@ -22,10 +30,25 @@ export async function checkAppMode() {
 export async function toggleDarkTheme() {
     const isDark = document.body.classList.toggle('dark');
     darkMode.set(isDark);
-    // nativeSettings();
     if (isDark) {
         await StatusBar.setStyle({ style: Style.Dark });
     } else {
         await StatusBar.setStyle({ style: Style.Light });
     }
 }
+
+export async function toggleAutoDarkMode() {
+    let isAuto = !get(autoDarkMode);
+    autoDarkMode.set(isAuto);
+    if (isAuto) {
+        checkAppMode();
+    }
+}
+if (typeof window !== 'undefined') {
+    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', async (e) => {
+        if (get(autoDarkMode)) {
+            darkMode.set(e.matches);
+            checkAppMode();
+        }
+    });
+}