weekly back-to-dev release 3.8dev
[moodle.git] / theme / boost / scss / moodle / drawer.scss
CommitLineData
99061152
DW
1/* Anchor link offset fix. This makes hash links scroll 60px down to account for the fixed header. */
2$fixed-header-y: $navbar-height;
3
7bfebce0
ME
4$drawer-width: 285px !default;
5$drawer-padding-x: 20px !default;
6$drawer-padding-y: 20px !default;
7$drawer-offscreen-gutter: 20px !default;
99061152 8
0e202eca
BB
9:target::before {
10 content: " ";
11 display: block;
12 height: ($fixed-header-y + 10px); /* fixed header height*/
13 margin-top: -($fixed-header-y + 10px); /* negative fixed header height */
600de03e
TM
14 width: 1px;
15 pointer-events: none;
99061152 16}
0e202eca 17
ba5c5083
DW
18.pagelayout-embedded :target {
19 padding-top: initial;
20 margin-top: initial;
21}
99061152
DW
22
23#nav-drawer.closed {
0a58ec24 24 left: -($drawer-width + $drawer-offscreen-gutter);
99061152
DW
25}
26#page {
27 margin-top: $navbar-height;
28}
29
30/* Use a variable for the drawer background colors. */
31$drawer-bg: $gray-lighter !default;
32
33[data-region="drawer"] {
34 position: fixed;
35 padding: $drawer-padding-x $drawer-padding-y;
36 width: $drawer-width;
37 top: $fixed-header-y;
6ec7fb8d 38 height: calc(100% - #{$navbar-height});
ba5c5083 39 overflow-y: auto;
99061152
DW
40 -webkit-overflow-scrolling: touch;
41 z-index: $zindex-dropdown - 1;
3ec69c2e 42 background-color: darken($body-bg, 5%);
99061152 43 -webkit-transition: right 0.5s ease, left 0.5s ease;
947970fc
DM
44 -moz-transition: right 0.5s ease, left 0.5s ease;
45 transition: right 0.5s ease, left 0.5s ease;
99061152
DW
46}
47#nav-drawer {
48 right: auto;
947970fc 49 left: 0;
99061152 50}
99061152
DW
51#page {
52 margin-top: $fixed-header-y;
53}
ba5c5083
DW
54.pagelayout-embedded #page {
55 margin-top: 0;
56}
99061152
DW
57body.drawer-ease {
58 -webkit-transition: margin-left 0.5s ease, margin-right 0.5s ease;
947970fc
DM
59 -moz-transition: margin-left 0.5s ease, margin-right 0.5s ease;
60 transition: margin-left 0.5s ease, margin-right 0.5s ease;
99061152
DW
61}
62
63body.drawer-open-left {
0a58ec24 64 @include media-breakpoint-up(md) {
99061152
DW
65 margin-left: $drawer-width;
66 }
67}
68body.drawer-open-right {
0a58ec24 69 @include media-breakpoint-up(md) {
99061152
DW
70 margin-right: $drawer-width;
71 }
72}