moodle/moodle
3
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-08-05 08:56:36 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge branch 'MDL-72250-master-3' of https://github.com/bmbrands/moodle

Browse source
This commit is contained in:
Shamim Rezaie 2021-11-17 07:30:54 +11:00
commit dfe03b3036
14 changed files with 210 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

14
admin/tool/usertours/tests/behat/tour_accessibility.feature
View file

@ -14,7 +14,7 @@ Feature: Apply accessibility to a tour
And I add steps to the tour:
| targettype | targetvalue_selector | Title | Content |
| Selector | .usermenu | User menu | Next page |
| Selector | input,button | Page 2 | Next page |
| Selector | .navbar-brand | Page 2 | Next page |
And I add steps to the tour:
| targettype | Title | Content |
| Display in middle of page | Page 3 | Final page. |
@ -66,11 +66,11 @@ Feature: Apply accessibility to a tour
And I am on site homepage
When I click on "Next" "button"
And I click on "Next" "button"
Then "input[aria-describedby^='tour-step-tool_usertours'],button[aria-describedby^='tour-step-tool_usertours']" "css_element" should exist
And "input[tabindex],button[tabindex]" "css_element" should exist
Then ".navbar-brand[aria-describedby^='tour-step-tool_usertours']" "css_element" should exist
And ".navbar-brand[tabindex]" "css_element" should exist
When I click on "Next" "button"
Then "input[aria-describedby^='tour-step-tool_usertours'],button[aria-describedby^='tour-step-tool_usertours']" "css_element" should not exist
And "input[tabindex]:not([tabindex='-1']),button[tabindex]:not([tabindex='-1'])" "css_element" should not exist
Then ".navbar-brand[aria-describedby^='tour-step-tool_usertours']" "css_element" should not exist
And ".navbar-brand[tabindex]:not([tabindex='-1'])" "css_element" should not exist
When I click on "End tour" "button"
Then "input[aria-describedby^='tour-step-tool_usertours'],button[aria-describedby^='tour-step-tool_usertours']" "css_element" should not exist
And "input[tabindex]:not([tabindex='0']),button[tabindex]:not([tabindex='0'])" "css_element" should not exist
Then ".navbar-brand[aria-describedby^='tour-step-tool_usertours']" "css_element" should not exist
And ".navbar-brand[tabindex]:not([tabindex='0'])" "css_element" should not exist

2
lib/classes/navigation/output/primary.php
View file

