3 * CSS for off-canvas dialog.
6 /* Position the off-canvas dialog container outside the right of the viewport. */
7 .ui-dialog-off-canvas {
8 box-sizing: border-box;
13 /* Wrap the form that's inside the off-canvas dialog. */
14 .ui-dialog-off-canvas .ui-dialog-content {
16 /* Prevent horizontal scrollbar. */
20 [dir="rtl"] .ui-dialog-off-canvas .ui-dialog-content {
24 /* Position the off-canvas dialog container outside the right of the viewport. */
25 .ui-dialog-off-canvas {
26 box-sizing: border-box;
31 /* Wrap the form that's inside the off-canvas dialog. */
32 .ui-dialog-off-canvas #drupal-off-canvas {
34 /* Prevent horizontal scrollbar. */
38 [dir="rtl"] .ui-dialog-off-canvas #drupal-off-canvas {
43 * Force the off-canvas dialog to be 100% width at the same breakpoint the
44 * dialog system uses to expand dialog widths.
46 @media all and (max-width: 48em) { /* 768px */
47 .ui-dialog.ui-dialog-off-canvas {
48 width: 100% !important;
50 /* When off-canvas dialog is at 100% width stop the body from scrolling */
51 .js-off-canvas-dialog-open {