76 lines
1.2 KiB
SCSS
76 lines
1.2 KiB
SCSS
// Dependencies.
|
|
@import 'base/grouping/grouping';
|
|
@import 'components/clearfix/clearfix';
|
|
|
|
// Branding header
|
|
//
|
|
// Markup: header.twig
|
|
//
|
|
// Style guide: components.header
|
|
|
|
.header,
|
|
%header {
|
|
@extend %clearfix;
|
|
|
|
// Wrapping link for logo.
|
|
&__logo {
|
|
float: left;
|
|
margin: 0 10px 0 0;
|
|
padding: 0;
|
|
|
|
@include rtl() {
|
|
float: right;
|
|
margin: 0 0 0 10px;
|
|
}
|
|
}
|
|
|
|
// Logo image.
|
|
&__logo-image {
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
// Wrapper for website name and slogan.
|
|
&__name-and-slogan {
|
|
float: left;
|
|
}
|
|
|
|
// The name of the website.
|
|
&__site-name {
|
|
@extend %h1;
|
|
margin: 0;
|
|
}
|
|
|
|
// The link around the name of the website.
|
|
&__site-link {
|
|
&:link,
|
|
&:visited {
|
|
color: color(text);
|
|
text-decoration: none;
|
|
}
|
|
|
|
&:hover,
|
|
&:focus {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
|
|
// The slogan (or tagline) of a website.
|
|
&__site-slogan {
|
|
margin: 0;
|
|
}
|
|
|
|
// The secondary menu (login, etc.)
|
|
&__secondary-menu {
|
|
float: right;
|
|
|
|
@include rtl() {
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
// Wrapper for any blocks placed in the header region.
|
|
&__region {
|
|
// Clear the logo.
|
|
clear: both;
|
|
}
|
|
}
|