From: Stephen Jianu <stephen@stephenjianu.com>
Date: Mon, 27 Nov 2023 00:24:06 +0000 (-0600)
Subject: Tweak CSS to allow cards to reflow
X-Git-Url: https://stephenjianu.com/gitweb/?a=commitdiff_plain;h=refs%2Fheads%2Fmobile;p=donsol-js.git

Tweak CSS to allow cards to reflow
---

diff --git a/sources/links/main.css b/sources/links/main.css
index b127901..6160f66 100644
--- a/sources/links/main.css
+++ b/sources/links/main.css
@@ -1,6 +1,6 @@
-body { background:black; font-family: 'input_mono_regular',monospace; min-width:750px; overflow-y: hidden; user-select: none; cursor: default; -webkit-app-region: drag; padding:30px;}
+body { background:black; font-family: 'input_mono_regular',monospace; overflow-y: hidden; user-select: none; cursor: default; -webkit-app-region: drag; padding:30px;}
 
-#wrapper { display: block;max-width: 900px; height: calc(25vw * 1.25 + 90px);max-height:400px;margin:0px auto;position: relative;width:100%; -webkit-app-region: drag;}
+#wrapper { display: block;max-width: 900px; height: calc(25vw * 1.25 + 90px);max-height:400px;margin:0px auto;position: relative;width:100%; min-width: 430px; -webkit-app-region: drag;}
 
 #player { display: block; font-size:12px; height:30px; line-height:20px; max-width:890px; -webkit-user-select: none;-webkit-app-region: drag; position: fixed; bottom:30px; width:calc(100% - 60px);}
 #player > * { vertical-align: top }
@@ -17,7 +17,7 @@ body { background:black; font-family: 'input_mono_regular',monospace; min-width:
 #player.locked a.escape { display:none;}
 
 #board, #table { display:block; position: absolute; width: calc(100% + 15px)}
-#board card, #table card { display: inline-block !important;height: calc(25vw * 1.25);max-height:300px;max-width:200px;width: calc(25% - 15px);margin-right: 15px;border-radius: 7px; position:relative; overflow:hidden;min-height: 300px;}
+#board card, #table card { display: inline-block !important;height: calc(25vw * 1.25);max-height:300px;max-width:200px;width: calc(25% - 15px);margin-right: 15px;border-radius: 7px; position:relative; overflow:hidden;min-height: 300px; min-width:200px;}
 #board card { top:10px; opacity:0.01; z-index:900; transition: opacity 250ms, top 150ms }
 #board card:hover { cursor:pointer; top:5px !important;}
 #board card .face { display:block;width: 100%;height: calc(100% - 5px);border-radius: 7px;}
@@ -30,8 +30,8 @@ body { background:black; font-family: 'input_mono_regular',monospace; min-width:
 #table card { }
 #table card .shortcut { position:absolute; right:20px; bottom:15px; color:#555;}
 
-#board card:nth-child(2), #table card:nth-child(2) { position:absolute; left:25%;}
-#board card:nth-child(3), #table card:nth-child(3) { position:absolute; left:50%;}
-#board card:nth-child(4), #table card:nth-child(4) { position:absolute; left:75%;}
+#board card:nth-child(2), #table card:nth-child(2) { position:relative;}
+#board card:nth-child(3), #table card:nth-child(3) { position:relative;}
+#board card:nth-child(4), #table card:nth-child(4) { position:relative;}
 
-#difficulty:hover { text-decoration: underline; cursor: pointer; }
\ No newline at end of file
+#difficulty:hover { text-decoration: underline; cursor: pointer; }