mirror of
https://github.com/owncast/owncast.git
synced 2024-12-25 18:48:31 +03:00
51 lines
1.1 KiB
SCSS
51 lines
1.1 KiB
SCSS
|
@import '../../../styles/mixins.scss';
|
||
|
|
|
||
|
|
.noscript {
|
||
|
|
position: fixed;
|
||
|
|
inset: 0;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
text-align: center;
|
||
|
|
padding: 2em;
|
||
|
|
font-size: large;
|
||
|
|
background-color: var(--theme-color-background-main);
|
||
|
|
z-index: 999;
|
||
|
|
|
||
|
|
h2 {
|
||
|
|
margin-top: 25px;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-size: inherit;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// Necessary in case content y-overflows becuase
|
||
|
|
// align-items: center would otherwise hide some
|
||
|
|
// of the content
|
||
|
|
.scrollContainer {
|
||
|
|
max-height: 100%;
|
||
|
|
overflow: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.content {
|
||
|
|
max-width: 100%;
|
||
|
|
width: 70ch;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.logo {
|
||
|
|
width: 70%;
|
||
|
|
|
||
|
|
// For some weir reason, the logo isn't displayed on screens <= 767px.
|
||
|
|
// This coincides with the tablet breakpoint, but god knows what exactly
|
||
|
|
// the issue is. Since it's just a design element, just hide the logo on
|
||
|
|
// those smaller screens. For more information, see
|
||
|
|
// https://github.com/owncast/owncast/pull/2592
|
||
|
|
@include screen(tablet) {
|
||
|
|
display: none;
|
||
|
|
}
|
||
|
|
}
|