From fa6e4b2c9e7e362c7f60650b4f00ee924e92c891 Mon Sep 17 00:00:00 2001 From: Bas Brands Date: Mon, 31 Jan 2022 10:39:01 +0100 Subject: [PATCH] MDL-73593 theme_boost: update boost top margins --- lib/templates/full_header.mustache | 2 +- theme/boost/scss/moodle/core.scss | 4 ++++ theme/boost/scss/moodle/drawer.scss | 7 +------ theme/boost/scss/moodle/layout.scss | 12 ++++++++---- theme/boost/scss/moodle/navbar.scss | 3 +++ theme/boost/scss/preset/default.scss | 2 +- theme/boost/style/moodle.css | 24 +++++++++++++----------- theme/classic/style/moodle.css | 22 ++++++++++++---------- 8 files changed, 43 insertions(+), 33 deletions(-) diff --git a/lib/templates/full_header.mustache b/lib/templates/full_header.mustache index f05a085ac40..a255808ba95 100644 --- a/lib/templates/full_header.mustache +++ b/lib/templates/full_header.mustache @@ -33,7 +33,7 @@
{{#hasnavbar}} -
+
{{{navbar}}}
{{/hasnavbar}} diff --git a/theme/boost/scss/moodle/core.scss b/theme/boost/scss/moodle/core.scss index 9ae4d4cff94..4ba0a84b017 100644 --- a/theme/boost/scss/moodle/core.scss +++ b/theme/boost/scss/moodle/core.scss @@ -2696,6 +2696,10 @@ $picker-emojis-per-row: 7 !default; font-weight: $font-weight-bold; } +.breadcrumb:empty { + padding: 0; +} + @include media-breakpoint-down(sm) { #page-navbar { width: 100%; diff --git a/theme/boost/scss/moodle/drawer.scss b/theme/boost/scss/moodle/drawer.scss index f96cdeb9d22..4f397354ce4 100644 --- a/theme/boost/scss/moodle/drawer.scss +++ b/theme/boost/scss/moodle/drawer.scss @@ -83,12 +83,7 @@ $drawer-bg: darken($body-bg, 5%) !default; } } } -#page { - margin-top: $fixed-header-y; -} -.pagelayout-embedded #page { - margin-top: 0; -} + body.drawer-ease { @include transition(margin-left 0.5s ease, margin-right 0.5s ease); } diff --git a/theme/boost/scss/moodle/layout.scss b/theme/boost/scss/moodle/layout.scss index c72b1e76ac0..02eb6675d5f 100644 --- a/theme/boost/scss/moodle/layout.scss +++ b/theme/boost/scss/moodle/layout.scss @@ -34,7 +34,7 @@ } #page.drawers { - margin-top: calc(#{$navbar-height} + 2rem); + margin-top: $navbar-height; padding-left: 15px; padding-right: 15px; @include thin-scrolls($gray-100); @@ -45,7 +45,7 @@ @include border-radius(); background-color: $white; padding: 1.5rem 0.5rem; - margin-top: 3rem; + margin-top: 0.5rem; margin-bottom: 3rem; flex: 1 0 auto; } @@ -170,11 +170,16 @@ } } +@include media-breakpoint-up(sm) { + #page.drawers .main-inner { + margin-top: 1.5rem; + } +} + @include media-breakpoint-up(md) { // Add some padding for the drawer toggle buttons #page.drawers { - margin-top: $navbar-height; padding-left: 3rem; padding-right: 3rem; } @@ -192,7 +197,6 @@ overflow-y: auto; @include transition(0.2s); height: calc(100vh - #{$navbar-height}); - margin-top: $navbar-height; left: 0; right: 0; &.show-drawer-left { diff --git a/theme/boost/scss/moodle/navbar.scss b/theme/boost/scss/moodle/navbar.scss index 4eaae957fa8..263645f22ba 100644 --- a/theme/boost/scss/moodle/navbar.scss +++ b/theme/boost/scss/moodle/navbar.scss @@ -165,3 +165,6 @@ #page { margin-top: $navbar-height; } +.pagelayout-embedded #page { + margin-top: 0; +} diff --git a/theme/boost/scss/preset/default.scss b/theme/boost/scss/preset/default.scss index 75dbfce0a68..9368510df2c 100644 --- a/theme/boost/scss/preset/default.scss +++ b/theme/boost/scss/preset/default.scss @@ -52,7 +52,7 @@ $navbar-light-color: rgba($black, 0.6) !default; $navbar-light-hover-color: rgba($black, .9) !default; // Breadcrumbs -$breadcrumb-padding-y: .25rem !default; +$breadcrumb-padding-y: .5rem !default; $breadcrumb-padding-x: 0 !default; $breadcrumb-item-padding: .5rem !default; $breadcrumb-margin-bottom: 0 !default; diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css index b9ffcd2abda..f3d661bbe60 100644 --- a/theme/boost/style/moodle.css +++ b/theme/boost/style/moodle.css @@ -5905,7 +5905,7 @@ input[type="button"].btn-block { .breadcrumb { display: flex; flex-wrap: wrap; - padding: 0.25rem 0; + padding: 0.5rem 0; margin-bottom: 0; list-style: none; background-color: transparent; @@ -12043,6 +12043,9 @@ input[disabled] { .alert a { font-weight: 700; } +.breadcrumb:empty { + padding: 0; } + @media (max-width: 767.98px) { #page-navbar { width: 100%; } @@ -14885,12 +14888,6 @@ span.editinstructions { #nav-drawer .list-group li:last-child { margin-bottom: 0; } -#page { - margin-top: 60px; } - -.pagelayout-embedded #page { - margin-top: 0; } - body.drawer-ease { transition: margin-left 0.5s ease, margin-right 0.5s ease; } @media (prefers-reduced-motion: reduce) { @@ -20355,7 +20352,7 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont font-size: 4em; } #page.drawers { - margin-top: calc(60px + 2rem); + margin-top: 60px; padding-left: 15px; padding-right: 15px; scrollbar-width: thin; @@ -20377,7 +20374,7 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont border-radius: 0.5rem; background-color: #fff; padding: 1.5rem 0.5rem; - margin-top: 3rem; + margin-top: 0.5rem; margin-bottom: 3rem; flex: 1 0 auto; } #page.drawers div[role="main"] { @@ -20463,9 +20460,12 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont pointer-events: auto; visibility: hidden; } } +@media (min-width: 576px) { + #page.drawers .main-inner { + margin-top: 1.5rem; } } + @media (min-width: 768px) { #page.drawers { - margin-top: 60px; padding-left: 3rem; padding-right: 3rem; } } @@ -20479,7 +20479,6 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont overflow-y: auto; transition: 0.2s; height: calc(100vh - 60px); - margin-top: 60px; left: 0; right: 0; } } @media (min-width: 992px) and (prefers-reduced-motion: reduce) { @@ -21051,6 +21050,9 @@ div.editor_atto_toolbar button .icon { #page { margin-top: 60px; } +.pagelayout-embedded #page { + margin-top: 0; } + /** * Reportbuilder. */ diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css index 0b074281110..6b8ac6b829b 100644 --- a/theme/classic/style/moodle.css +++ b/theme/classic/style/moodle.css @@ -12043,6 +12043,9 @@ input[disabled] { .alert a { font-weight: 700; } +.breadcrumb:empty { + padding: 0; } + @media (max-width: 767.98px) { #page-navbar { width: 100%; } @@ -14885,12 +14888,6 @@ span.editinstructions { #nav-drawer .list-group li:last-child { margin-bottom: 0; } -#page { - margin-top: 50px; } - -.pagelayout-embedded #page { - margin-top: 0; } - body.drawer-ease { transition: margin-left 0.5s ease, margin-right 0.5s ease; } @media (prefers-reduced-motion: reduce) { @@ -20301,7 +20298,7 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont font-size: 4em; } #page.drawers { - margin-top: calc(50px + 2rem); + margin-top: 50px; padding-left: 15px; padding-right: 15px; scrollbar-width: thin; @@ -20323,7 +20320,7 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont border-radius: 0.25rem; background-color: #fff; padding: 1.5rem 0.5rem; - margin-top: 3rem; + margin-top: 0.5rem; margin-bottom: 3rem; flex: 1 0 auto; } #page.drawers div[role="main"] { @@ -20409,9 +20406,12 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont pointer-events: auto; visibility: hidden; } } +@media (min-width: 576px) { + #page.drawers .main-inner { + margin-top: 1.5rem; } } + @media (min-width: 768px) { #page.drawers { - margin-top: 50px; padding-left: 3rem; padding-right: 3rem; } } @@ -20425,7 +20425,6 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont overflow-y: auto; transition: 0.2s; height: calc(100vh - 50px); - margin-top: 50px; left: 0; right: 0; } } @media (min-width: 992px) and (prefers-reduced-motion: reduce) { @@ -20997,6 +20996,9 @@ div.editor_atto_toolbar button .icon { #page { margin-top: 50px; } +.pagelayout-embedded #page { + margin-top: 0; } + /** * Reportbuilder. */