Flux version
v2.17.1
Livewire version
v4.4.2
Tailwind version
v4.3.3
Browser and Operating System
Google Chrome 147.0.0.0 on macOS 27.0
What is the problem?
The default button trigger for flux:date-picker renders its placeholder with
text-zinc-400. In light mode this resolves to #9f9fa9 on a white
background, producing a contrast ratio of 2.62:1.
axe 4.12.1 reports the serious color-contrast rule because normal-sized text
requires at least 4.5:1 under WCAG 2 AA. The failure affects the default
single-date and range placeholders. The same isolated reproduction does not
report a contrast violation in dark mode.
Code snippets to replicate the problem
After completing the standard Flux Pro installation, render:
<flux:date-picker label="Reporting period" mode="range" />
Steps:
- Include the documented Flux assets without published component overrides.
- Build the assets and clear compiled Blade views.
- Open the page in light mode with no selected date.
- Run axe with the WCAG A and AA tags.
- Observe
color-contrast on [data-flux-date-picker-placeholder].
Rendered placeholder:
<span
class="text-zinc-400 ... dark:text-zinc-400 ..."
data-flux-date-picker-placeholder
>
Select a date range
</span>
axe 4.12.1 reports:
color-contrast (serious)
Foreground: #9f9fa9
Background: #ffffff
Contrast ratio: 2.62:1
Expected: 4.5:1
Screenshots/ screen recordings of the problem
Not included. The computed foreground and background colors, contrast ratio
and exact axe result are included above as searchable text.
How do you expect it to work?
The default placeholder should meet WCAG AA contrast in light mode while
remaining visually distinguishable from a selected value. For example, a
darker placeholder token could be used for the light theme while preserving
the existing dark-theme treatment.
Please confirm (incomplete submissions will not be addressed)
Flux version
v2.17.1
Livewire version
v4.4.2
Tailwind version
v4.3.3
Browser and Operating System
Google Chrome 147.0.0.0 on macOS 27.0
What is the problem?
The default button trigger for
flux:date-pickerrenders its placeholder withtext-zinc-400. In light mode this resolves to#9f9fa9on a whitebackground, producing a contrast ratio of 2.62:1.
axe 4.12.1 reports the serious
color-contrastrule because normal-sized textrequires at least 4.5:1 under WCAG 2 AA. The failure affects the default
single-date and range placeholders. The same isolated reproduction does not
report a contrast violation in dark mode.
Code snippets to replicate the problem
After completing the standard Flux Pro installation, render:
Steps:
color-contraston[data-flux-date-picker-placeholder].Rendered placeholder:
axe 4.12.1 reports:
Screenshots/ screen recordings of the problem
Not included. The computed foreground and background colors, contrast ratio
and exact axe result are included above as searchable text.
How do you expect it to work?
The default placeholder should meet WCAG AA contrast in light mode while
remaining visually distinguishable from a selected value. For example, a
darker placeholder token could be used for the light theme while preserving
the existing dark-theme treatment.
Please confirm (incomplete submissions will not be addressed)