moodle/grade/templates/tertiary_navigation_dropdown.mustache

60 lines
3.0 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_grades/tertiary_navigation_dropdown
Tertiary navigation dropdown selector.
Context variables required for this template:
* rtl - Is this dropdown being used in a RTL case? if so, we need to ensure it drops down in the right place.
* renderlater - This determines if we show a placeholder whilst fetching content to replace within the placeholder region
* buttoncontent - The string to be shown to users to trigger the dropdown
* dropdowncontent - If rendering now, The content within the dropdown
* parentclasses - Our class for the DOM Node that the default bootstrap dropdown events are tagged onto
* buttonclasses - If you want special handling add classes here
* dropdownclasses - If you want special handling or sizing etc add classes here
Example context (json):
{
"rtl": false,
"renderlater": false,
"buttoncontent": "Example dropdown button",
"dropdowncontent": "Some body content to render right now",
"parentclasses": "my-dropdown",
"buttonclasses": "my-button",
"dropdownclasses": "my-cool-dropdown"
}
}}
{{#buttonheader}}
<small>{{.}}</small>
{{/buttonheader}}
<div class="{{#parentclasses}}{{.}}{{/parentclasses}}">
<div class="{{#buttonclasses}}{{.}}{{/buttonclasses}} btn dropdown-toggle keep-open d-flex text-left align-items-center p-0 font-weight-bold" data-toggle="dropdown" tabindex="0" aria-haspopup="true" role="button" aria-label="{{#str}} aria-toggledropdown, core_grades {{/str}}" aria-expanded="false">
{{{buttoncontent}}}
</div>
<div class="{{#dropdownclasses}}{{.}}{{/dropdownclasses}} dropdown-menu {{#rtl}}dropdown-menu-right{{/rtl}}">
<div class="w-100 p-3" data-region="placeholder">
{{#renderlater}}
<div class="d-flex flex-column align-items-stretch justify-content-between" style="height: 150px; width: 300px;">
<div class="bg-pulse-grey w-100 h-100 my-1"></div>
<div class="bg-pulse-grey w-100 h-100 my-1"></div>
<div class="bg-pulse-grey w-100 h-100 my-1"></div>
</div>
{{/renderlater}}
{{^renderlater}}
{{{dropdowncontent}}}
{{/renderlater}}
</div>
</div>
</div>