moodle/lib/templates/full_header.mustache
Bas Brands 92bc86e429 MDL-68299 theme_boost: theme updates for accessible zoom
The Moodle UI should be functional in a viewport of 320px by 256px to
meet WCAG 1.4.10

this patch contains improvements to:
-prevent horizontal scrolling
-better wrapping of page header
-message drawer funtional on tiny screens
-remove indenting on courses
-prevent elements overlapping on quiz editing
-better navigation tabs
-fix colour picker
-quiz editing
2020-05-19 10:13:20 +02:00

70 lines
2.5 KiB
Plaintext

{{!
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 core/full_header
This template renders the header.
Example context (json):
{
"contextheader": "context_header_html",
"settingsmenu": "settings_html",
"hasnavbar": false,
"navbar": "navbar_if_available",
"courseheader": "course_header_html"
}
}}
<header id="page-header" class="row">
<div class="col-12 pt-3 pb-3">
<div class="card {{^contextheader}}border-0 bg-transparent{{/contextheader}}">
<div class="card-body {{^contextheader}}p-2{{/contextheader}}">
<div class="d-sm-flex align-items-center">
{{#contextheader}}
<div class="mr-auto">
{{{contextheader}}}
</div>
{{/contextheader}}
{{#settingsmenu}}
<div class="context-header-settings-menu">
{{{settingsmenu}}}
</div>
{{/settingsmenu}}
<div class="header-actions-container flex-shrink-0" data-region="header-actions-container">
{{#headeractions}}
<div class="header-action ml-2">{{{.}}}</div>
{{/headeractions}}
</div>
</div>
<div class="d-flex flex-wrap">
{{#hasnavbar}}
<div id="page-navbar">
{{{navbar}}}
</div>
{{/hasnavbar}}
<div class="ml-auto d-flex">
{{{pageheadingbutton}}}
</div>
<div id="course-header">
{{{courseheader}}}
</div>
</div>
</div>
</div>
</div>
</header>