canopy icon indicating copy to clipboard operation
canopy copied to clipboard

Remove placeholder for date input

Open kata-lin opened this issue 1 year ago • 3 comments

The placeholder for the date input doesn't have any styling added especially regarding colour. Due to this the user agent stylesheet is being applied and in Safari's case the contrast ratio fails from accessibility point of view.

Since the component already has a hint, the best option is to be able to toggle or completely remove the placeholder.

kata-lin avatar Mar 11 '24 14:03 kata-lin

@pauleustice To raise a ticket for this work

pauleustice avatar Apr 09 '24 09:04 pauleustice

Hi @kata-lin! I've investigated this and think the best option is to simply apply a specific colour to the placeholder shadow DOM element for the input.

Using color-charcoal (#333) makes it look like this:

Screenshot 2024-05-07 at 12 34 48

That's the same colour as the main input text, so will be accessible in terms of contrast.

pauleustice avatar May 07 '24 11:05 pauleustice

Yes, that sounds good @pauleustice. Thank you.

kata-lin avatar May 07 '24 12:05 kata-lin