1

I am using Vaadin 24. I use a side menu and I use "DrawerToggle" to show / hide menu items when the burger icon is pressed. Works very well.

DrawerToggle toggle = new DrawerToggle();
 SideNav nav = createSideNav();

The SideNavItems are created this way:

SideNavItem item = new SideNavItem(label);
item.setPrefixComponent(icon);

As said before, this works fine. But my aim is to hide the label only when the drawer is collapsed. I'd like the icons to remain visible even if the drawer is collapsed. So even if collapsed, the drawer should remain visible, with a width of 60px maybe, and still show the icons.

Is there any way to achieve this ?

I tried with lots of CSS, but I think it interferes with Vaadin's build in mechanism to open and close the drawer.

thanks, Thorsten

Improve this question

1 Answer 1

Reset to default
0

Yeah, no, that is simply not supported at the moment. The drawer can be either opened or closed, nothing in between.

You'd need to implement your own icons-only state for the AppLayout and the SideNav.

The AppLayout drawer's width is configurable via the css property --vaadin-app-layout-drawer-width, so that's one key to the solution. Unfortunately SideNav really doesn't make it easy to hide the item labels with css, though, so you might be better off handling that in Java.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.