matty/peertube-plugin-livechat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

test better sizing and media queries

Browse Source
This commit is contained in:
matty 2024-06-22 10:42:39 -04:00
parent 009d84ef4f
commit 42bd732ebb
1 changed files with 16 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
assets/styles/video/_container.scss
View File

@ -33,9 +33,8 @@
} }
/* Media query for mobile devices */ /* Media query for mobile devices */
@media only screen and (max-width: 50vw) { @media only screen and (max-width: 767px) {
#peertube-plugin-livechat-container converse-root { #peertube-plugin-livechat-container converse-root {
converse-muc { converse-muc {
min-height: 62vh; min-height: 62vh;
/* 100vh - 30vh for video = 70vh remaining */ /* 100vh - 30vh for video = 70vh remaining */
@ -44,25 +43,36 @@
} }
/* Media query for tablets in portrait mode */ /* Media query for tablets in portrait mode */
@media only screen and (min-width: 50vw) and (max-width: 75vw) { @media only screen and (min-width: 768px) and (max-width: 1023px) {
#peertube-plugin-livechat-container converse-root { #peertube-plugin-livechat-container converse-root {
converse-muc { converse-muc {
min-height: 62vh; min-height: 68vh;
/* Slightly less to account for other elements */ /* Slightly less to account for other elements */
} }
} }
} }
/* Media query for tablets in landscape mode */ /* Media query for tablets in landscape mode */
@media only screen and (min-width: 76vw) and (max-width: 100vw) { @media only screen and (min-width: 1024px) and (max-width: 1279px) {
#peertube-plugin-livechat-container converse-root { #peertube-plugin-livechat-container converse-root {
converse-muc { converse-muc {
min-height: 62vh; min-height: 70vh;
/* Assuming more height can be used */ /* Assuming more height can be used */
} }
} }
} }
/* Media query for desktops */
@media only screen and (min-width: 1280px) {
#peertube-plugin-livechat-container converse-root {
converse-muc {
height: inherit;
/* Full desktop experience */
}
}
}
/* custom toolbar CSS */ /* custom toolbar CSS */
.send-button { .send-button {