Collapsing Sidebar on browser resize

Hello all,

I'm a bit new to Blazor and to a greater extent, Radzen Blazor components, so I apologize in advance if this is something easy, but I am getting stuck with the sidebar layout. My goal is to have the RadzenSidebar collapse when the browser size goes below 768px and have the RadzenSidebarToggle appear as a means to open it again. I have read that the most appropriate place to do this is in a @media directive in the CSS. The good news is that I've been able to get the RazdenSidebarToggle to hide itself using the display directive, however, I do not see where the Expanded property is available in CSS for the RadzenSidebar, it is a component property. I tried to use the display directive for the Sidebar thinking it might be a proxy to setting the Expanded property in CSS, but it only hides the sidebar, it does not collapse it to allow the body to take over the entire width of the form (this is the intended behavior).

Is there any method of linking the CSS to the Expanded property? Possibly some event that is fired and accessible to perform this property set? Any assistance is appreciated.


Hi @cfshuhl,

While there is no way to set the Expanded property of the Sidebar from CSS you can check this forum thread. It shows how we are dealing with a similar situation with the Radzen Blazor online demos.