75 lines
1.7 KiB
SCSS
75 lines
1.7 KiB
SCSS
// --------------------------------------------------
|
|
// Discourse header
|
|
// --------------------------------------------------
|
|
|
|
.d-header {
|
|
height: 3.66em;
|
|
|
|
.title {
|
|
--d-logo-height: 2.4em;
|
|
}
|
|
|
|
#site-text-logo {
|
|
font-size: var(--font-up-1);
|
|
}
|
|
.extra-info-wrapper {
|
|
.extra-info {
|
|
// header title should not be centered if there's no tags / categories
|
|
&:not(.two-rows) {
|
|
min-height: 2.25em;
|
|
}
|
|
.header-title {
|
|
font-size: var(--font-0);
|
|
// the margin-bottom here is fragile, changing it can cause tag alignment issues
|
|
margin: 0 0 0.35em 0;
|
|
.archetype-private_message & {
|
|
// PMs might have participant avatars in the header
|
|
margin: 0 0 0.15em 0;
|
|
}
|
|
}
|
|
.private-message-glyph-wrapper {
|
|
float: left;
|
|
}
|
|
}
|
|
}
|
|
button.sign-up-button {
|
|
display: none;
|
|
}
|
|
|
|
// Hide header avatar + icons while topic title is visible in mobile header
|
|
.extra-info-wrapper ~ .panel {
|
|
.before-header-panel-outlet,
|
|
.header-buttons,
|
|
.d-header-icons {
|
|
display: none;
|
|
}
|
|
}
|
|
// Fade in header avatar + icons if topic title is not visible in mobile header
|
|
.panel {
|
|
animation: fadein 0.5s;
|
|
}
|
|
// A rendering bug in safari causes header SVGs to jitter after animations.
|
|
// translateZ() forces gpu rendering which fixes the issue.
|
|
.d-header-icons {
|
|
transform: translateZ(0);
|
|
}
|
|
}
|
|
|
|
.d-header-icons {
|
|
.d-icon {
|
|
line-height: var(--line-height-medium);
|
|
}
|
|
.active .icon {
|
|
&:after {
|
|
margin-top: -1px;
|
|
}
|
|
}
|
|
}
|
|
|
|
#main-outlet {
|
|
@media only screen and (orientation: landscape) {
|
|
padding-right: env(safe-area-inset-right);
|
|
padding-left: env(safe-area-inset-left);
|
|
}
|
|
}
|