fix: inputs size

This commit is contained in:
DomWane 2024-10-01 13:53:23 +02:00
parent caf8f42620
commit 06d3815cd3
3 changed files with 15 additions and 20 deletions

View file

@ -76,30 +76,25 @@ const days = computed(() => {
lg="w-1/2"
relative
>
<SelectBox
<ProjectCreateComponentsSelect
v-model="day"
w-full
class="lg:w-full!"
:options="days.map(day => ({ label: day.toString(), value: day }))"
placeholder="Day"
:border-opacity="30"
:is-margin-top="false"
/>
<SelectBox
<ProjectCreateComponentsSelect
v-model="month"
w-full
mx--2px
class="lg:w-full!"
ml--2px
:options="months.map(month => ({ label: month.label, value: month.value }))"
placeholder="Month"
:border-opacity="30"
:is-margin-top="false"
/>
<SelectBox
<ProjectCreateComponentsSelect
v-model="year"
w-full
class="lg:w-full!"
ml--2px
:options="years.map(year => ({ label: year.toString(), value: year }))"
placeholder="Year"
:border-opacity="30"
:is-margin-top="false"
/>
</div>
<span

View file

@ -45,13 +45,13 @@ const model = defineModel<string>()
lg="flex flex-row gap-24px items-center"
relative
>
<div v-bind="$attrs">
<div v-bind="$attrs" shrink-0>
<textarea
v-if="textarea"
v-model="model"
:rows="textareaRows"
:placeholder="placeholder"
class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:ring-0 focus:outline-none"
class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:outline-none focus:ring-0 focus:border-white"
:class="error ? 'border-app-danger/50' : 'border-white/30'"
/>
<input
@ -59,7 +59,7 @@ const model = defineModel<string>()
v-model="model"
:placeholder="placeholder"
type="text"
class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:ring-0 focus:outline-none"
class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:outline-none focus:ring-0 focus:border-white"
:class="error ? 'border-app-danger/50' : 'border-white/30'"
>
</div>

View file

@ -7,7 +7,7 @@ const emits = defineEmits(['update:modelValue'])
interface SelectProps {
options: InputOption[]
label?: string
modelValue: string
modelValue: any
placeholder?: string
required?: boolean
hint?: string
@ -24,7 +24,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
lg="flex flex-row gap-24px"
relative
>
<div lg="w-1/2">
<div v-bind="$attrs" lg="w-1/2">
<HeadlessListbox
v-model="selectedValue"
as="div"
@ -48,7 +48,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
>
<HeadlessListboxButton
as="div"
class="relative w-full cursor-pointer p-8px text-left border-2px text-app-white bg-black border-white/30 sm:text-sm sm:leading-6"
class="relative w-full cursor-pointer p-8px text-left border-2px text-app-white bg-black border-white/30 sm:text-sm sm:leading-6 aria-expanded:border-white aria-expanded:z-10"
>
<span
class="block truncate mr-8px"
@ -71,7 +71,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
leave-to-class="opacity-0"
>
<HeadlessListboxOptions
class="absolute z-100 max-h-60 w-full divide-y-2px border-2px border-t-0 overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm border-white/30"
class="absolute z-100 max-h-60 w-full divide-y-2px border-2px border-t-0 overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm border-white"
>
<HeadlessListboxOption
v-for="option in props.options"