rf-web/_sass/includes/watch-panel.scss

64 lines
924 B
SCSS
Raw Normal View History

2020-09-05 14:12:50 +00:00
.watch-panel {
margin-bottom: var(--size-128);
2020-09-11 09:42:00 +00:00
width: 95vw;
margin: 0 auto;
.watch-contents {
display: flex;
.left-panel {
flex: 4;
}
.right-panel {
flex: 1;
display: flex;
flex-direction: column;
&.chat-hidden {
flex: 0;
.discord-chat {
width: 0;
2020-09-05 14:12:50 +00:00
2020-09-11 09:42:00 +00:00
@include touch {
display: none;
}
}
}
}
#twitch-embed {
2020-09-05 14:12:50 +00:00
width: 100%;
height: 100%;
2020-09-11 09:42:00 +00:00
iframe {
width: 100%;
height: 100%;
}
2020-09-05 14:12:50 +00:00
}
2020-09-11 09:42:00 +00:00
.discord-chat {
iframe {
width: 100%;
}
}
2020-09-05 14:12:50 +00:00
2020-09-11 09:42:00 +00:00
@include touch {
flex-direction: column;
#twitch-embed {
height: 80vh;
}
2020-09-05 14:12:50 +00:00
}
}
2020-09-11 09:42:00 +00:00
.watch-controls {
display: flex;
justify-content: flex-end;
margin-top: var(--size-16);
button {
border: none;
margin-left: var(--size-16);
2020-09-05 14:12:50 +00:00
}
}
}