chore(front): replace components in embed modal
This commit is contained in:
parent
d0819c9ffa
commit
aa6b0ad325
|
@ -5,6 +5,11 @@ import { useStore } from '~/store'
|
|||
import { useClipboard } from '@vueuse/core'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
import Button from '~/components/ui/Button.vue'
|
||||
import Alert from '~/components/ui/Alert.vue'
|
||||
import Input from '~/components/ui/Input.vue'
|
||||
import Spacer from '~/components/ui/Spacer.vue'
|
||||
|
||||
interface Props {
|
||||
type: string
|
||||
id: number
|
||||
|
@ -69,54 +74,55 @@ const { copy, copied } = useClipboard({ source: embedCode })
|
|||
<p>
|
||||
{{ t('components.audio.EmbedWizard.help.width') }}
|
||||
</p>
|
||||
<input
|
||||
<Input
|
||||
id="embed-width"
|
||||
v-model.number="width"
|
||||
type="number"
|
||||
min="0"
|
||||
step="10"
|
||||
>
|
||||
/>
|
||||
</div>
|
||||
<template v-if="type != 'track'">
|
||||
<br>
|
||||
<div class="field">
|
||||
<label for="embed-height">{{ t('components.audio.EmbedWizard.label.height') }}</label>
|
||||
<input
|
||||
<Input
|
||||
id="embed-height"
|
||||
v-model="height"
|
||||
type="number"
|
||||
:min="minHeight"
|
||||
max="1000"
|
||||
step="10"
|
||||
>
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<Spacer />
|
||||
<div class="field">
|
||||
<button
|
||||
class="ui right accent labeled icon floated button"
|
||||
<Button
|
||||
class="right floated"
|
||||
@click="copy()"
|
||||
icon="bi-copy"
|
||||
secondary
|
||||
>
|
||||
<i class="copy icon" />
|
||||
{{ t('components.audio.EmbedWizard.button.copy') }}
|
||||
</button>
|
||||
</Button>
|
||||
<label for="embed-width">{{ t('components.audio.EmbedWizard.label.embed') }}</label>
|
||||
<p>
|
||||
{{ t('components.audio.EmbedWizard.help.embed') }}
|
||||
</p>
|
||||
<textarea
|
||||
v-model="embedCode"
|
||||
rows="5"
|
||||
rows="3"
|
||||
readonly
|
||||
style="width: 100%;"
|
||||
/>
|
||||
<div class="ui right">
|
||||
<p
|
||||
<Alert
|
||||
v-if="copied"
|
||||
class="message"
|
||||
green
|
||||
>
|
||||
{{ t('components.audio.EmbedWizard.message.copy') }}
|
||||
</p>
|
||||
</div>
|
||||
</Alert>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue