AutorÃa | Ultima modificación | Ver Log |
/* some very targetted corrections to roll back nameclashes between* Moodle and Bootstrap like .row, .label, .content, .controls** Mostly relies on these styles being more specific than the Bootstrap* ones in order to overule them.*/// .label vs .labelli.activity.label,.file-picker td.label {background: transparent;color: inherit;border: inherit;text-shadow: none;white-space: normal;display: block;font-size: inherit;line-height: inherit;text-align: inherit;}.file-picker td.label {padding: 8px;display: table-cell;text-align: right;}// Some of this dialog is sized in ems so a different font size// effects the whole layout..choosercontainer #chooseform .option label {font-size: 12px;}/* block.invisible vs .invisible* block.hidden vs .invisible** uses .invisible where the rest of Moodle uses @mixin dimmed* fixible in block renderer?** There's seems to be even more naming confusion here since,* blocks can be actually 'visible' (or not) to students,* marked 'visible' but really just dimmed to indicate to editors* that students can't see them or 'visible' to the user who* collapses them, 'visible' if you have the right role and in* different circumstances different sections of a block can* be 'visible' or not.** currently worked around in renderers.php function block{}* by rewriting the class name "invisible" to "dimmed",* though the blocks don't look particularly different apart* from their contents disappearing. Maybe try .muted? or* dimming all the edit icons apart from unhide, might be a* nice effect, though they'd still be active. Maybe reverse* it to white?*/li.section.hidden,.block.hidden,.block.invisible {visibility: visible;display: block;}/* .row vs .row** very tricky to track down this when it goes wrong,* since the styles are applied to generated content** basically if you see things shifted left or right compared* with where they should be check for a .row*/.forum-post .row {margin-left: 0 !important;/* stylelint-disable-line declaration-no-important */}.forum-post .row:before,.forum-post .row:after {content: none;}/* fieldset.hidden vs .hidden** Moodle uses fieldset.hidden for mforms, to signify a collection of* form elements that don't have a box drawn round them. Bootstrap* uses hidden for stuff that is hidden in various responsive modes.** Relatedly, there is also fieldset.invisiblefieldset which hides the* border and sets the display to inline.** Originally this just set block and visible, but it is used* in random question dialogue in Quiz,* that dialogue is hidden and shown, so when hidden the* above workaround leaves you with a button floating around*/fieldset.hidden {display: inherit;visibility: inherit;}/* .container vs .container** bootstrap uses .container to set the width of the layout at 960px or so, Moodle uses it* in the Quiz to contain the questions to add. If you don't overule the Bootstrap code,* it becomes near unuseable.*/#questionbank+.container {width: auto;}// Allow the custom menu to expand/collapse when the user hovers over it with JS disabled.body:not(.jsenabled) .dropdown:hover>.dropdown-menu {display: block;margin-top: -6px; // We need to move it up to counter the arrows as they introduce hover bugs.}// Enable scroll in the language menu.body:not(.jsenabled) .langmenu:hover>.dropdown-menu,.langmenu.open>.dropdown-menu {display: block;max-height: 150px;overflow-y: auto;}// Set menus in the fixed header to scroll vertically when they are longer than the page..rui-topbar.fixed-top .dropdown .dropdown-menu {max-height: calc(100vh - #{$navbar-height});overflow-y: auto;}// Dont allow z-index creep anywhere..page-item {&.active .page-link {@include plain-hover-focus {z-index: inherit;}}}/* Force positioning of popover arrows.** The Css prefixer used in Moodle does not support complex calc statements used* in Bootstrap 4 CSS. For example:* calc((0.5rem + 1px) * -1); is stripped out by lib/php-css-parser/Parser.php.* See MDL-61879. For now the arrow positions of popovers are fixed until this is resolved.*/.bs-popover-right .arrow,.bs-popover-auto[x-placement^="right"] .arrow {left: -9px;}.bs-popover-left .arrow,.bs-popover-auto[x-placement^="left"] .arrow {right: -9px;}.bs-popover-top .arrow,.bs-popover-auto[x-placement^="top"] .arrow {bottom: -9px;}.bs-popover-bottom .arrow,.bs-popover-auto[x-placement^="bottom"] .arrow {top: -9px;}// Fixes an issue on Safari when the .custom-select is inside a .card class..custom-select {word-wrap: normal;}/* Add commented out carousel transistions back in.** The Css prefixer used in Moodle breaks on @supports syntax, See MDL-61515.*/.carousel-item-next.carousel-item-left,.carousel-item-prev.carousel-item-right {transform: translateX(0);}.carousel-item-next,.active.carousel-item-right {transform: translateX(100%);}.carousel-item-prev,.active.carousel-item-left {transform: translateX(-100%);}/*** Reset all of the forced style on the page.* - Remove borders on header and content.* - Remove most of the vertical padding.* - Make the content region flex grow so it pushes things like the* next activity selector to the bottom of the page.*/$allow-reset-style: true !default;@if $allow-reset-style {body.reset-style {.page-header-content {.card {border: none;.page-header-headings {h1 {margin-bottom: 0;}}.card-body {@include media-breakpoint-between(xs,sm) {padding-left: 0;padding-right: 0;}}}&>div {padding-top: 0 !important;/* stylelint-disable-line declaration-no-important */padding-bottom: 0 !important;/* stylelint-disable-line declaration-no-important */}}#page-content {padding-bottom: 0 !important;/* stylelint-disable-line declaration-no-important */#region-main-box {#region-main {border: none;display: inline-flex;flex-direction: column;padding: 0;height: 100%;width: 100%;padding-left: $card-spacer-x;padding-right: $card-spacer-x;vertical-align: top;div[role="main"] {flex: 1 0 auto;}.activity-navigation {overflow: hidden;}&.has-blocks {width: calc(100% - #{$blocks-plus-gutter});@include media-breakpoint-down(lg) {width: 100%;}}@include media-breakpoint-between(xs,sm) {padding-left: 0;padding-right: 0;}}[data-region="blocks-column"] {margin-left: auto;}@include media-breakpoint-down(lg) {display: flex;flex-direction: column;}}}select,input,textarea,.btn:not(.btn-icon) {border-radius: $btn-border-radius-lg;}}}