diff options
author | Tor Andersson <tor@ccxvii.net> | 2023-10-17 18:33:41 +0200 |
---|---|---|
committer | Tor Andersson <tor@ccxvii.net> | 2023-10-20 19:05:27 +0200 |
commit | 49480720cf474a7cc74854f912b868efb8a20f27 (patch) | |
tree | 62194ed431f72ffaf68baf5c3e70d4bfdb7f765c | |
parent | e277a5e25c13469deacdf016b59b6073788b4d1c (diff) | |
download | time-of-crisis-49480720cf474a7cc74854f912b868efb8a20f27.tar.gz |
Mobile phone layout.
-rw-r--r-- | about.html | 2 | ||||
-rw-r--r-- | play.css | 16 | ||||
-rw-r--r-- | play.html | 12 |
3 files changed, 14 insertions, 16 deletions
@@ -6,8 +6,6 @@ to manipulate people and situations to ensure that the family's name is remembered by history rather than being lost in the mists of time. -<br clear="left"> - <p> Game Design by Wray Ferrell and Brad Johnson. @@ -82,6 +82,12 @@ body.Green .your_turn { background-color: hsl(99,36%,65%) } cursor: pointer; } +@media (max-width: 800px) { + #panel_list { + min-width: 2550px; + } +} + #mapwrap { width: 2550px; height: 1740px; @@ -674,7 +680,7 @@ body.tint .legion.reduced { .panel { background-color: #444; - max-width: min(calc(100% - 30px), 1636px); + width: clamp(824px, calc(100% - 30px), 1636px); margin: 12px auto 36px auto; box-shadow: 1px 2px 6px #0004; border: 1px solid #0008; @@ -801,11 +807,3 @@ body.tint .legion.reduced { border: 2px solid #444; opacity: 0.8; } - -/* MOBILE LAYOUT */ - -@media (max-width: 640px) { - .panel_body { - justify-content: center; - } -} @@ -2,14 +2,14 @@ <!-- vim:set nowrap: --> <html lang="en"> <head> -<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1"> +<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, interactive-widget=resizes-content"> <meta charset="utf-8"> <title>TIME OF CRISIS</title> <link rel="icon" href="favicon.png"> <link rel="stylesheet" href="/fonts/fonts.css"> -<link rel="stylesheet" href="/common/play.css"> +<link rel="stylesheet" href="/common/client.css"> <link rel="stylesheet" href="play.css"> -<script defer src="/common/play.js"></script> +<script defer src="/common/client.js"></script> <script defer src="play.js"></script> </head> <body class="tint p4"> @@ -30,8 +30,6 @@ <a class="menu_item" target="_blanK" href="/time-of-crisis/info/cards.html">Card Gallery</a> </div> </div> - <div class="icon_button" onclick="toggle_zoom()"><img src="/images/magnifying-glass.svg"></div> - <div class="icon_button" onclick="toggle_log()"><img src="/images/scroll-quill.svg"></div> </div> <div id="prompt"></div> <div id="actions"></div> @@ -178,6 +176,8 @@ </div> </div> +<div id="panel_list"> + <div id="played_panel" class="panel"> <div id="played_header" class="panel_header">Played</div> <div id="played" class="panel_body"> @@ -208,6 +208,8 @@ </div> </div> +</div> + </main> <footer id="status"></footer> |