mirror of
https://gh.wpcy.net/https://github.com/elementor/hello-theme.git
synced 2026-05-05 15:52:21 +08:00
4787361a56
* Tweak: Use CSS logical properties * Revert comments changes * Tweak: Use CSS logical properties * Remove RTL style, replaced with logical properties * Fix BC support for Safari 14.0
108 lines
1.3 KiB
SCSS
108 lines
1.3 KiB
SCSS
/**
|
|
* Header styling and layout
|
|
*/
|
|
|
|
.site-header {
|
|
/* Backwards compat for Hello 2.3.0 */
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
padding-block-start: 1rem;
|
|
padding-block-end: 1rem;
|
|
position: relative;
|
|
|
|
.site-navigation {
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.site-branding {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
.header-inner {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
|
|
.custom-logo-link {
|
|
display: block;
|
|
}
|
|
|
|
.site-branding {
|
|
|
|
.site-title,
|
|
.site-description {
|
|
margin: 0;
|
|
}
|
|
|
|
&.show-title {
|
|
|
|
.site-logo {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
&.show-logo {
|
|
|
|
.site-title {
|
|
display: none !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&:not(.header-stacked) {
|
|
|
|
.header-inner {
|
|
|
|
.site-branding {
|
|
max-width: 30%;
|
|
}
|
|
|
|
.site-navigation {
|
|
max-width: 70%;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.header-inverted {
|
|
|
|
.header-inner {
|
|
flex-direction: row-reverse;
|
|
|
|
.site-branding {
|
|
text-align: right;
|
|
}
|
|
|
|
.site-navigation {
|
|
justify-content: start;
|
|
}
|
|
}
|
|
}
|
|
|
|
&.header-stacked {
|
|
|
|
.header-inner {
|
|
align-items: center;
|
|
flex-direction: column;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: $screen-xs) {
|
|
.site-header {
|
|
|
|
.header-inner {
|
|
|
|
&:not(.header-stacked) {
|
|
|
|
.site-branding {
|
|
max-width: 80%;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
