From 772c1c1d1425eda874732b46352387e4ab6e9c67 Mon Sep 17 00:00:00 2001
From: matty <matty@nicecrew.digital>
Date: Wed, 19 Jun 2024 17:43:09 -0400
Subject: [PATCH] better sizing for mobile and desktop devices

---
 assets/styles/video/_container.scss | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/assets/styles/video/_container.scss b/assets/styles/video/_container.scss
index 402af31f..208b5d29 100644
--- a/assets/styles/video/_container.scss
+++ b/assets/styles/video/_container.scss
@@ -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 */
+  }
+}
+