From 768b8358a2882d544d81d611517c2462ff61ab03 Mon Sep 17 00:00:00 2001
From: Tor Andersson <tor@ccxvii.net>
Date: Wed, 29 Sep 2021 22:16:37 +0200
Subject: 300: Tweaks for tiny screen sizes.

---
 play.html | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

(limited to 'play.html')

diff --git a/play.html b/play.html
index 4f21b7b..fe3cb5e 100644
--- a/play.html
+++ b/play.html
@@ -86,6 +86,30 @@
 	height: 525px;
 }
 
+/* PHONE SIZE: squeeze side bar on small screens */
+
+.log_button { display: none }
+
+@media (max-height: 700px) {
+	.card_info .card {
+		margin: 0 auto;
+		width: 100px;
+		height: 140px;
+		border-radius: 5px;
+	}
+	.role_info { padding: 3px 20px; }
+	.card_info { padding: 5px 0px; }
+	#deck_info { padding-top: 5px; }
+}
+
+@media (max-width: 1200px) {
+	.prompt {
+		font-size: medium;
+		margin: 0 5px;
+	}
+	.log_button { display: block }
+}
+
 /* CARD ACTION POPUP MENU */
 
 #popup {
@@ -259,6 +283,7 @@
 			</div>
 		</div>
 
+		<div class="image_button log_button" onclick="toggle_log()"><img src="/images/scroll-quill.svg"></div>
 		<div class="image_button chat_button" onclick="toggle_chat()"><img src="/images/chat-bubble.svg"></div>
 
 		<div id="prompt" class="prompt">Connecting...</div>
-- 
cgit v1.2.3