Merge branch 'MDL-71293-master' of git://github.com/bmbrands/moodle

This commit is contained in:
Eloy Lafuente (stronk7) 2021-06-23 23:43:08 +02:00
commit 5df31d920b
17 changed files with 238 additions and 178 deletions

View File

@ -3330,7 +3330,7 @@ EOD;
return html_writer::div(
html_writer::span(
$returnstr,
'login'
'login nav-link'
),
$usermenuclasses
);
@ -3347,7 +3347,7 @@ EOD;
return html_writer::div(
html_writer::span(
$returnstr,
'login'
'login nav-link'
),
$usermenuclasses
);
@ -3419,7 +3419,8 @@ EOD;
$am = new action_menu();
$am->set_menu_trigger(
$returnstr
$returnstr,
'nav-link'
);
$am->set_action_label(get_string('usermenu'));
$am->set_alignment(action_menu::TR, action_menu::BR);

View File

@ -30,7 +30,7 @@
}
}
}}
<div class="action-menu {{classes}} d-inline"{{#attributes}} {{name}}="{{value}}"{{/attributes}}>
<div class="action-menu {{classes}}"{{#attributes}} {{name}}="{{value}}"{{/attributes}}>
{{#primary}}
<div class="{{classes}} d-flex "{{#attributes}} {{name}}="{{value}}"{{/attributes}}>

View File

@ -78,7 +78,7 @@
}
}}
<div class="dropdown{{^secondary.items}} hidden{{/secondary.items}}">
<a href="#" tabindex="0" class="d-inline-block {{triggerextraclasses}} dropdown-toggle icon-no-margin" id="action-menu-toggle-{{instance}}" aria-label="{{title}}" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" aria-controls="action-menu-{{instance}}-menu">
<a href="#" tabindex="0" class="{{triggerextraclasses}} dropdown-toggle icon-no-margin" id="action-menu-toggle-{{instance}}" aria-label="{{title}}" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false" aria-controls="action-menu-{{instance}}-menu">
{{{actiontext}}}
{{{menutrigger}}}
{{#icon}}

View File

@ -50,7 +50,7 @@
{{/haschildren}}
{{^haschildren}}
<li class="nav-item">
<a class="nav-item nav-link" href="{{{url}}}" {{#title}}title="{{{title}}}"{{/title}}>{{{text}}}</a>
<a class="nav-link" href="{{{url}}}" {{#title}}title="{{{title}}}"{{/title}}>{{{text}}}</a>
</li>
{{/haschildren}}
{{/divider}}

View File

@ -70,7 +70,7 @@
</form>
</div>
<a
class="btn btn-open"
class="btn btn-open nav-link"
data-toggle="collapse"
data-action="opensearch"
href="#searchform-navbar"

View File

@ -36,7 +36,7 @@
}}
<div class="popover-region collapsed" data-region="popover-region-messages">
<a id="message-drawer-toggle-{{uniqid}}" class="nav-link d-inline-block popover-region-toggle position-relative icon-no-margin" href="#"
<a id="message-drawer-toggle-{{uniqid}}" class="nav-link popover-region-toggle position-relative icon-no-margin" href="#"
role="button">
{{#pix}} t/message, core, {{#str}} togglemessagemenu, message {{/str}} {{/pix}}
<div class="count-container {{^unreadcount}}hidden{{/unreadcount}}" data-region="count-container"

View File

@ -11,7 +11,6 @@ $breadcrumb-divider-rtl: "◀" !default;
@import "moodle/icons";
@import "moodle/admin";
@import "moodle/blocks";
@import "moodle/bootswatch";
@import "moodle/calendar";
@import "moodle/contentbank";
@import "moodle/course";
@ -43,3 +42,4 @@ $breadcrumb-divider-rtl: "◀" !default;
@import "moodle/prefixes";
@import "moodle/atto";
@import "moodle/toasts";
@import "moodle/navbar";

View File

@ -1,7 +0,0 @@
// Adjustments to make bootstrap 4 work better with some variables from bootstrap 3 bootswatches
$navbar-height: 50px !default;
.navbar {
max-height: $navbar-height;
}

View File

@ -0,0 +1,45 @@
.navbar.fixed-top {
padding-top: 0;
padding-bottom: 0;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
align-items: stretch;
height: $navbar-height;
.navbar-brand {
.logo {
max-height: calc(#{$navbar-height} - (#{$primary-nav-padding-y} * 2));
}
}
.nav-link {
height: 100%;
display: flex;
align-items: center;
white-space: nowrap;
}
.divider {
width: 1px;
background-color: $gray-300;
}
#usernavigation .nav-link {
padding: 0 $primary-nav-padding-x;
}
.usermenu {
display: flex;
.action-menu {
display: flex;
align-items: center;
}
.dropdown-toggle::after {
display: none;
}
}
.moodle-actionmenu .menubar,
.action-menu-trigger .dropdown {
height: 100%;
display: flex;
}
}
#page {
margin-top: $navbar-height;
}

View File

@ -199,7 +199,7 @@ $content-header-footer-height: $region-header-height + $region-footer-height;
}
.popover-region-container {
top: $line-height-base * 1.4 * $font-size-base;
top: calc(#{$navbar-height} - (#{$spacer} / 2));
}
}

View File

@ -51,30 +51,20 @@
}
}
@include media-breakpoint-down(md) {
.simplesearchform .collapse.show,
.simplesearchform .collapsing {
position: absolute;
left: 0;
top: 0;
width: 100%;
display: flex;
background-color: $white;
z-index: $zindex-popover;
height: $navbar-height;
.form-inline {
width: auto;
margin-left: auto;
margin-right: auto;
}
}
}
.navbar.navbar-light {
.simplesearchform .btn-open {
color: $navbar-light-color;
&:hover {
color: $navbar-light-hover-color;
}
.simplesearchform .collapse.show,
.simplesearchform .collapsing {
position: absolute;
left: 0;
top: 0;
width: 100%;
display: flex;
background-color: $white;
z-index: $zindex-popover;
height: $navbar-height;
.form-inline {
width: auto;
margin-left: auto;
margin-right: auto;
}
}

View File

@ -17,4 +17,9 @@ $state-warning-bg: theme-color-level("warning", -10) !default;
$state-warning-border: theme-color-level("warning", -10) !default;
$state-danger-bg: theme-color-level("danger", -10) !default;
$state-danger-border: theme-color-level("danger", -9) !default;
$state-danger-border: theme-color-level("danger", -9) !default;
$primary-nav-padding-y: ($spacer / 4) !default;
$primary-nav-padding-x: ($spacer / 2) !default;
$navbar-height: 50px !default;

View File

@ -12818,9 +12818,6 @@ input[disabled] {
.pagelayout-embedded .embedded-blocks {
width: 100%; } }
.navbar {
max-height: 50px; }
/* calendar.less */
.calendar_event_category {
background-color: #e0cbe0; }
@ -16348,27 +16345,21 @@ body.path-question-type .mform fieldset.hidden {
transition: none;
width: inherit; }
@media (max-width: 991.98px) {
.simplesearchform .collapse.show,
.simplesearchform .collapsing {
position: absolute;
left: 0;
top: 0;
width: 100%;
display: flex;
background-color: #fff;
z-index: 1060;
height: 50px; }
.simplesearchform .collapse.show .form-inline,
.simplesearchform .collapsing .form-inline {
width: auto;
margin-left: auto;
margin-right: auto; } }
.navbar.navbar-light .simplesearchform .btn-open {
color: rgba(0, 0, 0, 0.6); }
.navbar.navbar-light .simplesearchform .btn-open:hover {
color: rgba(0, 0, 0, 0.9); }
.simplesearchform .collapse.show,
.simplesearchform .collapsing {
position: absolute;
left: 0;
top: 0;
width: 100%;
display: flex;
background-color: #fff;
z-index: 1060;
height: 50px; }
.simplesearchform .collapse.show .form-inline,
.simplesearchform .collapsing .form-inline {
width: auto;
margin-left: auto;
margin-right: auto; }
.search-areas-actions {
margin-bottom: 1rem; }
@ -19007,7 +18998,7 @@ body {
right: 0; }
.navbar .popover-region-container {
top: 1.96875rem; }
top: calc(50px - (1rem / 2)); }
.content-item-container {
width: 100%;
@ -19753,6 +19744,39 @@ div.editor_atto_toolbar button .icon {
.toast .close {
color: inherit; }
.navbar.fixed-top {
padding-top: 0;
padding-bottom: 0;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
align-items: stretch;
height: 50px; }
.navbar.fixed-top .navbar-brand .logo {
max-height: calc(50px - (0.25rem * 2)); }
.navbar.fixed-top .nav-link {
height: 100%;
display: flex;
align-items: center;
white-space: nowrap; }
.navbar.fixed-top .divider {
width: 1px;
background-color: #dee2e6; }
.navbar.fixed-top #usernavigation .nav-link {
padding: 0 0.5rem; }
.navbar.fixed-top .usermenu {
display: flex; }
.navbar.fixed-top .usermenu .action-menu {
display: flex;
align-items: center; }
.navbar.fixed-top .usermenu .dropdown-toggle::after {
display: none; }
.navbar.fixed-top .moodle-actionmenu .menubar,
.navbar.fixed-top .action-menu-trigger .dropdown {
height: 100%;
display: flex; }
#page {
margin-top: 50px; }
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }

View File

@ -28,24 +28,23 @@
"sitename": "Moodle Site"
}
}}
<nav class="fixed-top navbar navbar-light bg-white navbar-expand moodle-has-zindex" aria-label="{{#str}}navigation{{/str}}">
<nav class="navbar fixed-top navbar-light bg-white navbar-expand" aria-label="{{#str}}sitemenubar, admin{{/str}}">
<div class="navbar-brand d-flex align-items-center m-1 p-0 aabtn">
{{# output.should_display_navbar_logo }}
<span class="logo d-none d-sm-inline">
<img src="{{output.get_compact_logo_url}}" alt="{{sitename}}">
</span>
<img src="{{output.get_compact_logo_url}}" class="logo mr-1" alt="{{sitename}}">
{{/ output.should_display_navbar_logo }}
<span class="site-name d-none d-md-inline">{{{ sitename }}}</span>
{{{ sitename }}}
</div>
{{# output.secure_layout_language_menu }}
<ul class="navbar-nav d-none d-md-flex">
<!-- language_menu -->
{{{ . }}}
</ul>
{{/ output.secure_layout_language_menu }}
{{# output.secure_layout_login_info }}
<div class="ml-auto">
{{{ . }}}
</div>
{{/ output.secure_layout_login_info }}
{{# output.secure_layout_language_menu }}
<ul class="nav navbar-nav language-menu my-1">
{{{ . }}}
</ul>
{{/ output.secure_layout_language_menu }}
{{# output.secure_layout_login_info }}
<div class="ml-auto nav-link">
{{{ . }}}
</div>
{{/ output.secure_layout_login_info }}
</nav>

View File

@ -37,43 +37,35 @@
"sitename": "Moodle Site"
}
}}
<nav class="fixed-top navbar navbar-light bg-white navbar-expand moodle-has-zindex" aria-label="{{#str}}sitemenubar, admin{{/str}}">
<nav class="navbar fixed-top navbar-light bg-white navbar-expand" aria-label="{{#str}}sitemenubar, admin{{/str}}">
<div data-region="drawer-toggle" class="d-inline-block mr-3">
<button aria-expanded="{{#navdraweropen}}true{{/navdraweropen}}{{^navdraweropen}}false{{/navdraweropen}}" aria-controls="nav-drawer" type="button" class="btn nav-link float-sm-left mr-1 btn-light bg-gray" data-action="toggle-drawer" data-side="left" data-preference="drawer-open-nav">{{#pix}}i/menubars{{/pix}}<span class="sr-only">{{#str}}sidepanel, core{{/str}}</span></button>
<div class="d-flex" data-region="drawer-toggle">
<button class="navbar-toggler aabtn d-block my-1 mr-2" aria-expanded="{{#navdraweropen}}true{{/navdraweropen}}{{^navdraweropen}}false{{/navdraweropen}}" aria-controls="nav-drawer" type="button" data-action="toggle-drawer" data-side="left" data-preference="drawer-open-nav">
<span class="navbar-toggler-icon"></span>
<span class="sr-only">{{#str}}sidepanel, core{{/str}}</span>
</button>
</div>
<a href="{{{ config.wwwroot }}}" class="navbar-brand d-flex align-items-center m-1 p-0 aabtn">
{{# output.should_display_navbar_logo }}
<img src="{{output.get_compact_logo_url}}" class="logo mr-1" alt="{{sitename}}">
{{/ output.should_display_navbar_logo }}
{{{ sitename }}}
</a>
<ul class="navbar-nav d-none d-md-flex my-1 px-1">
<!-- custom_menu -->
{{{ output.custom_menu }}}
<!-- page_heading_menu -->
{{{ output.page_heading_menu }}}
</ul>
<div id="usernavigation" class="navbar-nav my-1 ml-auto">
<div class="divider border-left h-50 align-self-center mx-1"></div>
{{{ output.search_box }}}
{{{ output.navbar_plugin_output }}}
<div class="d-flex align-items-stretch usermenu-container" data-region="usermenu">
{{{ output.user_menu }}}
</div>
<a href="{{{ config.wwwroot }}}" class="navbar-brand aabtn {{# output.should_display_navbar_logo }}has-logo{{/ output.should_display_navbar_logo }}
{{^ output.should_display_navbar_logo }}
d-none d-sm-inline
{{/ output.should_display_navbar_logo }}
">
{{# output.should_display_navbar_logo }}
<span class="logo d-none d-sm-inline">
<img src="{{output.get_compact_logo_url}}" alt="{{sitename}}">
</span>
{{/ output.should_display_navbar_logo }}
<span class="site-name d-none d-md-inline">{{{ sitename }}}</span>
</a>
<ul class="navbar-nav d-none d-md-flex">
<!-- custom_menu -->
{{{ output.custom_menu }}}
<!-- page_heading_menu -->
{{{ output.page_heading_menu }}}
</ul>
<div class="ml-auto">
{{{ output.search_box }}}
</div>
<ul class="nav navbar-nav usernav">
<!-- navbar_plugin_output -->
<li class="nav-item">
{{{ output.navbar_plugin_output }}}
</li>
<!-- user_menu -->
<li class="nav-item align-items-center pl-2">
{{{ output.user_menu }}}
</li>
</ul>
<!-- search_box -->
</div>
</nav>

View File

@ -13040,9 +13040,6 @@ input[disabled] {
.pagelayout-embedded .embedded-blocks {
width: 100%; } }
.navbar {
max-height: 50px; }
/* calendar.less */
.calendar_event_category {
background-color: #e0cbe0; }
@ -16581,27 +16578,21 @@ body.path-question-type .mform fieldset.hidden {
transition: none;
width: inherit; }
@media (max-width: 991.98px) {
.simplesearchform .collapse.show,
.simplesearchform .collapsing {
position: absolute;
left: 0;
top: 0;
width: 100%;
display: flex;
background-color: #fff;
z-index: 1060;
height: 50px; }
.simplesearchform .collapse.show .form-inline,
.simplesearchform .collapsing .form-inline {
width: auto;
margin-left: auto;
margin-right: auto; } }
.navbar.navbar-light .simplesearchform .btn-open {
color: rgba(0, 0, 0, 0.6); }
.navbar.navbar-light .simplesearchform .btn-open:hover {
color: rgba(0, 0, 0, 0.9); }
.simplesearchform .collapse.show,
.simplesearchform .collapsing {
position: absolute;
left: 0;
top: 0;
width: 100%;
display: flex;
background-color: #fff;
z-index: 1060;
height: 50px; }
.simplesearchform .collapse.show .form-inline,
.simplesearchform .collapsing .form-inline {
width: auto;
margin-left: auto;
margin-right: auto; }
.search-areas-actions {
margin-bottom: 1rem; }
@ -19196,7 +19187,7 @@ body {
right: 0; }
.navbar .popover-region-container {
top: 1.96875rem; }
top: calc(50px - (1rem / 2)); }
.content-item-container {
width: 100%;
@ -19944,6 +19935,39 @@ div.editor_atto_toolbar button .icon {
.toast .close {
color: inherit; }
.navbar.fixed-top {
padding-top: 0;
padding-bottom: 0;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
align-items: stretch;
height: 50px; }
.navbar.fixed-top .navbar-brand .logo {
max-height: calc(50px - (0.25rem * 2)); }
.navbar.fixed-top .nav-link {
height: 100%;
display: flex;
align-items: center;
white-space: nowrap; }
.navbar.fixed-top .divider {
width: 1px;
background-color: #dee2e6; }
.navbar.fixed-top #usernavigation .nav-link {
padding: 0 0.5rem; }
.navbar.fixed-top .usermenu {
display: flex; }
.navbar.fixed-top .usermenu .action-menu {
display: flex;
align-items: center; }
.navbar.fixed-top .usermenu .dropdown-toggle::after {
display: none; }
.navbar.fixed-top .moodle-actionmenu .menubar,
.navbar.fixed-top .action-menu-trigger .dropdown {
height: 100%;
display: flex; }
#page {
margin-top: 50px; }
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }

View File

@ -38,38 +38,25 @@
}}
<nav class="fixed-top navbar navbar-bootswatch navbar-expand moodle-has-zindex">
<a href="{{{ config.wwwroot }}}" class="navbar-brand aalink {{# output.should_display_navbar_logo }}has-logo{{/ output.should_display_navbar_logo }}
{{^ output.should_display_navbar_logo }}
d-none d-sm-inline
{{/ output.should_display_navbar_logo }}
">
{{# output.should_display_navbar_logo }}
<span class="logo d-none d-sm-inline">
<img src="{{output.get_compact_logo_url}}" alt="{{sitename}}">
</span>
{{/ output.should_display_navbar_logo }}
<span class="site-name d-none d-md-inline">{{{ sitename }}}</span>
</a>
<a href="{{{ config.wwwroot }}}" class="navbar-brand d-flex align-items-center m-1 p-0 aabtn">
{{# output.should_display_navbar_logo }}
<img src="{{output.get_compact_logo_url}}" class="logo mr-1" alt="{{sitename}}">
{{/ output.should_display_navbar_logo }}
{{{ sitename }}}
</a>
<ul class="navbar-nav d-none d-md-flex">
<!-- custom_menu -->
{{{ output.custom_menu }}}
<!-- page_heading_menu -->
{{{ output.page_heading_menu }}}
</ul>
<div class="ml-auto">
{{{ output.search_box }}}
<ul class="navbar-nav d-none d-md-flex">
<!-- custom_menu -->
{{{ output.custom_menu }}}
<!-- page_heading_menu -->
{{{ output.page_heading_menu }}}
</ul>
<div id="usernavigation" class="navbar-nav my-1 ml-auto">
<div class="divider border-left h-50 align-self-center mx-1"></div>
{{{ output.search_box }}}
{{{ output.navbar_plugin_output }}}
<div class="d-flex align-items-stretch usermenu-container" data-region="usermenu">
{{{ output.user_menu }}}
</div>
<ul class="nav navbar-nav usernav">
<!-- navbar_plugin_output -->
<li class="nav-item">
{{{ output.navbar_plugin_output }}}
</li>
<!-- user_menu -->
<li class="nav-item align-items-center">
{{{ output.user_menu }}}
</li>
</ul>
<!-- search_box -->
</div>
</nav>