Hi @haroldm,
Sorry for the late reply – I must have missed this thread when you posted it. If you mean the width of the menu toggle strip to the left, it’s width is governed by the --eksell-aside-width CSS variable, which you can modify with this CSS:
:root { --eksell-aside-width: 8rem; }
(You can add this to Appearance → Customize → Additional CSS.)
Keep in mind that the code above will set that width on all screen sizes. If you want screen size specific widths (and target, say, only tablets or only desktop sizes), you’ll need to add media queries to the CSS.
If you mean the width of the actual menu modal (shown when you click the menu button), you can change that with this CSS:
@media ( min-width: 700px ) {
.menu-modal-inner { width: 32rem; }
}
— Anders
Thanks for much for responding. No worries to not responding sooner I’m just glad you did. So I used the one code to change the menu toggle strip. It works like I want on desktop but then on mobile it adds a grey bar whereas without that code there is no greybar. What can I do to make it so it’s only adjusting the toggle strip on the computer side but not making any changes to mobile, devices or tablets? Thanks again as always!
Hi again @haroldm,
Sorry for the late reply. The code I posted should’ve been wrapped in a media query, so it only triggers on desktop. This is the correct CSS:
@media ( min-width: 1200px ) {
:root { --eksell-aside-width: 8rem; }
}
— Anders
