Feature Request: Make sidebar partially minimizable and swipeable

Is your feature request related to a problem? Please describe…

1. I need to use sidebars as an additional menu and as a search with different filters. When user opens site, sidebars are not shown. It would be sweet if sidebars could be shown partially/minimized. Partially here means that sidebar either may show some icons (if width is big 😃 or simply be blank, so just line of border is visible (if width is small, so it can be useful on mobiles).

2. Additionally would be sweet if sidebar could be swipeable on mobile (or on desktop also?), so user seeing just a small part of, for example left sidebar, could understand that there is some content on the left and can a) swipe to the right to open it fully, and b) when opened, swipe to the left to minimize it.

3. Also, if it is not so difficult, maybe for somebody it would be useful to have sidebar next to the main block of site, instead of over it, ie when left sidebar is opening, main block is sliding to the right (like shown here).

Describe the solution you’d like.

Add 3 dynamic props:

1. For example minimized-width="10"[px] (where 0 is the current implementation, ie fully hidden when minimized).
2. swipeable, which allows to turn on support of swiping on mobile (or on desktop also, as some image libraries do?).
3. slider? to slide content of site when sidebar is opening.

[mariusa]

I guess it’s implied by screenshots above, but another important property to add is for sidebar content to push page content, instead of overlaying over it.

Example of sidebar: https://coreui.io/demo/3.1.0/#main.html

Note how it’s on by default, but can be completely hidden by menu icon at top-left. It can also be minimized, as in the example above.

[TitanFighter]

So, there should be three stages of minimization:

1. Hidden (current implementation).

2. Super minimized, useful on mobiles (left blue line/bar should be swipable):

3. Partially minimized: