localwebsite: cams: better mobile layout

2 files changed, 21 insertions, 13 deletions

diff --git a/localwebsite/config.php b/localwebsite/config.php
index 6b595a4..d28d714 100644
--- a/localwebsite/config.php
+++ b/localwebsite/config.php
@@ -49,7 +49,7 @@ return [
     ],
 
     'static' => [
-        'app.css' => 8,
+        'app.css' => 9,
         'app.js' => 2,
         'polyfills.js' => 1,
         'modem.js' => 1,
diff --git a/localwebsite/htdocs/assets/app.css b/localwebsite/htdocs/assets/app.css
index 73e0667..59c0f35 100644
--- a/localwebsite/htdocs/assets/app.css
+++ b/localwebsite/htdocs/assets/app.css
@@ -153,16 +153,24 @@
 }
 
 /* cams page */
-.camfeeds {
-    display: flex;
-    flex-wrap: wrap;
-    flex-direction: row;
-}
-.camfeeds > video {
-    display: flex;
-    flex-basis: calc(50% - 20px);
-    justify-content: center;
-    flex-direction: column;
-    width: calc(50% - 10px);
-    margin: 5px;
+@media only screen and (min-width: 640px) {
+    .camfeeds {
+        display: flex;
+        flex-wrap: wrap;
+        flex-direction: row;
+    }
+
+    .camfeeds > video {
+        display: flex;
+        flex-basis: calc(50% - 20px);
+        justify-content: center;
+        flex-direction: column;
+        width: calc(50% - 10px);
+        margin: 5px;
+    }
+}
+@media only screen and (max-width: 639px) {
+    .camfeeds > video {
+        max-width: 100%;
+    }
 }
\ No newline at end of file