MDL-81597 theme_boost: Fix header bar alignment

- Refactot context_header class to implement named templatable so
render_context_header in core and theme_boost can be removed
- Refactor context_header to use templates
- Fix context header layout and styles
This commit is contained in:
Mikel Martín 2024-05-08 13:37:29 +02:00
parent e1d2a046d3
commit 78db6bbce8
8 changed files with 149 additions and 167 deletions

View file

@ -179,69 +179,7 @@ class core_renderer extends \core_renderer {
}
$contextheader = new \context_header($heading, $headinglevel, $imagedata, $userbuttons, $prefix);
return $this->render_context_header($contextheader);
}
/**
* Renders the header bar.
*
* @param context_header $contextheader Header bar object.
* @return string HTML for the header bar.
*/
protected function render_context_header(\context_header $contextheader) {
// Generate the heading first and before everything else as we might have to do an early return.
if (!isset($contextheader->heading)) {
$heading = $this->heading($this->page->heading, $contextheader->headinglevel, 'h2');
} else {
$heading = $this->heading($contextheader->heading, $contextheader->headinglevel, 'h2');
}
// All the html stuff goes here.
$html = html_writer::start_div('page-context-header');
// Image data.
if (isset($contextheader->imagedata)) {
// Header specific image.
$html .= html_writer::div($contextheader->imagedata, 'page-header-image mr-2');
}
// Headings.
if (isset($contextheader->prefix)) {
$prefix = html_writer::div($contextheader->prefix, 'text-muted text-uppercase small line-height-3');
$heading = $prefix . $heading;
}
$html .= html_writer::tag('div', $heading, array('class' => 'page-header-headings'));
// Buttons.
if (isset($contextheader->additionalbuttons)) {
$html .= html_writer::start_div('btn-group header-button-group');
foreach ($contextheader->additionalbuttons as $button) {
if (!isset($button->page)) {
// Include js for messaging.
if ($button['buttontype'] === 'togglecontact') {
\core_message\helper::togglecontact_requirejs();
}
if ($button['buttontype'] === 'message') {
\core_message\helper::messageuser_requirejs();
}
$image = $this->pix_icon($button['formattedimage'], '', 'moodle', array(
'class' => 'iconsmall',
));
$image .= html_writer::span($button['title'], 'header-button-title');
} else {
$image = html_writer::empty_tag('img', array(
'src' => $button['formattedimage'],
'alt' => $button['title'],
));
}
$html .= html_writer::link($button['url'], html_writer::tag('span', $image), $button['linkattributes']);
}
$html .= html_writer::end_div();
}
$html .= html_writer::end_div();
return $html;
return $this->render($contextheader);
}
/**

View file

@ -1955,24 +1955,14 @@ nav.navbar .logo img {
overflow: hidden;
padding: 0.25rem 0;
display: flex;
.page-header-image {
& > a {
display: inline-block;
}
}
.page-header-headings,
.header-button-group {
position: relative;
line-height: 24px;
vertical-align: middle;
}
.header-button-group {
display: block;
float: left;
.userinitials,
.userpicture {
margin-right: map-get($spacers, 3);
}
}
}

View file

@ -24954,20 +24954,13 @@ nav.navbar .logo img {
.page-context-header {
overflow: hidden;
padding: 0.25rem 0;
display: flex;
}
.page-context-header .page-header-image > a {
display: inline-block;
}
.page-context-header .page-header-headings,
.page-context-header .header-button-group {
position: relative;
line-height: 24px;
vertical-align: middle;
}
.page-context-header .header-button-group {
display: block;
float: left;
.page-context-header .page-header-image .userinitials,
.page-context-header .page-header-image .userpicture {
margin-right: 1rem;
}
ul.dragdrop-keyboard-drag li {

View file

@ -24954,20 +24954,13 @@ nav.navbar .logo img {
.page-context-header {
overflow: hidden;
padding: 0.25rem 0;
display: flex;
}
.page-context-header .page-header-image > a {
display: inline-block;
}
.page-context-header .page-header-headings,
.page-context-header .header-button-group {
position: relative;
line-height: 24px;
vertical-align: middle;
}
.page-context-header .header-button-group {
display: block;
float: left;
.page-context-header .page-header-image .userinitials,
.page-context-header .page-header-image .userpicture {
margin-right: 1rem;
}
ul.dragdrop-keyboard-drag li {