AutorÃa | Ultima modificación | Ver Log |
{{!
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/local/notification/cta
Moodle cta notification template.
The purpose of this template is to render a call to action notification.
Classes required for JS:
* none
Data attributes required for JS:
* none
Context variables required for this template:
* message A cleaned string (use clean_text()) to display.
* extraclasses Additional classes to apply to the notification.
* actions List of action links.
* icon An icon.pix and icon.componrnt for the icon to be displauyed as the icon of CTA notification.
Example context (json):
{
"message": "What do you think about Moodle?",
"actions": [
{
"title": "Give feedback",
"url": "#",
"data": [
{"name": "action", "value": "give"},
{"name": "contextid", "value": "3"}
]
}
]
}
}}
<div class="cta alert alert-primary alert-block fade in {{ extraclasses }}" {{# region }}data-region="{{ region }}"{{/ region}}>
<div class="d-flex">
<div class="cta-icon mr-2 icon-size-5 flex-shrink-0">
{{# pix }} {{ icon.pix }}, {{ icon.component }} {{/ pix }}
</div>
<div class="align-self-center flex-grow-1">
{{{ message }}}<br>
{{# actions }}
<a href="{{ url }}" class="link-underline aalink"
{{# data }}
data-{{ name }}="{{ value }}"
{{/ data }}
>{{ title }}{{#newwindow}}<span class="ml-1">{{#pix}}i/externallink, core, {{#str}}opensinnewwindow{{/str}}{{/pix}}</span>{{/newwindow}}</a>
{{/ actions }}
</div>
</div>
</div>