Set width sidemenu

Greetings, you can set the width of the sidemenu, especially the new version of the folding menu. Inherit a new menu from the MainScreen class and change the width but still don’t do it.

<sideMenu id="sideMenu" showSingleExpandedMenu="true" width="300px"/>

Any property I’m not changing?
In the picture it is a little bit evident the problem
Screenshot_20200422_044808

Regards,

Nelson F.

any suggestions on that?

Hello @nelsonflorez!

The new collapsible sidemenu is controlled by SCSS variables. You can see the list of SCSS variables in our documentation.

In your case, you need to change the $cuba-sidemenu-layout-expanded-width variable. To do this, you need to follow these steps:

  1. Create theme extension
  2. Edit theme variable by modifying the hover-ext-defaults.scss file:
$cuba-sidemenu-layout-expanded-width: 300px;

Regards,
Gleb

Thanks for your answer @durygin, but in my case I’m using the new Helium theme, which is installed as a component. Pardon my question, but how would you make this change?

Hello @nelsonflorez!

Follow the applying custom color preset instruction. After that, you will have a helium-ext-defaults.scss file in which you can make changes like described in my previous message:

Regards,
Gleb