potsda.mn/mobilizon
10
4
Fork 1
Code Issues 22 Pull requests 1 Projects Releases Wiki Activity

Fix jitter when toggling "adapt to system theme"

Browse source 
This patch makes the border around the "dark" and "light" radio button to always be present.
Previously it was not present when the button were disabled because using the system theme,
which caused it to make the elements larger and made them move when toggling "adapt to system theme"

To keep the same meaning as previously, the border is only colored when the button is activated

Fix #1339
This commit is contained in:
Sosthène Guédon 2023-08-13 16:06:28 +02:00
parent 22e3e30f8f
commit d037642f55
1 changed files with 4 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
js/src/views/Settings/PreferencesView.vue
View file

@ -23,8 +23,8 @@
<fieldset> <fieldset>
<legend class="sr-only">{{ t("Theme") }}</legend> <legend class="sr-only">{{ t("Theme") }}</legend>
<o-radio <o-radio
:class="{ 'border-mbz-bluegreen border-2': theme === 'light' }" :class="{ 'border-mbz-bluegreen': theme === 'light' }"
class="p-4 bg-white text-zinc-800 rounded-md mt-2 mr-2" class="p-4 bg-white text-zinc-800 rounded-md mt-2 mr-2 border-2"
:disabled="systemTheme" :disabled="systemTheme"
v-model="theme" v-model="theme"
name="theme" name="theme"
@ -32,8 +32,8 @@
>{{ t("Light") }}</o-radio >{{ t("Light") }}</o-radio
> >
<o-radio <o-radio
:class="{ 'border-mbz-bluegreen border-2': theme === 'dark' }" :class="{ 'border-mbz-bluegreen': theme === 'dark' }"
class="p-4 bg-zinc-800 rounded-md text-white mt-2 ml-2" class="p-4 bg-zinc-800 rounded-md text-white mt-2 ml-2 border-2"
:disabled="systemTheme" :disabled="systemTheme"
v-model="theme" v-model="theme"
name="theme" name="theme"