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

better sizing for mobile and desktop devices

Browse Source
This commit is contained in:
matty 2024-06-19 17:43:09 -04:00
parent 01b93c1887
commit 772c1c1d14
1 changed files with 22 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -31,3 +31,25 @@
min-height: max(30vh, 200px);
}
}
/* Media query for mobile devices */
@media only screen and (max-width: 50vw) {
#peertube-plugin-livechat-container {
height: 70vh; /* 100vh - 30vh for video = 70vh remaining */
}
}
/* Media query for tablets in portrait mode */
@media only screen and (min-width: 50vw) and (max-width: 75vw) {
#peertube-plugin-livechat-container {
height: 65vh; /* Slightly less to account for other elements */
}
}
/* Media query for tablets in landscape mode */
@media only screen and (min-width: 76vw) and (max-width: 100vw) {
#peertube-plugin-livechat-container {
height: 70vh; /* Assuming more height can be used */
}
}