livewire / flux

The official Livewire UI component library
https://fluxui.dev
485 stars 42 forks source link

Bug selected - options type = listbox #658

Closed mmbd-mkulas closed 6 days ago

mmbd-mkulas commented 1 week ago
![Image](https://github.com/user-attachments/assets/4a0c5e83-33d5-4aff-bc5c-2bfa0599e40c) ![Image](https://github.com/user-attachments/assets/e1b479a5-1481-4cba-af6e-b8779875b4aa)
igmltd commented 1 week ago

Looks like a styling issue, below works fine.

have you followed the installation steps?

https://fluxui.dev/docs/installation

<flux:select variant="listbox" placeholder="Select role...">
    <flux:option>
        <div class="flex items-center gap-2">
            <flux:icon.shield-check variant="mini" class="text-zinc-400" /> Owner
        </div>
    </flux:option>

    <flux:option>
        <div class="flex items-center gap-2">
            <flux:icon.key variant="mini" class="text-zinc-400" /> Administrator
        </div>
    </flux:option>

    <flux:option>
        <div class="flex items-center gap-2">
            <flux:icon.user variant="mini" class="text-zinc-400" /> Member
        </div>
    </flux:option>

    <flux:option>
        <div class="flex items-center gap-2">
            <flux:icon.eye variant="mini" class="text-zinc-400" /> Viewer
        </div>
    </flux:option>
</flux:select>

Image

mmbd-mkulas commented 1 week ago

Yes, the problem was resolved when I updated TailwindCSS to the latest version. Thank you. Tailwind version 3.1.0 is not supported.