jam-cloud/web/app/assets/stylesheets/events/react-components/EventPage.scss

114 lines
1.8 KiB
SCSS

@import "events/constants";
@import "client/common.scss";
[data-react-class="EventPage"] {
width:100%;
.EventPage {
width:100%;
}
#header {
display:grid;
justify-content: center;
width:100%;
background-color:$jamkazam-background;
padding:1.5rem 0;
}
.title {
font-size:2rem;
}
.description {
color:gray;
font-size:1rem;
margin-top:.2rem;
}
.starts-at {
color:gray;
font-size:1rem;
margin-top:.2rem;
}
#root {
min-height: 100%;
align-items: center;
//justify-content: center;
min-width: 50%;
display: flex;
flex-direction: column;
}
#player, #no-player {
position:relative;
padding-bottom:56.25%;
padding-top:30px;
height:0;
overflow:hidden;
top:-5rem;
border-width: $chunkyBorderWidth;
border-style: solid;
border-color: $copy-color-on-dark;
a {
color:#fc0;
}
}
#no-player {
display:grid;
align-content: center;
}
.no-register {
text-decoration: underline;
font-weight:bold;
margin-top:2rem;
display:block;
}
.no-code {
background-color: black;
padding-bottom:0 !important;
height:auto !important;
min-height:200px !important;
padding-top:0 !important;
text-align:center;
font-size:1rem;
ul,ol {
text-align:left;
}
}
#top-container {
background-color:black;
display: grid;
justify-content:center;
padding:2rem 0 7rem 0;
text-align:center;
}
div.root {
flex-grow: 1;
overflow: auto;
}
html {
font-size: 100%;
}
.listing {
width:50%;
margin:auto;
//display:grid;
//justify-content: center;
}
@media (min-width:1px) and (max-width: 1199px) {
html {
font-size: 100%;
}
}
}