make custom fields titles smaller on mobile devices

pull/440/head
Alex Turchyn 9 months ago committed by Pete Matsyburka
parent 6d2a8ca3d3
commit 5bed6448dc

@ -49,7 +49,7 @@
<MarkdownContent :string="field.description" />
</div>
<FileDropzone
:message="`${t('upload')} ${field.name || t('files')}${field.required ? '' : ` (${t('optional')})`}`"
:message="`${t('upload')} ${(field.title || field.name) || t('files')}${field.required ? '' : ` (${t('optional')})`}`"
:submitter-slug="submitterSlug"
:multiple="true"
:dry-run="dryRun"

@ -5,18 +5,24 @@
:class="{ 'mb-2': !field.description }"
>
<label
v-if="showFieldNames"
:for="field.uuid"
class="label text-2xl"
class="label text-lg sm:text-2xl"
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>
{{ field.name && showFieldNames ? field.name : t('date') }}
{{ field.name || t('date') }}
</template>
<template v-if="!field.required">
<span
class="ml-1"
:class="{ 'hidden sm:inline': (field.title || field.name || t('date') ).length > 10 }"
>
({{ t('optional') }})
</template>
</span>
</template>
</label>
<button

@ -164,7 +164,7 @@
v-if="showFieldNames && (currentField.name || currentField.title)"
:for="currentField.uuid"
dir="auto"
class="label text-2xl"
class="label text-lg sm:text-2xl"
:class="{ 'mb-2': !currentField.description }"
>
<MarkdownContent
@ -173,7 +173,11 @@
/>
<template v-else>
{{ currentField.name }}
<template v-if="!currentField.required">({{ t('optional') }})</template>
</template>
<template v-if="!currentField.required">
<span :class="{ 'hidden sm:inline': (currentField.title || currentField.name).length > 24 }">
({{ t('optional') }})
</span>
</template>
</label>
<div
@ -221,7 +225,7 @@
v-if="showFieldNames && (currentField.name || currentField.title)"
:for="currentField.uuid"
dir="auto"
class="label text-2xl"
class="label text-lg sm:text-2xl"
:class="{ 'mb-2': !currentField.description }"
>
<MarkdownContent
@ -230,7 +234,11 @@
/>
<template v-else>
{{ currentField.name }}
<template v-if="!currentField.required">({{ t('optional') }})</template>
</template>
<template v-if="!currentField.required">
<span :class="{ 'hidden sm:inline': (currentField.title || currentField.name).length > 24 }">
({{ t('optional') }})
</span>
</template>
</label>
<div

@ -2,8 +2,18 @@
<div v-if="modelValue">
<div class="flex justify-between items-center w-full mb-2">
<label
class="label text-2xl"
>{{ showFieldNames && field.name ? field.name : t('image') }}</label>
v-if="showFieldNames"
:for="field.uuid"
class="label text-lg sm:text-2xl"
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>
{{ field.name || t('image') }}
</template>
</label>
<button
class="btn btn-outline btn-sm"
@click.prevent="remove"
@ -35,7 +45,7 @@
<MarkdownContent :string="field.description" />
</div>
<FileDropzone
:message="`${t('upload')} ${field.name || t('image')}${field.required ? '' : ` (${t('optional')})`}`"
:message="`${t('upload')} ${(field.title || field.name) || t('image')}${field.required ? '' : ` (${t('optional')})`}`"
:submitter-slug="submitterSlug"
:dry-run="dryRun"
:accept="'image/*'"

@ -5,17 +5,18 @@
:class="{ 'mb-2': !field.description }"
>
<label
class="label text-2xl"
v-if="showFieldNames"
class="label text-lg sm:text-2xl"
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>
{{ showFieldNames && field.name ? field.name : t('initials') }}
{{ field.name || t('initials') }}
</template>
</label>
<div class="space-x-2 flex">
<div class="space-x-2 flex flex-none">
<span
v-if="isDrawInitials"
class="tooltip"

@ -3,13 +3,19 @@
v-if="showFieldNames && (field.name || field.title)"
:for="field.uuid"
dir="auto"
class="label text-2xl"
class="label text-lg sm:text-2xl"
:class="{ 'mb-2': !field.description }"
><MarkdownContent
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>{{ field.name }}</template>
<template v-if="!field.required">
<span :class="{ 'hidden sm:inline': (field.title || field.name).length > 24 }">
({{ t('optional') }})
</span>
</template>
</label>
<div
v-if="field.description"

@ -3,15 +3,18 @@
v-if="showFieldNames && (field.name || field.title)"
:for="field.uuid"
dir="auto"
class="label text-2xl"
class="label text-lg sm:text-2xl"
:class="{ 'mb-2': !field.description }"
><MarkdownContent
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>{{ field.name }}</template>
<template v-if="!field.required">
<span :class="{ 'hidden sm:inline': (field.title || field.name).length > 24 }">
({{ t('optional') }})
</span>
</template>
</label>
<div

@ -1,7 +1,7 @@
<template>
<label
v-if="!modelValue && !sessionId"
class="label text-2xl mb-2"
class="label text-lg sm:text-2xl mb-2"
>
<MarkdownContent
v-if="field.title"

@ -1,8 +1,9 @@
<template>
<div>
<label
v-if="showFieldNames"
:for="isCodeSent ? 'one_time_code' : field.uuid"
class="label text-2xl"
class="label text-lg sm:text-2xl"
:class="{ 'mb-2': !field.description }"
>
<MarkdownContent
@ -10,10 +11,7 @@
:string="field.title"
/>
<template v-else>
{{ showFieldNames && field.name ? field.name : t('verified_phone_number') }}
<template v-if="!field.required">
({{ t('optional') }})
</template>
{{ field.name || t('verified_phone_number') }}
</template>
</label>
<div

@ -8,17 +8,18 @@
:class="{ 'mb-2': !field.description }"
>
<label
class="label text-2xl"
v-if="showFieldNames"
class="label text-lg sm:text-2xl"
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>
{{ showFieldNames && field.name ? field.name : t('signature') }}
{{ field.name || t('signature') }}
</template>
</label>
<div class="space-x-2 flex">
<div class="space-x-2 flex flex-none">
<span
v-if="isTextSignature && format !== 'typed' && format !== 'upload'"
class="tooltip"

@ -3,15 +3,18 @@
v-if="showFieldNames && (field.name || field.title)"
:for="field.uuid"
dir="auto"
class="label text-2xl"
class="label text-lg sm:text-2xl"
:class="{ 'mb-2': !field.description }"
><MarkdownContent
>
<MarkdownContent
v-if="field.title"
:string="field.title"
/>
<template v-else>{{ field.name }}</template>
<template v-if="!field.required">
<span :class="{ 'hidden sm:inline': (field.title || field.name).length > 24 }">
({{ t('optional') }})
</span>
</template>
</label>
<div

@ -1,6 +1,6 @@
<template>
<label
class="label text-2xl mb-2"
class="label text-lg sm:text-2xl mb-2"
>
<MarkdownContent
v-if="field.title"

Loading…
Cancel
Save