MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(front): set label prop resp. slot in inputs

This commit is contained in:
upsiflu 2024-12-29 18:34:19 +01:00
parent b2ba7e1e6a
commit 81269f7fad
2 changed files with 30 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
front/src/components/auth/LoginForm.vue
View File

@ -108,15 +108,6 @@ const submit = async () => {
<Spacer v-if="errors.length > 0" /> <Spacer v-if="errors.length > 0" />
<template v-if="domain === store.getters['instance/domain']"> <template v-if="domain === store.getters['instance/domain']">
<div style="margin-bottom: 16px"> <div style="margin-bottom: 16px">
<label for="username-field">
{{ t('components.auth.LoginForm.label.username') }}
<template v-if="showSignup">
<span class="middle pipe symbol" />
<router-link :to="{ path: '/signup' }">
{{ t('components.auth.LoginForm.link.createAccount') }}
</router-link>
</template>
</label>
<Input <Input
id="username-field" id="username-field"
ref="username" ref="username"
@ -126,10 +117,25 @@ const submit = async () => {
type="text" type="text"
autofocus autofocus
:placeholder="labels.usernamePlaceholder" :placeholder="labels.usernamePlaceholder"
/> >
<template #label>
{{ t('components.auth.LoginForm.label.username') }}
<template v-if="showSignup">
<span class="middle pipe symbol" />
<router-link :to="{ path: '/signup' }">
{{ t('components.auth.LoginForm.link.createAccount') }}
</router-link>
</template>
</template>
</Input>
</div> </div>
<div style="margin-bottom: 16px"> <div style="margin-bottom: 16px">
<label for="password-field"> <Input password
v-model="credentials.password"
field-id="password-field"
required
>
<template #label>
{{ t('components.auth.LoginForm.label.password') }} {{ t('components.auth.LoginForm.label.password') }}
<span class="middle pipe symbol" /> <span class="middle pipe symbol" />
<router-link <router-link
@ -138,12 +144,8 @@ const submit = async () => {
> >
{{ t('components.auth.LoginForm.link.resetPassword') }} {{ t('components.auth.LoginForm.link.resetPassword') }}
</router-link> </router-link>
</label> </template>
<Input password </Input>
v-model="credentials.password"
field-id="password-field"
required
/>
</div> </div>
</template> </template>
<template v-else> <template v-else>

13
front/src/components/auth/SignupForm.vue
View File

@ -149,7 +149,7 @@ fetchInstanceSettings()
<div class="required field"> <div class="required field">
<Input <Input
id="username-field" id="username-field"
label = "t('components.auth.SignupForm.label.username')" :label = "t('components.auth.SignupForm.label.username')"
ref="username" ref="username"
v-model="payload.username" v-model="payload.username"
name="username" name="username"
@ -161,7 +161,7 @@ fetchInstanceSettings()
</div> </div>
<div class="required field"> <div class="required field">
<Input <Input
label="t('components.auth.SignupForm.label.email')" :label="t('components.auth.SignupForm.label.email')"
id="email-field" id="email-field"
ref="email" ref="email"
v-model="payload.email" v-model="payload.email"
@ -173,7 +173,7 @@ fetchInstanceSettings()
</div> </div>
<div class="required field"> <div class="required field">
<Input password <Input password
label="t('components.auth.SignupForm.label.password')" :label="t('components.auth.SignupForm.label.password')"
v-model="payload.password1" v-model="payload.password1"
field-id="password-field" field-id="password-field"
/> />
@ -183,7 +183,7 @@ fetchInstanceSettings()
class="required field" class="required field"
> >
<Input <Input
label="t('components.auth.SignupForm.label.invitation')" :label="t('components.auth.SignupForm.label.invitation')"
id="invitation-code" id="invitation-code"
v-model="payload.invitation" v-model="payload.invitation"
required required
@ -198,8 +198,9 @@ fetchInstanceSettings()
:key="idx" :key="idx"
:class="[{required: field.required}, 'field']" :class="[{required: field.required}, 'field']"
> >
<!-- TODO: Add `label` prop to `Textarea` component -->
<Textarea <Textarea
label="field.label" :label="field.label"
v-if="field.input_type === 'long_text'" v-if="field.input_type === 'long_text'"
:id="`custom-field-${idx}`" :id="`custom-field-${idx}`"
v-model="payload.request_fields[field.label]" v-model="payload.request_fields[field.label]"
@ -209,7 +210,7 @@ fetchInstanceSettings()
<Input <Input
v-else v-else
:id="`custom-field-${idx}`" :id="`custom-field-${idx}`"
label="field.label" :label="field.label"
v-model="payload.request_fields[field.label]" v-model="payload.request_fields[field.label]"
type="text" type="text"
:required="field.required" :required="field.required"