forked from tsai/budibase
6 changed files with 25 additions and 16 deletions
@ -1,21 +1,39 @@ |
|||||
<script> |
<script> |
||||
import Flatpickr from "svelte-flatpickr" |
import Flatpickr from "svelte-flatpickr" |
||||
import { Label, Input } from "@budibase/bbui" |
import { Label, Input } from "@budibase/bbui" |
||||
import 'flatpickr/dist/flatpickr.css' |
import "flatpickr/dist/flatpickr.css" |
||||
|
|
||||
|
export let label |
||||
|
export let value |
||||
|
|
||||
const PICKER_OPTIONS = { |
const PICKER_OPTIONS = { |
||||
enableTime: true |
enableTime: true, |
||||
|
// element: "#date-picker" |
||||
} |
} |
||||
|
|
||||
export let label |
|
||||
export let value |
|
||||
</script> |
</script> |
||||
|
|
||||
<div class="bb-margin-m"> |
<div class="bb-margin-m"> |
||||
<Label small forAttr={'datepicker-label'}>{label}</Label> |
<Label small forAttr={'datepicker-label'}>{label}</Label> |
||||
<Flatpickr |
<Flatpickr |
||||
options={PICKER_OPTIONS} |
|
||||
placeholder={label} |
placeholder={label} |
||||
|
options={PICKER_OPTIONS} |
||||
bind:value |
bind:value |
||||
/> |
/> |
||||
</div> |
</div> |
||||
|
|
||||
|
<style> |
||||
|
:global(.flatpickr-input) { |
||||
|
width: 100%; |
||||
|
min-width: 0; |
||||
|
box-sizing: border-box; |
||||
|
color: var(--ink); |
||||
|
border-radius: 5px; |
||||
|
border: none; |
||||
|
background-color: var(--grey-2); |
||||
|
padding: var(--spacing-m); |
||||
|
font-size: var(--font-size-xs); |
||||
|
margin: 0; |
||||
|
outline-color: var(--blue); |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue