From a1256bbaa9137a206ea7881f7e60cb2caa66d3e0 Mon Sep 17 00:00:00 2001
From: crunk <dvanderkleij@gmail.com>
Date: Mon, 3 May 2021 12:31:08 +0200
Subject: [PATCH] first small changes for mobile and slow computers

---
 library/static/css/dropdown.css | 12 ++++++++++++
 library/static/css/style.css    |  8 ++++++--
 library/static/js/script.js     |  9 +++++++--
 3 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/library/static/css/dropdown.css b/library/static/css/dropdown.css
index 2f8906c..4258644 100644
--- a/library/static/css/dropdown.css
+++ b/library/static/css/dropdown.css
@@ -53,3 +53,15 @@
 
 /* Change the background color of the dropdown button when the dropdown content is shown */
 .dropdown:hover .dropbtn {background-color: #3e8e41;}
+
+@media only screen and (min-device-width: 320px) and (max-device-width: 480px)  {
+  .dropdown-content button {
+      font-size: 1.6em;
+  }
+  .container > button {
+      font-size: 1.6em;
+  }
+  .dropdown > button {
+      font-size: 1.6em;
+  }
+}
diff --git a/library/static/css/style.css b/library/static/css/style.css
index f8f64d3..90d94c0 100644
--- a/library/static/css/style.css
+++ b/library/static/css/style.css
@@ -5,7 +5,6 @@ html, body {
 
 body:after {
   font-size: .8em;
-  background-color: #EB4377;
   position: fixed;
   width: 100%;
   text-align: center;
@@ -16,7 +15,6 @@ body:after {
   width: 1px; height: 1px;
   transform: translate(-100%, -100%);
   border-radius: 50%;
-  filter: url(#filter);
 	z-index: -1;
 	position: fixed;
 }
@@ -148,3 +146,9 @@ a:link { text-decoration: none; }
 a:visited { text-decoration: none; }
 a:hover { text-decoration: none; }
 a:active { text-decoration: none; }
+
+@media only screen and (min-device-width: 320px) and (max-device-width: 480px)  {
+  td {
+      font-size: 1.6em;
+  }
+}
diff --git a/library/static/js/script.js b/library/static/js/script.js
index e286451..54700ad 100644
--- a/library/static/js/script.js
+++ b/library/static/js/script.js
@@ -11,7 +11,7 @@ function boxShadows(max) {
   let ret = [];
   for (let i = 0; i < max; ++i) {
     ret.push(`
-      ${ rn(1, 100) }vw ${ rn(1, 100) }vh ${ rn(20, 60) }vmin ${ rn(10, 30) }vmin
+      ${ rn(1, 110) }vw ${ rn(1, 110) }vh ${ rn(20, 30) }vmin ${ rn(10, 60) }vmin
       ${ rs('#F52D75', '#CCBD4F', '#32497F', '#EB4377') }
     `)
   }
@@ -21,7 +21,12 @@ function boxShadows(max) {
 const cloud = document.querySelector('#cloud');
 
 function update() {
-  cloud.style.boxShadow = boxShadows(30);
+  if (window.screen.availWidth > 400 && window.screen.availHeight > 400 ) {
+    cloud.style.boxShadow = boxShadows(15);
+  }
+  else {
+    document.body.style.backgroundImage = "linear-gradient(to bottom right, white, #F52D75)";
+  }
 }
 
 window.addEventListener('load', update);