diff options
| author | Tor Andersson <tor@ccxvii.net> | 2023-10-20 19:01:29 +0200 |
|---|---|---|
| committer | Tor Andersson <tor@ccxvii.net> | 2023-10-20 19:01:29 +0200 |
| commit | 4e9345ccc9ab4eb8c8b7ae15647deb65147ea268 (patch) | |
| tree | 66a3f0ae105909a9f73f0007a304387b2feb9402 | |
| parent | 0fcf0a53f80077b3aaad1e4e8290ded060906704 (diff) | |
| download | nevsky-4e9345ccc9ab4eb8c8b7ae15647deb65147ea268.tar.gz | |
Mobile layout.
| -rw-r--r-- | about.html | 7 | ||||
| -rw-r--r-- | play.css | 28 | ||||
| -rw-r--r-- | play.html | 48 |
3 files changed, 43 insertions, 40 deletions
@@ -9,14 +9,11 @@ and alliances will provide a panoply of lords and vassals to serve on campaign—but only for limited periods. Players must keep an eye on the calendar and reward lords to keep them in the field. -<br clear="left"> <p> Designer: Volko Ruhnke. - -<p> -Copyright © 2019 -<a href="https://www.gmtgames.com/p-1009-nevsky-teutons-and-rus-in-collision-1240-1242-2nd-edition.aspx">GMT Games, LLC</a>. +<br> Copyright © 2019 <a href="https://www.gmtgames.com/p-1009-nevsky-teutons-and-rus-in-collision-1240-1242-2nd-edition.aspx">GMT Games, LLC</a>. +<br> Programming © 2022 Tor Andersson. <ul> <li><a href="/nevsky/info/rules.html">Rules of Play</a> @@ -685,10 +685,23 @@ body.shift .mustered_vassals { .card_info { border-bottom: 1px solid black; + padding: 12px; + overflow: clip; } .card_info .card { - margin: 12px auto; + margin: 0 auto; +} + +@media (max-height: 800px) { + .card_info { height: 95px; } + .card_info:hover { height: auto; } +} + +@media (max-height: 600px) { + .card_info { + display: none; + } } .card.disabled { @@ -703,24 +716,21 @@ body.shift .mustered_vassals { /* MAP */ -#mapwrap { - width: 1275px; - height: 1650px; - box-shadow: 0px 1px 10px #0008; - z-index: 3; -} - #map { + margin: 0 auto ; + position: relative; background-repeat: no-repeat; background-size: cover; width: 1275px; height: 1650px; overflow: clip; + box-shadow: 0px 1px 10px #0008; + z-index: 3; } #map { background-image: url(map75.jpg) } @media (min-resolution: 97dpi) { -#map { background-image: url(map150.jpg) } + #map { background-image: url(map150.jpg) } } .box { @@ -2,14 +2,15 @@ <!-- 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, viewport-fit=cover"> +<meta name="theme-color" content="#444"> <meta charset="utf-8"> <title>NEVSKY</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="data.js"></script> <script defer src="play.js"></script> </head> @@ -17,23 +18,20 @@ <header> <div id="toolbar"> - <div class="menu"> - <div class="menu_title"><img src="/images/cog.svg"></div> - <div class="menu_popup"> - <a class="menu_item" target="_blanK" href="/nevsky/info/rules.html">Rules of Play</a> - <a class="menu_item" target="_blanK" href="/nevsky/info/playbook.html">Background Book</a> - <a class="menu_item" target="_blanK" href="/nevsky/info/pac.html">Reference Sheets</a> - <a class="menu_item" target="_blanK" href="/nevsky/info/cards.html">Arts of War</a> - <a class="menu_item" target="_blanK" href="/nevsky/info/lords.html">Lord Mats</a> - <div class="resign menu_separator"></div> - <div class="resign menu_item" onclick="confirm_resign()">Resign</div> - </div> - </div> - <div class="icon_button" onclick="toggle_pieces()"><img src="/images/earth-africa-europe.svg"></div> - <div class="icon_button" onclick="toggle_log()"><img src="/images/scroll-quill.svg"></div> + <details> + <summary><img src="/images/cog.svg"></summary> + <menu> + <li><a target="_blank" href="/nevsky/info/rules.html">Rules of Play</a> + <li><a target="_blank" href="/nevsky/info/playbook.html">Background Book</a> + <li><a target="_blank" href="/nevsky/info/pac.html">Reference Sheets</a> + <li><a target="_blank" href="/nevsky/info/cards.html">Arts of War</a> + <li><a target="_blank" href="/nevsky/info/lords.html">Lord Mats</a> + <li class="resign separator"> + <li class="resign" onclick="confirm_resign()">Resign + </menu> + </details> + <button class="icon_button" onclick="toggle_pieces()"><img src="/images/earth-africa-europe.svg"></button> </div> - <div id="prompt"></div> - <div id="actions"></div> </header> <aside> @@ -57,12 +55,11 @@ <div id="log"></div> </aside> -<main> +<main data-min-zoom="1" data-map-height="1100"> <!-- MAP, TUCKED, EVENTS --> <section id="sec_map"> -<div id="mapwrap"> <div id="map"> <div id="veche"></div> @@ -84,14 +81,13 @@ <div id="vp1" class="hide marker circle victory teutonic v0 stack"></div> <div id="legate" class="hide"></div> <div id="smerdi" class="box"></div> - <div id="castle11" class="hide marker rectangle castle teutonic"/></div> - <div id="castle12" class="hide marker rectangle castle teutonic"/></div> - <div id="castle21" class="hide marker rectangle castle russian"/></div> - <div id="castle22" class="hide marker rectangle castle russian"/></div> + <div id="castle11" class="hide marker rectangle castle teutonic"></div> + <div id="castle12" class="hide marker rectangle castle teutonic"></div> + <div id="castle21" class="hide marker rectangle castle russian"></div> + <div id="castle22" class="hide marker rectangle castle russian"></div> </div> </div> -</div> <div class="tuck_under_map"> <div id="capabilities1"></div> |