1.blockmovetarget .accesshide { 2 position: relative; 3 left: initial; 4} 5 6.block:target { 7 padding-top: 0 !important; /* stylelint-disable declaration-no-important */ 8 margin-top: 0 !important; 9} 10 11.block_search_forums .searchform { 12 /* Override plugin's default. */ 13 text-align: left; 14} 15 16.block.block_navigation .block_tree ul, 17.block_settings .block_tree ul { 18 margin-left: 0; 19} 20 21.block .block-controls { 22 .dropdown-toggle { 23 /* So that the caret takes the colour of the icon. */ 24 color: $body-color; 25 } 26} 27 28$blocks-column-width: 360px !default; 29 30[data-region="blocks-column"] { 31 width: $blocks-column-width; 32 float: right; 33} 34 35$blocks-plus-gutter: $blocks-column-width + ( $grid-gutter-width / 2 ); 36 37/* We put an absolutely positioned div in a relatively positioned div so it takes up no space */ 38@include media-breakpoint-up(sm) { 39 #region-main-settings-menu { 40 position: relative; 41 float: left; 42 width: 100%; 43 } 44 45 #region-main-settings-menu > div { 46 position: absolute; 47 right: 0; 48 z-index: 100; 49 margin: 1rem; 50 } 51 52 .region_main_settings_menu_proxy { 53 width: 4rem; 54 height: 2rem; 55 background-color: $body-bg; 56 margin-left: $card-spacer-x / 2; 57 margin-bottom: $card-spacer-x / 2; 58 border-bottom-left-radius: 0.5rem; 59 float: right; 60 } 61} 62 63@include media-breakpoint-down(sm) { 64 #region-main-settings-menu .menubar { 65 justify-content: flex-end; 66 } 67} 68 69// Required for IE11 to prevent blocks being pushed under the content. 70#region-main-settings-menu.has-blocks, 71#region-main.has-blocks { 72 display: inline-block; 73 width: calc(100% - #{$blocks-plus-gutter}); 74 @include media-breakpoint-down(lg) { 75 width: 100%; 76 /* MDL-63102 - Remove extra space at bottom. 77 If modifying make sure block-region is horizontally stacked when in full screen */ 78 display: block; 79 } 80} 81 82.header-action { 83 #region-main-settings-menu { 84 position: unset; 85 float: none; 86 width: auto; 87 88 & > div { 89 position: unset; 90 right: auto; 91 margin: 0; 92 } 93 } 94} 95 96[data-region="blocks-column"] { 97 @include media-breakpoint-down(lg) { 98 width: 100%; 99 } 100} 101 102$card-gutter : $card-deck-margin * 2; 103 104.block .empty-placeholder-image-lg { 105 height: 5rem; 106} 107 108.block .block-cards { 109 .course-info-container { 110 padding: 0.8rem; 111 } 112 .progress { 113 height: 0.5rem; 114 } 115 .course-summaryitem { 116 border: $border-width solid $border-color; 117 background-color: $body-bg; 118 } 119 .icon { 120 margin-right: 0; 121 } 122 .card .coursemenubtn { 123 margin-top: -0.5rem; 124 } 125 a.coursename, 126 span.categoryname, 127 .btn-link { 128 color: inherit; 129 } 130 .multiline { 131 white-space: normal; 132 } 133 .btn.btn-link.btn-icon { 134 height: 36px; 135 width: 36px; 136 padding: 0; 137 border-radius: 50%; 138 139 @include hover-focus { 140 background-color: $gray-200; 141 } 142 } 143} 144 145.dashboard-card-deck.one-row { 146 flex-flow: nowrap; 147 overflow-x: scroll; 148} 149 150.summaryimage { 151 height: 5rem; 152 width: 5rem; 153 background-position: center; 154 background-size: cover; 155} 156 157.dashboard-card-deck { 158 .dashboard-card { 159 margin-bottom: $card-gutter; 160 flex-basis: auto; 161 width: 100%; 162 flex-grow: 0; 163 flex-shrink: 0; 164 .dashboard-card-img { 165 height: 7rem; 166 background-position: center; 167 background-size: cover; 168 } 169 .dashboard-card-footer { 170 padding: 0.8rem; 171 } 172 } 173 @include media-breakpoint-up(sm) { 174 &.fixed-width-cards { 175 .dashboard-card { 176 width: 300px; 177 max-width: 100%; 178 } 179 } 180 } 181} 182 183.dashboard-card-deck:not(.fixed-width-cards) { 184 @media (min-width: 576px) { 185 .dashboard-card { 186 width: calc(50% - #{$card-gutter}); 187 } 188 } 189 @media (min-width: 840px) { 190 .dashboard-card { 191 width: calc(33.33% - #{$card-gutter}); 192 } 193 } 194 @media (min-width: 1100px) { 195 .dashboard-card { 196 width: calc(25% - #{$card-gutter}); 197 } 198 } 199 @media (min-width: 1360px) { 200 .dashboard-card { 201 width: calc(20% - #{$card-gutter}); 202 } 203 } 204} 205 206#region-main.has-blocks { 207 .dashboard-card-deck:not(.fixed-width-cards) { 208 @media (min-width: 1200px) { 209 .dashboard-card { 210 width: calc(33.33% - #{$card-gutter}); 211 } 212 } 213 @media (min-width: 1470px) { 214 .dashboard-card { 215 width: calc(25% - #{$card-gutter}); 216 } 217 } 218 } 219} 220 221body.drawer-open-left { 222 .dashboard-card-deck:not(.fixed-width-cards) { 223 @media (min-width: 768px) { 224 .dashboard-card { 225 width: calc(100% - #{$card-gutter}); 226 } 227 } 228 @media (min-width: 861px) { 229 .dashboard-card { 230 width: calc(50% - #{$card-gutter}); 231 } 232 } 233 @media (min-width: 1122px) { 234 .dashboard-card { 235 width: calc(33.33% - #{$card-gutter}); 236 } 237 } 238 @media (min-width: 1381px) { 239 .dashboard-card { 240 width: calc(25% - #{$card-gutter}); 241 } 242 } 243 } 244} 245 246body.drawer-open-left #region-main.has-blocks { 247 .dashboard-card-deck:not(.fixed-width-cards) { 248 @media (min-width: 1200px) { 249 .dashboard-card { 250 width: calc(100% - #{$card-gutter}); 251 } 252 } 253 @media (min-width: 1236px) { 254 .dashboard-card { 255 width: calc(50% - #{$card-gutter}); 256 } 257 } 258 @media (min-width: 1497px) { 259 .dashboard-card { 260 width: calc(33.33% - #{$card-gutter}); 261 } 262 } 263 } 264} 265 266@media (min-width: 1200px) { 267 #block-region-side-pre { 268 .dashboard-card-deck:not(.fixed-width-cards) { 269 margin-left: 0; 270 margin-right: 0; 271 .dashboard-card { 272 width: calc(100% - #{$card-gutter}) !important; 273 } 274 } 275 } 276} 277 278.block_recentlyaccessedcourses { 279 .paging-bar-container { 280 margin-top: -2.4rem; 281 justify-content: flex-end; 282 } 283 284 @include media-breakpoint-down(xs) { 285 .paging-bar-container { 286 margin-top: 0; 287 } 288 } 289} 290 291#block-region-side-pre { 292 .block_recentlyaccessedcourses { 293 .paging-bar-container { 294 margin-top: 0; 295 } 296 } 297} 298 299.block_recentlyaccesseditems { 300 img.icon { 301 height: 24px; 302 width: 24px; 303 margin-right: 6px; 304 } 305} 306 307.block_myoverview { 308 .content { 309 min-height: 19.35rem; 310 } 311 .paged-content-page-container { 312 min-height: 13rem; 313 } 314} 315 316// Show expand collapse with font-awesome. 317.block_settings .block_tree [aria-expanded="true"], 318.block_settings .block_tree [aria-expanded="true"].emptybranch, 319.block_settings .block_tree [aria-expanded="false"], 320.block_navigation .block_tree [aria-expanded="true"], 321.block_navigation .block_tree [aria-expanded="true"].emptybranch, 322.block_navigation .block_tree [aria-expanded="false"] { 323 background-image: none; 324} 325.block_settings .block_tree [aria-expanded="true"]:before, 326.block_navigation .block_tree [aria-expanded="true"]:before { 327 content: $fa-var-angle-down; 328 margin-right: 0; 329 @include fa-icon(); 330 font-size: 16px; 331 width: 16px; 332} 333 334.block_settings .block_tree [aria-expanded="false"]:before, 335.block_navigation .block_tree [aria-expanded="false"]:before { 336 content: $fa-var-angle-right; 337 margin-right: 0; 338 @include fa-icon(); 339 font-size: 16px; 340 width: 16px; 341} 342.dir-rtl { 343 .block_settings .block_tree [aria-expanded="false"]:before, 344 .block_navigation .block_tree [aria-expanded="false"]:before { 345 content: $fa-var-angle-left; 346 } 347} 348 349.block_navigation .block_tree p.hasicon, 350.block_settings .block_tree p.hasicon { 351 text-indent: -3px; 352 353 .icon { 354 margin-right: 2px; 355 } 356} 357 358.block.invisibleblock .card-title { 359 color: $text-muted; 360} 361 362@include media-breakpoint-down(sm) { 363 .block.card { 364 border-left: 0; 365 border-right: 0; 366 } 367}