Create inverted master-detail page responsive layout react

Hi, I have tradition master-detail pages layout in whole app, but on this page I need to invert sizes (did it by adding custom divs flexbox css --see gif).
But I’d like to make it responsive, cause all need to be included in a tag, if using simple

it will not be removed by dom and remains when changing the page.
Any reccomendation to do it?
Can I just use master-detail layout here?
Thanks.

—page—
ezgif-1-2c10c28f7f83

—code—

Anyone can help pls? :grimacing:

There is no such thing as inverted master detail. If you need to do something responsive:

  • you can use side panels (which can be nested into the page) with breakpoints
  • just use CSS media queries to hide/show something based on screen size

ok will try thanks :smiley: