Next.js Discord

Discord Forum

Modify tailwind upon useState

Unanswered
Cesky Terrier posted this in #help-forum
Open in Discord
Cesky TerrierOP
Hi! So I have a sidebar that uses tailwind and have a button that expands the sidebar in and out. Basically, on mobile I want it to be const [expanded, setExpanded] = useState(false); but anything larger than md I want it to change to const [expanded, setExpanded] = useState(true);

What's the best way to handle that?

I've attached the full sidebar there for some context. Line 22 is where the value is set for if it's expanded or not.

3 Replies

Brown bear
@Cesky Terrier there one doubt that its should always open in screen greater then md or there it will be close-able . if its always close-able and you just wants change initial state then you case check device width on that basis change initial value
Brown bear
use default state of const [expanded, setExpanded] = useState(false); on the basis of divce width
window.innerwidth you can use