Skip to content

Commit

Permalink
standardize design of switches (#30)
Browse files Browse the repository at this point in the history
  • Loading branch information
fuwako authored Feb 5, 2024
1 parent fa4fbc5 commit 6cfff6f
Show file tree
Hide file tree
Showing 5 changed files with 107 additions and 86 deletions.
21 changes: 12 additions & 9 deletions src/components/settings/Appearance.vue
Original file line number Diff line number Diff line change
Expand Up @@ -71,15 +71,18 @@
</v-col>
<v-divider />
<v-col :cols="12" :md="12" class="pb-0">
<v-list-item :title="$t('settings.appearance.text.fade')">
<template #append>
<v-switch
v-model="appearanceStore.text.enable_fade"
color="primary"
inset hide-details
/>
</template>
</v-list-item>
<v-card>
<v-list-item :title="$t('settings.appearance.text.fade')">
<template #append>
<v-switch
v-model="appearanceStore.text.enable_fade"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>
</v-col>
<v-col :cols="12" :sm="6">
<v-text-field
Expand Down
98 changes: 54 additions & 44 deletions src/components/settings/OSC.vue
Original file line number Diff line number Diff line change
Expand Up @@ -12,62 +12,72 @@
<v-divider />
<v-col :cols="12">
<v-card>
<v-switch
v-model="oscStore.osc_text"
:label="$t('settings.osc.general.enabled')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.osc.general.enabled')">
<template #append>
<v-switch
v-model="oscStore.osc_text"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>

<v-card class="mt-2">
<v-switch
v-model="oscStore.text_typing"
:disabled="!oscStore.osc_text"
:label="$t('settings.osc.general.typing_indicator')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.osc.general.typing_indicator')">
<template #append>
<v-switch
v-model="oscStore.text_typing"
:disabled="!oscStore.osc_text"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>

<v-card class="mt-2">
<v-switch
v-model="oscStore.stt_typing"
:disabled="!oscStore.osc_text"
:label="$t('settings.osc.general.speech_indicator')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.osc.general.speech_indicator')">
<template #append>
<v-switch
v-model="oscStore.stt_typing"
:disabled="!oscStore.osc_text"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>

<v-card class="mt-2">
<v-switch
v-model="oscStore.show_keyboard"
:disabled="!oscStore.osc_text"
:label="$t('settings.osc.general.show_keyboard')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.osc.general.show_keyboard')">
<template #append>
<v-switch
v-model="oscStore.show_keyboard"
:disabled="!oscStore.osc_text"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>

<v-card class="mt-2">
<v-switch
v-model="oscStore.sfx"
:disabled="!oscStore.osc_text || oscStore.show_keyboard"
:label="$t('settings.osc.general.sfx')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.osc.general.sfx')">
<template #append>
<v-switch
v-model="oscStore.sfx"
:disabled="!oscStore.osc_text || oscStore.show_keyboard"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>
</v-col>
</v-row>
Expand Down
20 changes: 11 additions & 9 deletions src/components/settings/TTS.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,15 +4,17 @@
<v-card-text>
<v-row>
<v-col :cols="12">
<v-card flat>
<v-switch
v-model="speechStore.tts.enabled"
:label="$t('settings.tts.enabled')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-card>
<v-list-item :title="$t('settings.tts.enabled') ">
<template #append>
<v-switch
v-model="speechStore.tts.enabled"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>
</v-col>
<v-col :cols="12">
Expand Down
36 changes: 20 additions & 16 deletions src/components/settings/Translation.vue
Original file line number Diff line number Diff line change
Expand Up @@ -11,14 +11,16 @@
</v-col>
<v-col :cols="12">
<v-card flat>
<v-switch
v-model="translationStore.enabled"
:label="$t('settings.translation.enabled')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.translation.enabled')">
<template #append>
<v-switch
v-model="translationStore.enabled"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>
</v-col>
<v-col :cols="12">
Expand Down Expand Up @@ -74,14 +76,16 @@
</v-col>
<v-col :cols="12">
<v-card flat>
<v-switch
v-model="translationStore.show_original"
:label="$t('settings.translation.show_original')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.translation.show_original')">
<template #append>
<v-switch
v-model="translationStore.show_original"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>
</v-col>
</v-row>
Expand Down
18 changes: 10 additions & 8 deletions src/components/settings/WordReplace.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,16 @@
<v-divider />
<v-card-text>
<v-card flat>
<v-switch
v-model="wordReplaceStore.enabled"
:label="$t('settings.word_replace.enabled')"
color="primary"
hide-details
inset
class="mx-3"
/>
<v-list-item :title="$t('settings.word_replace.enabled')">
<template #append>
<v-switch
v-model="wordReplaceStore.enabled"
color="primary"
hide-details
inset
/>
</template>
</v-list-item>
</v-card>
<div v-if="replacements.length" class="mt-6">
<v-row v-for="(replacement, i) in replacements">
Expand Down

0 comments on commit 6cfff6f

Please sign in to comment.