Is there a way to set a minimum size for the sidebar?

Whether it's a percentage or a fixed pixel minimum? I'd like the sidebar to be a bit wider on a small laptop screen on startup.

In the editor (right or left?) or dashboard?

hey @zenofmud id like to know for the dashboard please?

There is couple of CSS rules controlling the sidebar wideness. Due the fact that the layout should behave nicely on multiple screens, the rules are made with media query so it is not as simple as "set width for one element" . It is not possible to give an exact advise so I just point out the rules which you then can override and see what will happen.

@media(max-width: 660px) {
    md-sidenav,
    md-sidenav.md-locked-open,
    md-sidenav.md-closed.md-locked-open-add-active {
    	min-width: 64px !important;
        width: auto;
    	max-width: 200px !important;
    }
}
@media(min-width: 661px) {
    md-sidenav,
    md-sidenav.md-locked-open,
    md-sidenav.md-closed.md-locked-open-add-active {
    	min-width: 64px !important;
        width: auto;
    	max-width: 320px !important;
    }
}
1 Like

in the editor.

Which sidebar - right or left?

there's technically only one sidebar from a ui name perspective. The red-ui-sidebar is on the right. The palette bar is on the left. No need to adjust that one.

What’s wrong with grabbing it and resizing it?

Because that's a major inconvenience to do that every time the editor is loaded. I'm building a node that adds a sidebar menu, and I'd like it to be wider by default without any manual intervention.

You're building a node that is going to add another sidebar to the editor?

I'm not sure how you would do that. Maybe @dceejay would be able to offer some guidance.

I think the open width of the sidebar is stored in the users browser local storage, so overriding something a user sets is generally a bad idea.

I definitely agree. What I'm inquiring about is establishing a minimum width for the sidebar. So that when a user attempts to size the sidebar it won't go any smaller than that established width.

No matter though, I checked the code, and it doesn't look like this is possible without changing some of the functionality of the drag event for the for the red-ui-sidebar-separator element.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.