@ -57,10 +57,12 @@ class primary implements renderable, templatable {
$menudata = (object) array_merge($this->get_primary_nav(), $this->get_custom_menu($output));
$moremenu = new \core\navigation\output\more_menu($menudata, 'navbar-nav', false);
$mobileprimarynav = array_merge($this->get_primary_nav(), $this->get_custom_menu($output));
$languagemenu = new \core\output\language_menu($this->page);
return [
'mobileprimarynav' => $mobileprimarynav,
'moremenu' => $moremenu->export_for_template($output),
'lang' => !isloggedin() || isguestuser() ? $languagemenu->export_for_template($output) : [],
'user' => $this->get_user_menu($output),

18
lib/tests/navigation/output/primary_test.php
View file

@ -116,31 +116,31 @@ class primary_test extends \advanced_testcase {
public function test_primary_export_provider(): array {
return [
"Export the menu data when: custom menu exists; multiple langs installed; user is not logged in." => [
true, true, '', ['moremenu', 'lang', 'user']
true, true, '', ['mobileprimarynav', 'moremenu', 'lang', 'user']
],
"Export the menu data when: custom menu exists; langs not installed; user is not logged in." => [
true, false, '', ['moremenu', 'user']
true, false, '', ['mobileprimarynav', 'moremenu', 'user']
],
"Export the menu data when: custom menu exists; multiple langs installed; logged in as admin." => [
true, true, 'admin', ['moremenu', 'user']
true, true, 'admin', ['mobileprimarynav', 'moremenu', 'user']
],
"Export the menu data when: custom menu exists; langs not installed; logged in as admin." => [
true, false, 'admin', ['moremenu', 'user']
true, false, 'admin', ['mobileprimarynav', 'moremenu', 'user']
],
"Export the menu data when: custom menu exists; multiple langs installed; logged in as guest." => [
true, true, 'guest', ['moremenu', 'lang', 'user']
true, true, 'guest', ['mobileprimarynav', 'moremenu', 'lang', 'user']
],
"Export the menu data when: custom menu exists; langs not installed; logged in as guest." => [
true, false, 'guest', ['moremenu', 'user']
true, false, 'guest', ['mobileprimarynav', 'moremenu', 'user']
],
"Export the menu data when: custom menu does not exist; multiple langs installed; logged in as guest." => [
false, true, 'guest', ['moremenu', 'lang', 'user']
false, true, 'guest', ['mobileprimarynav', 'moremenu', 'lang', 'user']
],
"Export the menu data when: custom menu does not exist; multiple langs installed; logged in as admin." => [
false, true, 'admin', ['moremenu', 'user']
false, true, 'admin', ['mobileprimarynav', 'moremenu', 'user']
],
"Export the menu data when: custom menu does not exist; langs not installed; user is not logged in." => [
false, false, '', ['moremenu', 'user']
false, false, '', ['mobileprimarynav', 'moremenu', 'user']
],
];
}

2
theme/boost/amd/build/drawers.min.js vendored
View file

File diff suppressed because one or more lines are too long

2
theme/boost/amd/build/drawers.min.js.map
View file

File diff suppressed because one or more lines are too long

16
theme/boost/amd/src/drawers.js
View file

@ -397,13 +397,15 @@ export default class Drawers {
const scroller = () => {
const body = document.querySelector('body');
const drawerLayout = document.querySelector('#page.drawers');
drawerLayout.addEventListener("scroll", () => {
if (drawerLayout.scrollTop >= window.innerHeight) {
body.classList.add('scrolled');
} else {
body.classList.remove('scrolled');
}
});
if (drawerLayout) {
drawerLayout.addEventListener("scroll", () => {
if (drawerLayout.scrollTop >= window.innerHeight) {
body.classList.add('scrolled');
} else {
body.classList.remove('scrolled');
}
});
}
};
/**

1
theme/boost/layout/columns2.php
View file

@ -69,6 +69,7 @@ $templatecontext = [
'hasregionmainsettingsmenu' => !empty($regionmainsettingsmenu),
'primarymoremenu' => $primarymenu['moremenu'],
'secondarymoremenu' => $secondarynavigation,
'mobileprimarynav' => $primarymenu['mobileprimarynav'],
'usermenu' => $primarymenu['user'],
'langmenu' => $primarymenu['lang'],
];

1
theme/boost/layout/drawers.php
View file

@ -107,6 +107,7 @@ $templatecontext = [
'hasregionmainsettingsmenu' => !empty($regionmainsettingsmenu),
'primarymoremenu' => $primarymenu['moremenu'],
'secondarymoremenu' => $secondarynavigation,
'mobileprimarynav' => $primarymenu['mobileprimarynav'],
'usermenu' => $primarymenu['user'],
'langmenu' => $primarymenu['lang'],
'forceblockdraweropen' => $forceblockdraweropen,

23
theme/boost/scss/moodle/primarynavigation.scss
View file

@ -7,3 +7,26 @@
}
}
}
@include media-breakpoint-down(sm) {
.primary-navigation {
display: none;
}
.editmode-switch-form .custom-control-label {
font-size: 0;
color: transparent;
}
}
.drawer-primary .drawercontent {
padding: 0;
.list-group {
border-radius: 0;
margin-top: -1px;
.list-group-item {
border-left: 0;
border-right: 0;
}
}
}

16
theme/boost/style/moodle.css
View file

@ -20996,6 +20996,22 @@ div.editor_atto_toolbar button .icon {
height: 60px;
color: #1d2125; }
@media (max-width: 767.98px) {
.primary-navigation {
display: none; }
.editmode-switch-form .custom-control-label {
font-size: 0;
color: transparent; } }
.drawer-primary .drawercontent {
padding: 0; }
.drawer-primary .drawercontent .list-group {
border-radius: 0;
margin-top: -1px; }
.drawer-primary .drawercontent .list-group .list-group-item {
border-left: 0;
border-right: 0; }
.secondary-navigation {
border-top: 1px solid #dee2e6;
border-bottom: 1px solid #dee2e6; }

2
theme/boost/templates/drawer.mustache
View file

@ -32,7 +32,7 @@
}} data-preference="{{$drawerpreferencename}}{{/drawerpreferencename}}"{{!
}} data-state="{{$drawerstate}}{{/drawerstate}}"{{!
}} data-forceopen="{{$forceopen}}0{{/forceopen}}"{{!
}} data-close-on-resize="{{$drawercloseonreize}}0{{/drawercloseonreize}}"{{!
}} data-close-on-resize="{{$drawercloseonresize}}0{{/drawercloseonresize}}"{{!
}}>
<div class="drawerheader">
{{$drawerheading}}{{/drawerheading}}

28
theme/boost/templates/navbar.mustache
View file

@ -34,7 +34,24 @@
"config": {
"wwwroot": "#"
},
"sitename": "Moodle Site"
"sitename": "Moodle Site",
"mobileprimarynav": [
{
"text": "Dashboard",
"url": "/my",
"isactive": true
},
{
"text": "Site home",
"url": "/",
"isactive": false
},
{
"text": "My courses",
"url": "/course",
"isactive": false
}
]
}
}}
<nav class="navbar fixed-top navbar-light bg-white navbar-expand" aria-label="{{#str}}sitemenubar, admin{{/str}}">
@ -46,7 +63,12 @@
</button>
</div>
<a href="{{{ config.wwwroot }}}" class="navbar-brand d-flex align-items-center m-0 p-0 aabtn">
<button class="navbar-toggler aabtn d-block d-md-none my-1 mr-2" data-toggle="drawers" data-action="toggle" data-target="theme_boost-drawers-primary">
<span class="navbar-toggler-icon"></span>
<span class="sr-only">{{#str}}sidepanel, core{{/str}}</span>
</button>
<a href="{{{ config.wwwroot }}}" class="navbar-brand d-none d-md-flex align-items-center m-0 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 }}
@ -80,3 +102,5 @@
{{{ output.edit_switch }}}
</div>
</nav>
{{> theme_boost/primary-drawer-mobile }}

97
theme/boost/templates/primary-drawer-mobile.mustache Normal file
View file

@ -0,0 +1,97 @@
{{!
This file is part of Moodle - http://moodle.org/
Moodle is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Moodle is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Moodle. If not, see <http://www.gnu.org/licenses/>.
}}
{{!
@template theme_boost/primary-drawer-mobile
This template renders the mobile version of the top navbar menu in a drawer.
Example context (json):
{
"output": {
"should_display_navbar_logo": true,
"get_compact_logo_url": "http://placekitten.com/50/50"
},
"mobileprimarynav": [
{
"text": "Dashboard",
"url": "/my",
"isactive": "true"
},
{
"text": "Site home",
"url": "/",
"isactive": "false"
},
{
"text": "My courses",
"url": "/course",
"isactive": "false"
}
]
}
}}
{{< theme_boost/drawer }}
{{$id}}theme_boost-drawers-primary{{/id}}
{{$drawerclasses}}drawer drawer-left drawer-primary{{/drawerclasses}}
{{$drawercloseonresize}}1{{/drawercloseonresize}}
{{$drawerheading}}
{{# output.should_display_navbar_logo }}
<img src="{{output.get_compact_logo_url}}" class="logo py-1 h-100" alt="{{sitename}}">
{{/ output.should_display_navbar_logo }}
{{^ output.should_display_navbar_logo }}
{{{ sitename }}}
{{/ output.should_display_navbar_logo }}
{{/drawerheading}}
{{$drawercontent}}
<div class="list-group">
{{#mobileprimarynav}}
{{#haschildren}}
<a id="drop-down-{{sort}}" href="#" class="list-group-item list-group-item-action icons-collapse-expand collapsed d-flex" data-toggle="collapse" data-target="#drop-down-menu-{{sort}}" aria-expanded="false" aria-controls="drop-down-menu-{{sort}}">
{{{text}}}
<span class="ml-auto expanded-icon icon-no-margin mx-2">
{{#pix}} t/expanded, core {{/pix}}
<span class="sr-only">
{{#str}} collapse, core {{/str}}
</span>
</span>
<span class="ml-auto collapsed-icon icon-no-margin mx-2">
{{#pix}} t/collapsed, core {{/pix}}
<span class="sr-only">
{{#str}} expand, core {{/str}}
</span>
</span>
</a>
<div class="collapse list-group-item p-0 border-0" role="menu" id="drop-down-menu-{{sort}}" aria-labelledby="drop-down-{{sort}}">
{{#children}}
{{^divider}}
<a href="{{{url}}}" class="pl-5 bg-light list-group-item list-group-item-action">{{{text}}}</a>
{{/divider}}
{{/children}}
</div>
{{/haschildren}}
{{^haschildren}}
<a href="{{{url}}}" class="list-group-item list-group-item-action {{#isactive}}active{{/isactive}} {{#classes}}{{.}} {{/classes}}" {{#isactive}}aria-current="true"{{/isactive}}>
{{{text}}}
</a>
{{/haschildren}}
{{/mobileprimarynav}}
</div>
{{/drawercontent}}
{{$drawerstate}}show-drawer-primary{{/drawerstate}}
{{/ theme_boost/drawer}}

16
theme/classic/style/moodle.css
View file

@ -20942,6 +20942,22 @@ div.editor_atto_toolbar button .icon {
height: 50px;
color: #1d2125; }
@media (max-width: 767.98px) {
.primary-navigation {
display: none; }
.editmode-switch-form .custom-control-label {
font-size: 0;
color: transparent; } }
.drawer-primary .drawercontent {
padding: 0; }
.drawer-primary .drawercontent .list-group {
border-radius: 0;
margin-top: -1px; }
.drawer-primary .drawercontent .list-group .list-group-item {
border-left: 0;
border-right: 0; }
.secondary-navigation {
border-top: 1px solid #dee2e6;
border-bottom: 1px solid #dee2e6; }