fgilde/MudBlazor.Extensions

MudGrid support in resizable MudDialog

Closed this issue · 1 comments

dsx20 commented

Is is possible to add MudGrid support in context of a MudDialog. At present it seems a MudGrid within a MudDialog doesn't react to the dialog being resized.

When trying out the https://mudblazor.com/components/grid#grid-with-breakpoints example and also applying the resize ability (provided by this MudBlazor.Extensions library) the controls always stay in their original locations. Only resizing of the main browser document does the MudGrid on the dialog react and subsequently re-layout its controls.

We haven't decided on whether to use the MudGrid or our own flex based solution but would prefer the former approach. As always we will contribute to this issue should we find a solution ourselves.

fgilde commented

You're totally right. This is currently not supported. I will try to fix/change this behavior if I'm able to. It seems that MudBlazor uses some kind of ResizeHandler with a size provider that only reacts to browser size changes. This means if you put your breakpoints in a div and change the width of the div, it will also not work. It appears that breakpoints are designed for browser size breaks only. Therefore, this will not work, whether you're resizing a dialog or using it anywhere else.

    <div style="width:30px">
    <MudHidden Breakpoint="Breakpoint.SmAndDown">
        <p>HELLO Big</p>
    </MudHidden>
    <MudHidden Breakpoint="Breakpoint.SmAndDown" Invert="true">
        <p>HELLO Small</p>
    </MudHidden>
    </div>

Maybe it's better to use CSS Media queries or, even better, if you can do CSS container queries.

However, I'll try to find a solution. Perhaps I can register my own ResizeHandler or something similar, but I can't guarantee that I can fix it.