How to change placement of block or region on events? I want to change the placement of 2 regions based on window size. I know that I can print 2 blocks and use css dipslay:none based on window size, but I prefer not to double print a block.

Is there any way I can change the placement of blocks / regions based on events, such as screen size, using JS or similar?
You can use the flexbox order property: https://css-tricks.com/almanac/properties/o/order/