defuj/apkt-eis
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

change datepicker style

Browse Source
This commit is contained in:
kur0nek-o
2023-11-03 12:35:43 +07:00
parent f58a148bd0
commit 09d4d1a714
9 changed files with 168 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/DatePicker.vue
View File

@ -1,6 +1,8 @@
<script setup lang="ts">
import { PhCalendarBlank } from '@phosphor-icons/vue';
import { ref } from 'vue'
import VueTailwindDatepicker from 'vue-tailwind-datepicker'
const dateValue = ref('')
const formatter = ref({
@ -17,17 +19,20 @@
separator=" s/d "
:shortcuts="false"
:auto-apply="false"
as-single
use-range
v-slot="{ value, placeholder }"
>
<div class="flex">
<div class="flex-1">
<button
type="button"
class="w-full px-4 py-2 text-sm leading-6 placeholder:text-gray-400 text-gray-900 border-0 border-transparent rounded-lg outline-0 bg-gray-200 focus:outline-0 focus:border-0 focus:ring-0"
class="w-full flex items-center justify-between px-4 py-2 text-sm leading-6 placeholder:text-gray-400 text-gray-900 border-0 border-transparent rounded-lg outline-0 bg-gray-200 focus:outline-0 focus:border-0 focus:ring-0"
>
<span class="text-gray-900">
{{ value || placeholder }}
</span>
<PhCalendarBlank size="18" weight="regular"/>
</button>
</div>
</div>