- I have searched the issues of this repository and believe that this is not a duplicate.
What problem does this feature solve?
Currently when using Responsive Sider on a smaller screen, when the sider appears it would have to squash the main content (and all contents within it). It is not a big problem on bigger mobile devices like an iPad but on cellphones it creats chaos and unnecessary performance expense.
I propose a property called "expandBehavior" which let the user to choose when the sider appears should it be "over the top" of the main content, or "At the side" of the main content.
What does the proposed API look like?
<Sider width={300} breakpoint="lg" collapsedWidth="0" expandBehaviour="overTheTop">
{children}
</Sider>
The above setting should allow the Sider to be on top of the main content
with absolute positioning, 100% height of the screen and a dark overlay to cover the content when Sider appears.
<Sider width={300} breakpoint="lg" collapsedWidth="0" expandBehaviour="sideBySide">
{children}
</Sider>
The above setting should allow the Sider to be at the side of the content
. This is the current behaviour.
6条答案
按热度按时间pkwftd7m1#
I'm waiting for it too :)
dphi5xsq2#
I created Drawer for mobile menu and sider for desktop and it works and look very well
mlmc2os53#
I am having that issue too...
The ideal state would be:
aelbi1ox4#
Any updates on this? This is a very important feature in my opinion. Even I require this in all the apps that I make with Ant design.
oprakyz75#
Is there an easy fix/hack for this?
5sxhfpxr6#
I've fixed this in couple of lines of css, there might be a better solution but this one works.