48 lines
931 B
SCSS
48 lines
931 B
SCSS
@use '../styles/variables' as *;
|
|
|
|
// Player height (matches media-player component min-height)
|
|
$player-height: 48px;
|
|
|
|
app-navbar {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 200;
|
|
overflow: visible;
|
|
}
|
|
|
|
// App-level media player: shown on mobile (fixed strip), hidden on desktop (navbar instance shown)
|
|
app-media-player {
|
|
// Mobile: fixed strip below navbar
|
|
@media (max-width: #{$bp-md - 1px}) {
|
|
position: fixed;
|
|
top: var(--navbar-height);
|
|
left: 0;
|
|
right: 0;
|
|
z-index: 199;
|
|
}
|
|
|
|
// Desktop: hidden (navbar contains the visible instance)
|
|
@media (min-width: $bp-md) {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
// Main content padding
|
|
@media (max-width: #{$bp-md - 1px}) {
|
|
main {
|
|
padding-top: calc(var(--navbar-height) + #{$player-height});
|
|
|
|
&.no-stream {
|
|
padding-top: var(--navbar-height);
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (min-width: $bp-md) {
|
|
main {
|
|
padding-top: var(--navbar-height);
|
|
}
|
|
}
|