okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix divs

Browse source
This commit is contained in:
booploops 2022-07-07 20:47:02 -07:00
parent 761d8d60cb
commit a62b71c04a
1 changed files with 1545 additions and 1487 deletions
Download patch file Download diff file Expand all files Collapse all files

156
src/renderer/views/components/settings-window.ejs
View file

@ -1,12 +1,18 @@
<script type="text/x-template" id="settings-window"> <script type="text/x-template" id="settings-window">
<div class="settings-panel" @click.self="close()"> <div class="settings-panel" @click.self="close()">
<div class="settings-window" :class="{'maxed': $store.state.pageState['settings'].fullscreen, 'no-sidebar': sidebarVis()}"> <div class="settings-window"
<button class="close-btn minmax-btn" @click="$store.state.pageState['settings'].fullscreen = !$store.state.pageState['settings'].fullscreen" :class="{'min': $store.state.pageState['settings'].fullscreen}"></button> :class="{'maxed': $store.state.pageState['settings'].fullscreen, 'no-sidebar': sidebarVis()}">
<button class="close-btn minmax-btn"
@click="$store.state.pageState['settings'].fullscreen = !$store.state.pageState['settings'].fullscreen"
:class="{'min': $store.state.pageState['settings'].fullscreen}"></button>
<button class="close-btn" @click="close()"></button> <button class="close-btn" @click="close()"></button>
<b-tabs class="no-style" pills vertical content-class="mt-3" v-model="$store.state.pageState['settings'].currentTabIndex"> <b-tabs class="no-style" pills vertical content-class="mt-3"
v-model="$store.state.pageState['settings'].currentTabIndex">
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/settings.svg" classes="md" name="settings-general" /></div> <div>
<svg-icon url="./assets/settings.svg" classes="md" name="settings-general"/>
</div>
<div> <div>
{{ $root.getLz('settings.header.general') }} {{ $root.getLz('settings.header.general') }}
</div> </div>
@ -27,7 +33,8 @@
<select class="md-select" @change="$root.setLz('');$root.setLzManual()" <select class="md-select" @change="$root.setLz('');$root.setLzManual()"
v-model="app.cfg.general.language"> v-model="app.cfg.general.language">
<optgroup :label="index" v-for="(categories, index) in getLanguages()"> <optgroup :label="index" v-for="(categories, index) in getLanguages()">
<option v-for="lang in categories" :value="lang.code">{{lang.nameNative}} <option v-for="lang in categories" :value="lang.code">
{{lang.nameNative}}
({{ ({{
lang.nameEnglish }}) lang.nameEnglish }})
</option> </option>
@ -124,7 +131,8 @@
<option value="listen_now">{{$root.getLz('term.listenNow')}}</option> <option value="listen_now">{{$root.getLz('term.listenNow')}}</option>
<option value="browse">{{$root.getLz('term.browse')}}</option> <option value="browse">{{$root.getLz('term.browse')}}</option>
<option value="radio">{{$root.getLz('term.radio')}}</option> <option value="radio">{{$root.getLz('term.radio')}}</option>
<option value="library-recentlyadded">{{$root.getLz('term.recentlyAdded')}} <option value="library-recentlyadded">
{{$root.getLz('term.recentlyAdded')}}
</option> </option>
<option value="library-songs">{{$root.getLz('term.songs')}}</option> <option value="library-songs">{{$root.getLz('term.songs')}}</option>
<option value="library-albums">{{$root.getLz('term.albums')}}</option> <option value="library-albums">{{$root.getLz('term.albums')}}</option>
@ -154,7 +162,8 @@
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" <input type="checkbox"
v-model="app.cfg.general.sidebarItems.recentlyAdded" switch /> v-model="app.cfg.general.sidebarItems.recentlyAdded"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -164,7 +173,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.songs" <input type="checkbox"
v-model="app.cfg.general.sidebarItems.songs"
switch/> switch/>
</label> </label>
</div> </div>
@ -175,7 +185,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.albums" <input type="checkbox"
v-model="app.cfg.general.sidebarItems.albums"
switch/> switch/>
</label> </label>
</div> </div>
@ -186,7 +197,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.artists" <input type="checkbox"
v-model="app.cfg.general.sidebarItems.artists"
switch/> switch/>
</label> </label>
</div> </div>
@ -197,7 +209,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.videos" <input type="checkbox"
v-model="app.cfg.general.sidebarItems.videos"
switch/> switch/>
</label> </label>
</div> </div>
@ -208,7 +221,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.sidebarItems.podcasts" <input type="checkbox"
v-model="app.cfg.general.sidebarItems.podcasts"
switch/> switch/>
</label> </label>
</div> </div>
@ -232,7 +246,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.themeUpdateNotification" switch /> <input type="checkbox" v-model="app.cfg.general.themeUpdateNotification"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -242,7 +257,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.showLovedTracksInline" switch /> <input type="checkbox" v-model="app.cfg.general.showLovedTracksInline"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -262,7 +278,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/headphones.svg" classes="md" name="settings-audio" /></div> <div>
<svg-icon url="./assets/feather/headphones.svg" classes="md" name="settings-audio"/>
</div>
<div> <div>
{{ $root.getLz('settings.header.audio') }} {{ $root.getLz('settings.header.audio') }}
</div> </div>
@ -280,11 +298,13 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<select class="md-select" style="width:180px;" v-model="app.cfg.audio.quality" <select class="md-select" style="width:180px;"
v-model="app.cfg.audio.quality"
v-on:change="changeAudioQuality"> v-on:change="changeAudioQuality">
<!-- // <option value="">{{$root.getLz('settings.header.audio.quality.hireslossless')}}</option> --> <!-- // <option value="">{{$root.getLz('settings.header.audio.quality.hireslossless')}}</option> -->
<!-- <option value="">{{$root.getLz('settings.header.audio.quality.lossless')}}</option> --> <!-- <option value="">{{$root.getLz('settings.header.audio.quality.lossless')}}</option> -->
<option value="HIGH">{{$root.getLz('settings.header.audio.quality.high')}} <option value="HIGH">
{{$root.getLz('settings.header.audio.quality.high')}}
({{$root.getLz('settings.header.audio.quality.high.description')}}) ({{$root.getLz('settings.header.audio.quality.high.description')}})
</option> </option>
<option value="STANDARD"> <option value="STANDARD">
@ -354,7 +374,8 @@
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext"> <div class="md-option-line" v-show="app.cfg.advanced.AudioContext">
<div class="md-option-segment" style="white-space: pre-line;"> <div class="md-option-segment" style="white-space: pre-line;">
{{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization')}} {{$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization')}}
<small>{{app.cfg.audio.equalizer.vibrantBass != 0 || app.cfg.audio.maikiwiAudio.spatial <small>{{app.cfg.audio.equalizer.vibrantBass != 0 ||
app.cfg.audio.maikiwiAudio.spatial
=== true || app.cfg.audio.maikiwiAudio.ciderPPE === true ? === true || app.cfg.audio.maikiwiAudio.ciderPPE === true ?
`${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}\n${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.disabled')}` `${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.description')}\n${$root.getLz('settings.option.audio.enableAdvancedFunctionality.audioNormalization.disabled')}`
: :
@ -400,7 +421,9 @@
</b-tab> </b-tab>
<b-tab v-if="app.cfg.advanced.AudioContext"> <b-tab v-if="app.cfg.advanced.AudioContext">
<template #title> <template #title>
<div><svg-icon url="./assets/feather/zap.svg" classes="md" name="settings-audiolabs" /></div> <div>
<svg-icon url="./assets/feather/zap.svg" classes="md" name="settings-audiolabs"/>
</div>
<div> <div>
{{ $root.getLz('settings.option.audio.audioLab') }} {{ $root.getLz('settings.option.audio.audioLab') }}
</div> </div>
@ -411,7 +434,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/style.svg" classes="md" name="settings-styles" /></div> <div>
<svg-icon url="./assets/feather/style.svg" classes="md" name="settings-styles"/>
</div>
<div> <div>
{{ $root.getLz('settings.header.visual.styles') }} {{ $root.getLz('settings.header.visual.styles') }}
</div> </div>
@ -422,7 +447,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/pen-tool.svg" classes="md" name="settings-visual" /></div> <div>
<svg-icon url="./assets/feather/pen-tool.svg" classes="md" name="settings-visual"/>
</div>
<div> <div>
{{ $root.getLz('settings.header.visual') }} {{ $root.getLz('settings.header.visual') }}
</div> </div>
@ -450,7 +477,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<select class="md-select" v-model="$root.cfg.visual.directives.windowLayout"> <select class="md-select"
v-model="$root.cfg.visual.directives.windowLayout">
<option value="default">Maverick</option> <option value="default">Maverick</option>
<option value="twopanel">Mojave</option> <option value="twopanel">Mojave</option>
</select> </select>
@ -484,7 +512,8 @@
</label> </label>
</div> </div>
</div> </div>
<div class="md-option-line child" v-if="app.cfg.visual.window_background_style == 'color'"> <div class="md-option-line child"
v-if="app.cfg.visual.window_background_style == 'color'">
<div class="md-option-segment"> <div class="md-option-segment">
{{$root.getLz('settings.option.visual.windowColor')}} {{$root.getLz('settings.option.visual.windowColor')}}
</div> </div>
@ -526,7 +555,8 @@
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<select class="md-select" style="width:180px;" <select class="md-select" style="width:180px;"
v-model="app.cfg.visual.hw_acceleration" @change="promptForRelaunch()"> v-model="app.cfg.visual.hw_acceleration"
@change="promptForRelaunch()">
<option value="default"> <option value="default">
{{$root.getLz('settings.header.visual.hardwareAcceleration.default')}} {{$root.getLz('settings.header.visual.hardwareAcceleration.default')}}
</option> </option>
@ -561,7 +591,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<select @change="$root.setWindowScaleFactor()" class="md-select" v-model="app.cfg.visual.maxElementScale" > <select @change="$root.setWindowScaleFactor()" class="md-select"
v-model="app.cfg.visual.maxElementScale">
<option value="-1">Default (1.5x)</option> <option value="-1">Default (1.5x)</option>
<option value="1">1.0x</option> <option value="1">1.0x</option>
<option value="1.1">1.1x</option> <option value="1.1">1.1x</option>
@ -645,7 +676,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<select class="md-select" v-model="app.cfg.visual.animated_artwork_qualityLevel"> <select class="md-select"
v-model="app.cfg.visual.animated_artwork_qualityLevel">
<option value="0"> <option value="0">
{{$root.getLz('settings.header.visual.animatedArtworkQuality.low')}} {{$root.getLz('settings.header.visual.animatedArtworkQuality.low')}}
</option> </option>
@ -681,7 +713,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/plugins.svg" classes="md" name="settings-plugins" /></div> <div>
<svg-icon url="./assets/feather/plugins.svg" classes="md" name="settings-plugins"/>
</div>
<div> <div>
{{ $root.getLz('term.plugins') }} {{ $root.getLz('term.plugins') }}
</div> </div>
@ -692,7 +726,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/mic.svg" classes="md" name="settings-lyrics" /></div> <div>
<svg-icon url="./assets/feather/mic.svg" classes="md" name="settings-lyrics"/>
</div>
<div> <div>
{{ $root.getLz('settings.header.lyrics') }} {{ $root.getLz('settings.header.lyrics') }}
</div> </div>
@ -714,7 +750,6 @@
</label> </label>
</div> </div>
</div> </div>
<div class="md-option-line">
<div class="md-option-line" v-if="app.cfg.lyrics.enable_mxm"> <div class="md-option-line" v-if="app.cfg.lyrics.enable_mxm">
<div class="md-option-segment"> <div class="md-option-segment">
{{$root.getLz('settings.option.lyrics.enableMusixmatchKaraoke')}} {{$root.getLz('settings.option.lyrics.enableMusixmatchKaraoke')}}
@ -1028,7 +1063,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/radio.svg" classes="md" name="settings-connectivity" /></div> <div>
<svg-icon url="./assets/feather/radio.svg" classes="md" name="settings-connectivity"/>
</div>
<div> <div>
{{ $root.getLz('settings.header.connectivity') }} {{ $root.getLz('settings.header.connectivity') }}
</div> </div>
@ -1047,7 +1084,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.general.playbackNotifications" switch /> <input type="checkbox" v-model="app.cfg.general.playbackNotifications"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1059,7 +1097,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.connectivity.discord_rpc.enabled" switch /> <input type="checkbox" v-model="app.cfg.connectivity.discord_rpc.enabled"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1085,7 +1124,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.connectivity.discord_rpc.clear_on_pause" switch /> <input type="checkbox"
v-model="app.cfg.connectivity.discord_rpc.clear_on_pause" switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1096,7 +1136,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.connectivity.discord_rpc.hide_buttons" switch /> <input type="checkbox"
v-model="app.cfg.connectivity.discord_rpc.hide_buttons" switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1107,7 +1148,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.connectivity.discord_rpc.hide_timestamp" switch /> <input type="checkbox"
v-model="app.cfg.connectivity.discord_rpc.hide_timestamp" switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1115,12 +1157,14 @@
<div class="md-option-line" v-show="app.cfg.connectivity.discord_rpc.enabled != false"> <div class="md-option-line" v-show="app.cfg.connectivity.discord_rpc.enabled != false">
<div class="md-option-segment"> <div class="md-option-segment">
{{$root.getLz('settings.option.connectivity.discordRPC.detailsFormat')}}<br/> {{$root.getLz('settings.option.connectivity.discordRPC.detailsFormat')}}<br/>
<small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title}, {album}, <small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title},
{album},
{trackNumber}</small> {trackNumber}</small>
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="text" v-model="app.cfg.connectivity.discord_rpc.details_format" /> <input type="text"
v-model="app.cfg.connectivity.discord_rpc.details_format"/>
</label> </label>
</div> </div>
</div> </div>
@ -1128,7 +1172,8 @@
<div class="md-option-line" v-show="app.cfg.connectivity.discord_rpc.enabled != false"> <div class="md-option-line" v-show="app.cfg.connectivity.discord_rpc.enabled != false">
<div class="md-option-segment"> <div class="md-option-segment">
{{$root.getLz('settings.option.connectivity.discordRPC.stateFormat')}} {{$root.getLz('settings.option.connectivity.discordRPC.stateFormat')}}
<small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title}, {album}, <small>{{$root.getLz('term.variables')}}: {artist}, {composer}, {title},
{album},
{trackNumber}</small> {trackNumber}</small>
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
@ -1155,9 +1200,13 @@
{{$root.getLz('settings.option.connectivity.lastfmScrobble')}} {{$root.getLz('settings.option.connectivity.lastfmScrobble')}}
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<button class="md-btn" id="lfmConnect" @click="app.cfg.connectivity.lastfm.enabled ? lfmDisconnect() : lfmAuthorize()"> <button class="md-btn" id="lfmConnect"
{{$root.getLz(`term.${$root.cfg.connectivity.lastfm.enabled ? "disconnect" : "connect"}`)}}<br> @click="app.cfg.connectivity.lastfm.enabled ? lfmDisconnect() : lfmAuthorize()">
<small>{{app.cfg.connectivity.lastfm.enabled ? `${$root.getLz('term.authed')}: ${$root.cfg.connectivity.lastfm.secrets.username}` : '' }}</small> {{$root.getLz(`term.${$root.cfg.connectivity.lastfm.enabled ? "disconnect" :
"connect"}`)}}<br>
<small>{{app.cfg.connectivity.lastfm.enabled ?
`${$root.getLz('term.authed')}:
${$root.cfg.connectivity.lastfm.secrets.username}` : '' }}</small>
</button> </button>
</div> </div>
</div> </div>
@ -1169,7 +1218,8 @@
<label> <label>
<form @submit.prevent="submitToken"> <form @submit.prevent="submitToken">
<input type="text" autofocus id="lfmToken"/> <input type="text" autofocus id="lfmToken"/>
<input type="submit" class="md-btn" @value="$root.getLz('action.submit')" /> <input type="submit" class="md-btn"
@value="$root.getLz('action.submit')"/>
</form> </form>
</label> </label>
</div> </div>
@ -1180,7 +1230,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="number" min="50" max="100" v-model="app.cfg.connectivity.lastfm.scrobble_after"/> <input type="number" min="50" max="100"
v-model="app.cfg.connectivity.lastfm.scrobble_after"/>
</label> </label>
</div> </div>
</div> </div>
@ -1191,7 +1242,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.connectivity.lastfm.filter_loop" switch/> <input type="checkbox" v-model="app.cfg.connectivity.lastfm.filter_loop"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1212,7 +1264,9 @@
</b-tab> </b-tab>
<b-tab> <b-tab>
<template #title> <template #title>
<div><svg-icon url="./assets/feather/hard-drive.svg" classes="md" name="settings-advanced" /></div> <div>
<svg-icon url="./assets/feather/hard-drive.svg" classes="md" name="settings-advanced"/>
</div>
<div> <div>
{{$root.getLz('settings.header.advanced')}} {{$root.getLz('settings.header.advanced')}}
</div> </div>
@ -1323,7 +1377,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('ampv3')" <input type="checkbox"
v-model="app.cfg.advanced.experiments.includes('ampv3')"
@click="app.cfg.advanced.experiments.includes('ampv3') ? removeExperiment('ampv3') : addExperiment('ampv3')" @click="app.cfg.advanced.experiments.includes('ampv3') ? removeExperiment('ampv3') : addExperiment('ampv3')"
switch/> switch/>
</label> </label>
@ -1338,7 +1393,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.advanced.playlistTrackMapping" switch /> <input type="checkbox" v-model="app.cfg.advanced.playlistTrackMapping"
switch/>
</label> </label>
</div> </div>
</div> </div>
@ -1349,7 +1405,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('localLibrary')" <input type="checkbox"
v-model="app.cfg.advanced.experiments.includes('localLibrary')"
@click="app.cfg.advanced.experiments.includes('localLibrary') ? removeExperiment('localLibrary') : addExperiment('localLibrary')" @click="app.cfg.advanced.experiments.includes('localLibrary') ? removeExperiment('localLibrary') : addExperiment('localLibrary')"
switch/> switch/>
</label> </label>
@ -1364,7 +1421,8 @@
</div> </div>
<div class="md-option-segment md-option-segment_auto"> <div class="md-option-segment md-option-segment_auto">
<label> <label>
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('compactui')" <input type="checkbox"
v-model="app.cfg.advanced.experiments.includes('compactui')"
@click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')" @click="app.cfg.advanced.experiments.includes('compactui') ? removeExperiment('compactui') : addExperiment('compactui')"
switch :disabled="!!app.getThemeDirective('forceUI')"/> switch :disabled="!!app.getThemeDirective('forceUI')"/>
</label> </label>