# 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'.
:links="config.links"
@navbar-toggle="showMenu = !showMenu"
>
- <DarkMode @updated="isDark = $event" />
+ <DarkMode
+ @updated="isDark = $event"
+ :defaultValue="this.config.defaults.colorTheme"
+ />
<SettingToggle
@updated="vlayout = $event"
name="vlayout"
icon="fa-list"
iconAlt="fa-columns"
+ :defaultValue="this.config.defaults.layout == 'columns'"
/>
<SearchInput
columns: 3
connectivityCheck: true
+defaults:
+ # columns, list
+ layout: columns
+ # auto, light, dark
+ colorTheme: auto
+
theme: default
colors:
light:
<script>
export default {
name: "Darkmode",
+ props: {
+ defaultValue: String,
+ },
data: function () {
return {
isDark: null,
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);
name: String,
icon: String,
iconAlt: String,
+ defaultValue: Boolean,
},
data: function () {
return {
if (this.name in localStorage) {
this.value = JSON.parse(localStorage[this.name]);
+ } else {
+ this.value = this.defaultValue;
}
this.$emit("updated", this.value);