Improve node card style on small screens

3 files changed, 17 insertions, 1 deletions

diff --git a/web/style/layout.css b/web/style/layout.css
index 5b19114..d599abf 100644
--- a/web/style/layout.css
+++ b/web/style/layout.css
@@ -18,7 +18,7 @@
 }
 
 :root {
-    --card-size: 17em;
+    --card-size: min(50vw, 17em);
     --bar-height: 5em;
     --port-poster-aspect: 1.41;
     --land-poster-aspect: (1.41 / 2);
@@ -116,3 +116,9 @@ footer p {
 .homelist ul li {
     display: table-cell;
 }
+
+@media (max-width: 750px) {
+    .homelist ul {
+        padding-left: 0;
+    }
+}
\ No newline at end of file
diff --git a/web/style/navbar.css b/web/style/navbar.css
index 1c18d4f..bec46cf 100644
--- a/web/style/navbar.css
+++ b/web/style/navbar.css
@@ -79,6 +79,7 @@ nav .back::before {
 .hybrid_button p {
     display: inline;
 }
+
 @media (max-width: 1000px) {
     .hybrid_button p {
         display: none;
diff --git a/web/style/nodecard.css b/web/style/nodecard.css
index 2753083..7554649 100644
--- a/web/style/nodecard.css
+++ b/web/style/nodecard.css
@@ -112,3 +112,12 @@
     bottom: 0px;
     left: 0px;
 }
+
+@media (max-width: 750px) {
+    nav .library {
+        display: none;
+    }
+    .children {
+        justify-content: center;
+    }
+}
\ No newline at end of file