Hide unselectable minutes

[RvmMim]

Hi! I set minuteIncrement to 30 so the user can select only half hours but all unselectable minutes are still visible.
They can't be selected (the closest half hour is automatically selected) but they're visible.
Is there a way to hide them ?

[mskocik]

It's not possible ATM. Not even through CSS, because there is not specific "minute-view" class.

I could add css class for minute view. And then you could style it yourself. Would that solution be enough for you?

[mskocik]

Yes, that's why setting 'disabling' it through css is the only option

[RvmMim]

It has this same behavior with the given solution
Update the App.svelte you sent with
`<script>
import SveltyPicker from '[email protected]';
</script>

<style> :global( .is-minute-view button:not([data-value="00"]):not([data-value="30"]):not([data-value="15"]):not([data-value="45"]) ) { opacity: 0.1; cursor: default; } </style>`

and you'll see it

[mskocik]

You mean that hours can move up and down when you select 00? Or styling, that you can see semitransparent hour values?

[RvmMim]

Set minuteIncrement to 15
"Hide" .is-minute-view when data_value = 0 or 15 or 30 or 45
Pick hour
Minute picker is on 0 by default
Click 30 and 15 will be selected, then click 45 and 30 will be selected etc.

And it does the same without the hiding .is-minute-view part

[mskocik]

Oh finally we are on the same page! It seems more like a bug, that selected value does not resolve properly.