feat(core): add site logo to header

This commit is contained in:
alistair3149 2022-12-03 12:39:17 -05:00
parent 143c64c7b0
commit 7bfec28ef2
No known key found for this signature in database
4 changed files with 57 additions and 21 deletions

View file

@ -66,6 +66,12 @@
}
}
&__logo {
padding: 0 var( --space-xs ) 0 0;
border-right: 1px solid var( --border-color-base );
margin: 0 var( --space-xxs );
}
&__inner {
z-index: -1; // Inner element should be behind menu and search
display: flex;
@ -143,6 +149,13 @@
left: 0;
border-top: 0;
border-right: 1px solid var( --border-color-base );
&__logo {
padding: 0 0 var( --space-xs ) 0;
border-right: 0;
border-bottom: 1px solid var( --border-color-base );
margin: var( --space-xxs ) 0;
}
}
}

View file

@ -1,7 +1,6 @@
{{!
LogoDefinition logo
string link-mainpage link to the main page
string msg-sitesubtitle the contents of the sitesubtitle message key
}}
{{#data-logos}}
<a href="{{link-mainpage}}" class="mw-logo citizen-drawer__logo">

View file

@ -3,6 +3,7 @@
string msg-citizen-drawer-toggle The label used by the drawer button
}}
<header class="mw-header citizen-header">
{{>Header__logo}}
{{#data-search-box}}{{>Search}}{{/data-search-box}}
{{>Drawer}}
<div class="citizen-header__inner">

View file

@ -0,0 +1,23 @@
{{!
LogoDefinition logo
string link-mainpage link to the main page
TODO: Maybe merge with Drawer__logo?
}}
{{#data-logos}}
<div class="citizen-header__logo">
<a href="{{link-mainpage}}" class="mw-logo citizen-header__button">
{{! alt is provided for valid HTML but given aria-hidden not needed. }}
<img class="mw-logo-icon" src="{{!
Pick an icon based on this order: Icon > SVG > 1x
Need a better way to indent the syntax below
}}{{#icon}}{{.}}{{/icon}}{{!
}}{{^icon}}{{!
}}{{#svg}}{{.}}{{/svg}}{{!
}}{{^svg}}{{!
}}{{#1x}}{{.}}{{/1x}}{{!
}}{{/svg}}{{!
}}{{/icon}}"{{!
}}alt="" aria-hidden="true" height="32" width="32">
</a>
</div>
{{/data-logos}}