Adjustable template side-panel width

I am trying to increase the side panel width in the MaterialTemplate
I saw an older post Here
For some reason, it does not work for me
This is my code…

import panel as pn
css = “”"
.mdc-drawer {
background: #FFFFFF; /* GRAY 50 */
width: 700px !important;
}
.mdc-drawer.mdc-drawer–open:not(.mdc-drawer–closing)+.mdc-drawer-app-content {
margin-left: 700px !important;
}
“”"
pn.extension(raw_css=[css])
material = pn.template.MaterialTemplate( title=‘Material Template’,)
material.sidebar.append(pn.pane.Markdown("# Title"))
material.show()

No matter what I tried, the size of the sidepanel did not change.
panel version 0.11.2

Can anyone help? :slight_smile:

is it impossible? :frowning:

1 Like

The below is a work around.

Would you file a feature request for a sidebar_width parameter on the template? Please include your code in the Feature Request. Thanks.

import panel as pn
css = """
.mdc-drawer {
background: #FFFFFF; /* GRAY 50 */
width: 700px !important;
}
.mdc-drawer.mdc-drawer–open:not(.mdc-drawer–closing)+.mdc-drawer-app-content {
margin-left: 700px !important;
}
"""
css_pane = pn.pane.HTML("<style>" + css + "</style>", width=0, height=0, sizing_mode="fixed", margin=0)
material = pn.template.MaterialTemplate( title='Material Template',)
material.sidebar[:]=[css_pane, pn.pane.Markdown("# Title")]
material.show()

Thanks
this did solve my problem
yet, i had to adjust the left margin of .main
and when i close the menu, i am left with a quite large left margin…

Where should I submit the feature request?

Thanks in advance

You should submit bugs and feature requests here Issues · holoviz/panel (github.com)

Submitted already.
Thanks :slight_smile:

1 Like