diff --git a/docs/configuration.md b/docs/configuration.md
index 552b22a..2083be3 100644
--- a/docs/configuration.md
+++ b/docs/configuration.md
@@ -31,6 +31,11 @@ connectivityCheck: true # whether you want to display a message when the apps ar
proxy:
useCredentials: false # send cookies & authorization headers when fetching service specific data. Set to `true` if you use an authentication proxy. Can be overrided on service level.
+# Set the default layout and color scheme
+defaults:
+ layout: columns # Either 'columns', or 'list'
+ colorTheme: auto # One of 'auto', 'light', or 'dark'
+
# Optional theming
theme: default # 'default' or one of the themes available in 'src/assets/themes'.
diff --git a/src/App.vue b/src/App.vue
index d2cb3ad..fda13c3 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -30,13 +30,17 @@
:links="config.links"
@navbar-toggle="showMenu = !showMenu"
>
-
+
Created with ❤️ with
export default {
name: "Darkmode",
+ props: {
+ defaultValue: String,
+ },
data: function () {
return {
isDark: null,
@@ -30,6 +33,17 @@ export default {
if ("overrideDark" in localStorage) {
// Light theme is 1 and Dark theme is 2
this.mode = JSON.parse(localStorage.overrideDark) ? 2 : 1;
+ } else {
+ switch (this.defaultValue) {
+ case "light":
+ this.mode = 1;
+ break;
+ case "dark":
+ this.mode = 2;
+ break;
+ default:
+ this.mode = 0;
+ }
}
this.isDark = this.getIsDark();
this.$emit("updated", this.isDark);
diff --git a/src/components/SettingToggle.vue b/src/components/SettingToggle.vue
index 985ca84..6c8a10f 100644
--- a/src/components/SettingToggle.vue
+++ b/src/components/SettingToggle.vue
@@ -12,6 +12,7 @@ export default {
name: String,
icon: String,
iconAlt: String,
+ defaultValue: Boolean,
},
data: function () {
return {
@@ -24,6 +25,8 @@ export default {
if (this.name in localStorage) {
this.value = JSON.parse(localStorage[this.name]);
+ } else {
+ this.value = this.defaultValue;
}
this.$emit("updated", this.value);