diff --git a/resources/text/home/de.json b/resources/text/home/de.json
index 0ef5b57..eeb2295 100644
--- a/resources/text/home/de.json
+++ b/resources/text/home/de.json
@@ -1,3 +1,4 @@
 {
-    "empty": "Ziemlich leer hier"
+    "empty": "Ziemlich leer hier",
+    "entries": "Einträge"
 }
diff --git a/resources/text/home/en.json b/resources/text/home/en.json
index 0ea2b89..5d170d3 100644
--- a/resources/text/home/en.json
+++ b/resources/text/home/en.json
@@ -1,3 +1,4 @@
 {
-    "empty": "Pretty empty..."
+    "empty": "Pretty empty...",
+    "entries": "entries"
 }
diff --git a/resources/text/settings/de.json b/resources/text/settings/de.json
index 8617636..4543f4e 100644
--- a/resources/text/settings/de.json
+++ b/resources/text/settings/de.json
@@ -2,6 +2,7 @@
     "logout": "Abmelden",
     "class-name": "Klassen Name",
     "send-notifications": "Benachrichtigungen Senden",
+    "dark-mode": "Dunkler Modus",
     "lang": "Sprache",
     "cancel": "Abbrechen",
     "ok": "Ok",
diff --git a/resources/text/settings/en.json b/resources/text/settings/en.json
index 1faf08a..b2ec8cf 100644
--- a/resources/text/settings/en.json
+++ b/resources/text/settings/en.json
@@ -1,7 +1,8 @@
 {
     "logout": "Log out",
-    "class-name": "Class Name",
-    "send-notifications": "Send Notifications",
+    "class-name": "Class name",
+    "send-notifications": "Send notifications",
+    "dark-mode": "Dark mode",
     "lang": "Language",
     "cancel": "Cancel",
     "ok": "Ok",
diff --git a/src/store/mutations.ts b/src/store/mutations.ts
index 5342ed8..969afc0 100644
--- a/src/store/mutations.ts
+++ b/src/store/mutations.ts
@@ -1,5 +1,5 @@
 import { Account, Settings } from "@/utility/account";
-import { LoadingStates } from "@/utility/utils";
+import { LoadingStates, toggleDarkMode } from "@/utility/utils";
 import { Storage } from "@ionic/storage";
 import Dsbmobile, {
     DocumentPostCollection,
@@ -53,5 +53,7 @@ export const mutations = {
             "account",
             JSON.stringify(state.account.toJSON()),
         );
+
+        toggleDarkMode(settings.darkMode);
     },
 } as MutationTree<State>;
diff --git a/src/utility/account.ts b/src/utility/account.ts
index fc05a85..9cded15 100644
--- a/src/utility/account.ts
+++ b/src/utility/account.ts
@@ -2,6 +2,7 @@ export interface Settings {
     sendNotifications: boolean;
     lang: string;
     className: string;
+    darkMode: boolean;
 }
 
 export class Account {
@@ -13,6 +14,7 @@ export class Account {
             sendNotifications: true,
             lang: window.navigator.language === "de" ? "de" : "en",
             className: "",
+            darkMode: false,
         },
     ) {}
 
diff --git a/src/utility/utils.ts b/src/utility/utils.ts
index 76414ea..7c136e7 100644
--- a/src/utility/utils.ts
+++ b/src/utility/utils.ts
@@ -15,3 +15,7 @@ export function appearAnimation(element: Element, delay: number): Animation {
         .fromTo("transform", "translateY(-20px)", "translateY(0px)")
         .fromTo("opacity", "0", "100%");
 }
+
+export function toggleDarkMode(turnOn: any) {
+    document.body.setAttribute("data-theme", turnOn ? "dark" : "light");
+}
diff --git a/src/views/Home.vue b/src/views/Home.vue
index fb73495..d78cec6 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -15,6 +15,11 @@
                 </h2>
             </div>
             <div v-else-if="timeTable !== undefined">
+                <div style="text-align: center">
+                    <h3>
+                        {{ timeTable.entries.length }} {{ text["entries"] }}
+                    </h3>
+                </div>
                 <div
                     v-for="(entry, index) of timeTable.findByClassName(
                         settings.className,
@@ -64,6 +69,7 @@ export default defineComponent({
     methods: {
         async refresh(event: any) {
             await store.dispatch("update");
+            console.log(this.timeTable);
             event.target.complete();
         },
         async loadText() {
diff --git a/src/views/News.vue b/src/views/News.vue
index defe939..7958aa7 100644
--- a/src/views/News.vue
+++ b/src/views/News.vue
@@ -43,7 +43,7 @@ export default defineComponent({
             new NewsPost(
                 "Irgndwelche Neuigkeiten",
                 new Date(),
-                "Lorem ipsum somet amet lorem ipsum somet amet",
+                "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.",
             ),
         ]);
         return {
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index dc3c815..e0aa543 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -11,6 +11,7 @@
                                     type="text"
                                     v-model="className"></ion-input>
                             </ion-item>
+
                             <ion-item>
                                 <ion-label>{{ text["lang"] }}:</ion-label>
                                 <ion-select
@@ -26,16 +27,22 @@
                                     >
                                 </ion-select>
                             </ion-item>
+
                             <ion-item>
                                 <ion-label
                                     >{{
                                         text["send-notifications"]
                                     }}:</ion-label
                                 >
-                                <ion-checkbox
-                                    type="text"
-                                    v-model="sendNotifications"></ion-checkbox>
+                                <ion-toggle
+                                    v-model="sendNotifications"></ion-toggle>
                             </ion-item>
+
+                            <ion-item>
+                                <ion-label>{{ text["dark-mode"] }}:</ion-label>
+                                <ion-toggle v-model="darkMode"></ion-toggle>
+                            </ion-item>
+
                             <ion-item>
                                 <ion-button @click="save">{{
                                     text["save"]
@@ -69,7 +76,7 @@ import {
     IonItem,
     IonInput,
     IonLabel,
-    IonCheckbox,
+    IonToggle,
     IonSelect,
     IonSelectOption,
 } from "@ionic/vue";
@@ -82,6 +89,7 @@ interface Data {
     className: string;
     lang: string;
     text: object;
+    darkMode: boolean;
 }
 
 interface Methods {
@@ -104,7 +112,7 @@ export default defineComponent<Data, Methods>({
         IonInput,
         NavBar,
         IonLabel,
-        IonCheckbox,
+        IonToggle,
         IonSelect,
         IonSelectOption,
     },
@@ -115,6 +123,7 @@ export default defineComponent<Data, Methods>({
             sendNotifications: settings.sendNotifications,
             className: settings.className,
             lang: settings.lang,
+            darkMode: settings.darkMode,
             text: {},
         };
     },
@@ -127,6 +136,7 @@ export default defineComponent<Data, Methods>({
                 className: this.className,
                 sendNotifications: this.sendNotifications,
                 lang: this.lang,
+                darkMode: this.darkMode,
             } as Settings);
             this.loadText();
         },