mirror of
https://gitlab.com/PronounsPage/PronounsPage.git
synced 2025-09-28 23:42:58 -04:00
43 lines
963 B
Vue
43 lines
963 B
Vue
<template>
|
|
<span class="text-nowrap">
|
|
<span v-if="text" class="text-pronunciation">
|
|
{{ pronunciation }}
|
|
</span>
|
|
<PronunciationSpeaker
|
|
v-for="voice in voices"
|
|
:key="voice"
|
|
:pronunciation="pronunciation"
|
|
:voice="voice"
|
|
/>
|
|
</span>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import Vue from 'vue';
|
|
|
|
export default Vue.extend({
|
|
props: {
|
|
pronunciation: { required: true, type: String },
|
|
text: { default: false, type: Boolean },
|
|
},
|
|
computed: {
|
|
voices(): string[] {
|
|
if (this.$config.pronunciation?.enabled) {
|
|
return Object.keys(this.$config.pronunciation.voices);
|
|
} else {
|
|
return [];
|
|
}
|
|
},
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import "assets/variables";
|
|
|
|
.text-pronunciation {
|
|
font-weight: normal;
|
|
color: var(--#{$prefix}secondary-color);
|
|
}
|
|
</style>
|