In my program, the menu up top takes up the full width of the window. I saved some space with removing the arrows. This wasn’t enough because the menu spreads out further than then minimum width of the window. How can I force the collapsed menu whenever the menu is expanded outside of the viewer? For instance, if the window width drops below 1080 then collapse the menu into the single menu icon.
It looks like Xojo bootstrap theme is using navbar-expand-md that the min width is 768px
You can try to use JavaScript to change the class to navbar-expand-lg that the min width is 992px (navbar-expand-xl is 1200px) or create a bootstrap them with navbar-expand-md section changing the min width to 1080. For me it was easy to pull the Xojo bootstrap from the browser, search for @media and change 768 to 1080, it seems to work but I don’t know if that could break something else.
I hope that in the future Xojo allows us to change things like those.
Edit: if you want the bootstrap theme with collapse width set to 1080, let me know.
1 Like
You could do this in the page’s Resized event, and hide the toolbar behind a hamburger menu (
). You could also use something like GraffitiSidebar when the display is too small to show a WebContainer that contains your menu items as buttons (or a GraffitiAccordionMenu, or anything else you can dream up).