canopy
canopy copied to clipboard
Remove placeholder for date input
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.
@pauleustice To raise a ticket for this work
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:
That's the same colour as the main input text, so will be accessible in terms of contrast.
Yes, that sounds good @pauleustice. Thank you.