diff --git a/assets/styles/video/_container.scss b/assets/styles/video/_container.scss index b833f569..f981c35d 100644 --- a/assets/styles/video/_container.scss +++ b/assets/styles/video/_container.scss @@ -33,9 +33,8 @@ } /* 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 { - converse-muc { min-height: 62vh; /* 100vh - 30vh for video = 70vh remaining */ @@ -44,25 +43,36 @@ } /* 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 { converse-muc { - min-height: 62vh; + min-height: 68vh; /* 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) { +@media only screen and (min-width: 1024px) and (max-width: 1279px) { #peertube-plugin-livechat-container converse-root { converse-muc { - min-height: 62vh; + min-height: 70vh; /* 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 */ .send-button {