Dark mode color difference between listbox and date picker

[ju5t]

Flux version

v2.0.0

Livewire version

v3.5.20

Tailwind version

v4.0.6

What is the problem?

There seems to be a color difference between the date picker and the listbox in dark mode. The background of the date picker is much darker. This may be intentional but as we use them side by side in forms, it feels a bit off.

Listbox:

Date picker:

Code snippets

<flux:date-picker />

<flux:select wire:model="industry" placeholder="Choose industry...">
    <flux:select.option>Photography</flux:select.option>
    <flux:select.option>Design services</flux:select.option>
    <flux:select.option>Web development</flux:select.option>
    <flux:select.option>Accounting</flux:select.option>
    <flux:select.option>Legal services</flux:select.option>
    <flux:select.option>Consulting</flux:select.option>
    <flux:select.option>Other</flux:select.option>
</flux:select>

How do you expect it to work?

I expected the two backgrounds to be the same, as they are both form elements.

Please confirm (incomplete submissions will not be addressed)

• I have provided easy and step-by-step instructions to reproduce the bug.
• I have provided code samples as text and NOT images.
• I understand my bug report will be closed if I haven't met the criteria above.

[calebporzio]

Mmmm yeah I could see that point. I'll ask Hugo and see what he thinks. date picker dropdowns are actually dialogs/modals that are positioned like dropdowns which is the only argument I could see for keeping them different (our modal is darker than the dropdown).

But lemme see about this

[ju5t]

@calebporzio the plot thickens: they're actually darker than modals too :)

In dark mode the calender uses bg-zinc-900. The modal is bg-zinc-800.

[calebporzio]

haha oof - I talked to Hugo and he agrees this should not be the way. We will have to carve out some time to unify these styles I think

[calebporzio]

Good catch @ju5t

[BubeDameKoenig]

@calebporzio There are a few more color differences to compare.

Theme: Cyan (bg-accent)
Badge: Cyan (Full)

Separator vs. Card

[joshhanley]

There is also another issue related to inconsistent colours #1093