MDL-56967 boost: Fix for layout problem with IE11
[moodle.git] / theme / boost / scss / moodle / blocks.scss
1 .blockmovetarget .accesshide {
2     position: relative;
3     left: initial;
4 }
6 .block_search_forums .searchform {
7     /* Override plugin's default. */
8     text-align: left;
9 }
11 .block.block_navigation .block_tree ul,
12 .block_settings .block_tree ul {
13     margin-left: 0;
14 }
16 .block .block-controls {
17     .dropdown-toggle {
18         /* So that the caret takes the colour of the icon. */
19         color: #999;
21         &::after {
22             margin-left: 0;
23         }
24     }
25 }
27 $blocks-column-width: 250px !default;
29 [data-region="blocks-column"] {
30     width: $blocks-column-width;
31     float: right;
32 }
34 $blocks-plus-gutter: $blocks-column-width + $grid-gutter-width;
36 /* We put an absolutely positioned div in a relatively positioned div so it takes up no space */
37 #region-main-settings-menu {
38     position: relative;
39     float: left;
40     width: 100%;
41 }
42 #region-main-settings-menu > div {
43     position: absolute;
44     right: 0;
45     z-index: 100;
46     margin: 1rem;
47 }
48 .region_main_settings_menu_proxy {
49     width: 4rem;
50     height: 2rem;
51     background-color: $card-bg;
52     margin-left: $card-spacer-x / 2;
53     margin-bottom: $card-spacer-x / 2;
54     border-bottom-left-radius: 0.5rem;
55     float: right;
56 }
58 // Required for IE11 to prevent blocks being pushed under the content.
59 #region-main {
60     float: left;
61     width: 100%;
62 }
63 #region-main-settings-menu.has-blocks,
64 #region-main.has-blocks {
65     display: inline-block;
66     width: calc(100% - #{$blocks-plus-gutter});
67     @include media-breakpoint-down(md) {
68         width: 100%;
69     }
70 }
72 [data-region="blocks-column"] {
73     @include media-breakpoint-down(md) {
74         width: 100%;
75     }
76 }