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

lib/templates/contextheader.mustache

@@ -0,0 +1,75 @@
+{{!
+    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/contextheader
+
+    Context header template.
+
+    Example context (json):
+    {
+        "heading": "<h2>Page title</h2>",
+        "prefix": "Page prefix",
+        "hasadditionalbuttons": true,
+        "additionalbuttons": [
+            {
+                "url": "http://example.com",
+                "title": "Button title",
+                "formattedimage": "http://example.com/image.jpg",
+                "attributes": [
+                    {
+                        "name": "data-attribute",
+                        "value": "attribute value"
+                    },
+                    {
+                        "name": "class",
+                        "value": "btn btn-primary"
+                    }
+                ]
+            }
+        ]
+    }
+}}
+<div class="page-context-header d-flex align-items-center mb-2">
+    {{#imagedata}}
+    <div class="page-header-image">
+        {{{imagedata}}}
+    </div>
+    {{/imagedata}}
+    <div class="page-header-headings">
+        {{#prefix}}
+        <div class="text-muted text-uppercase small line-height-3">
+            {{{prefix}}}
+        </div>
+        {{/prefix}}
+        {{{heading}}}
+    </div>
+    {{#hasadditionalbuttons}}
+    <div class="btn-group header-button-group mx-3">
+        {{#additionalbuttons}}
+            <a href="{{url}}" {{#attributes}} {{name}}="{{value}}" {{/attributes}}>
+                {{#page}}
+                    {{#pix}}{{formattedimage}}{{/pix}}
+                    <span class="header-button-title">{{title}}</span>
+                {{/page}}
+                {{^page}}
+                    <img src="{{formattedimage}}" alt="{{title}}">
+                {{/page}}
+            </a>
+        {{/additionalbuttons}}
+    </div>
+    {{/hasadditionalbuttons}}
+</div>