TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-23 04:34:15 -04:00
Code Issues Packages Projects Releases Wiki Activity

style(profile): hide voice labels as they don’t make much sense there

Browse Source
This commit is contained in:
Valentyne Stigloher 2025-09-16 21:23:30 +02:00
parent 2b45d09ad2
commit 3f13a50a18
2 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
app/components/Pronunciation.vue
View File

@ -26,8 +26,9 @@ withDefaults(defineProps<{
<PronunciationSpeaker <PronunciationSpeaker
v-for="voice in voices" v-for="voice in voices"
:key="voice" :key="voice"
:pronunciation="pronunciation" :pronunciation
:voice="voice" :voice
:show-voice-label="voices.length > 1"
class="btn btn-sm btn-link px-1 py-0" class="btn btn-sm btn-link px-1 py-0"
/> />
</span> </span>

9
app/components/PronunciationSpeaker.vue
View File

@ -6,7 +6,7 @@ import type { VoiceKey } from '#shared/pronunciation/voices.ts';
const props = withDefaults(defineProps<{ const props = withDefaults(defineProps<{
pronunciation?: string | null; pronunciation?: string | null;
voice: VoiceKey; voice: VoiceKey;
button?: boolean; showVoiceLabel?: boolean;
}>(), { }>(), {
pronunciation: null, pronunciation: null,
}); });
@ -58,7 +58,10 @@ const icon = computed((): string => {
}); });
const config = useConfig(); const config = useConfig();
const name = computed((): string | null => { const voiceLabel = computed((): string | null => {
if (!props.showVoiceLabel) {
return null;
}
if (!config.pronunciation?.enabled) { if (!config.pronunciation?.enabled) {
return props.voice.toUpperCase(); return props.voice.toUpperCase();
} }
@ -83,6 +86,6 @@ const name = computed((): string | null => {
target="_blank" target="_blank"
@click.prevent="pronounce" @click.prevent="pronounce"
> >
<Icon :v="icon" /><sub v-if="name">{{ name }}</sub> <Icon :v="icon" /><sub v-if="voiceLabel">{{ voiceLabel }}</sub>
</Tooltip> </Tooltip>
</template> </template>