daisyui/react-daisyui

dropdown goes offscreen

WingsDevelopment opened this issue · 1 comments

besides no automatic changing classes from "dropdown" to dropdown so i was wondering is there a clean way to change class from just "dropdown" to "dropdown dropdown-end" for example.

is there at least a way to implement something like "dropdown dropdown-start md:dropdown-end" ? and make my dropdown behave in some other way in different devices?

I guess what i try to achieve is:
@media (max-width: 640px) {
.mobile-dropdown-end {
@apply dropdown-end;
}
}
but with tailwind..

Your best bet and the more "Tailwind" approach for this would be to use the daisyUI classes with Tailwind's breakpoints (https://tailwindcss.com/docs/screens).

If you want to do that using this library, you would have to involve some amount of JS to read the screen size and adjust the props accordingly.