search

Vuepic / vue-datepicker

Datepicker component for Vue 3
https://vue3datepicker.com
MIT License
1.38k stars 137 forks source link

ui input style width #916

Closed Thuytran79 closed 2 weeks ago

Thuytran79 commented 3 weeks ago

I can't fix input width. I try to used input-class-name to the width fit content but it's not working.

<VueDatePicker v-model="monthModeValue" position="center" locale="ja" format="yyyy年MM月" auto-apply :clearable="false" :enable-time-picker="false" @update:modelValue="emitSelectedDate" input-class-name="dp-custom-input" month-picker/>

.dp-custom-input { border: none; width: 150px; min-width: fit-content; font-size: larger; font-weight: bold; &:focus { outline: none; border: none; box-shadow: none; } }

image

Jasenkoo commented 2 weeks ago

You can just target the class directly, or use a slot input.

The input-class-name prop is deprecated.