diff --git a/docs/configuration.md b/docs/configuration.md
index 50b5bd5..65fd018 100644
--- a/docs/configuration.md
+++ b/docs/configuration.md
@@ -29,6 +29,11 @@ proxy:
# NOT All custom services implements this new option YET. Support will be extended very soon.
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 c263c8a..1f1791c 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);