Note |
---|
Tip |
Implementation in progress |
Important Links
...
...
| ||||||||
As part of the global layout updates, there is an opportunity to enable resizing of the LHS and RHS panels. Below outlines the minimum and maximum sizes for the panels as well as some rules for different breakpoints.
...
While dragging when the width approaches the default width within 16px (more or less), snap the panel width to the default. When the snapping happens, add an emphasis animation to the resize bar.
...
Resizing the LHS
Default channel LHS sidebar width: 240px
Touch devices
not resizable
For window widths <= 900:768
not resizable
Touch devices
not resizable(sidebar is hidden)
For window widths 901769-12001199:
min-width = 200px
max-width = 264px
For window widths 1201200-16801679:
min-width = 200px
max-width = 304px
For window widths >= 1680px:
min-width: 200px
max-width: 440px
...
Resizing the RHS
For window widths < = 900:
not resizable
Touch devices
not resizable
For window widths 901900-1200 1199
NOTE: RHS overlaps the channel at this viewport width
default = 400px
min-width = 304px
max-width = 400px (default)
For window widths 12011200-16801679
default width = 400px
min-width = 304px
max-width = 464px
For window widths >= 1680px
default width = 500px
min-width: 304px
max-width: 776px
...