diff options
author | Tor Andersson <tor@ccxvii.net> | 2021-06-19 13:19:04 +0200 |
---|---|---|
committer | Tor Andersson <tor@ccxvii.net> | 2023-02-18 12:42:59 +0100 |
commit | ab0d0d9fe5f882b8c608d07894b4d3dfe876fbe3 (patch) | |
tree | 4a8169cd15443d307f73a04323893d1175fb7660 | |
parent | 659ab5a18faaea5f47ebe8d02b47b0d8e696e5f1 (diff) | |
download | 300-earth-and-water-ab0d0d9fe5f882b8c608d07894b4d3dfe876fbe3.tar.gz |
300: Various HTML and menu cleanups.
Disable "toggle log" button.
Hide resign menu.
Add debug menu.
-rw-r--r-- | about.html | 8 | ||||
-rw-r--r-- | play.html | 28 |
2 files changed, 22 insertions, 14 deletions
@@ -4,9 +4,17 @@ from the Ionian Revolt in 499 BCE to the Peace of Callias around 449 BCE. One player leads the Greek army, assembled around Athens and Sparta, and the other leads the Persian army. +<br clear="left"> + <p> Designer: Yasushi Nakaguro <p> © 2018 Bonsai Games & © 2020 <a href="https://www.nutspublishing.com/eshop/our-games/300-en">Nuts! Publishing</a> + +<ul> +<li><a href="/300-earth-and-water/info/rules.html">Rulebook</a> +<li><a href="/300-earth-and-water/info/cards.html">Cards</a> +<li><a href="/300-earth-and-water/info/notes.html">Implementation notes</a> +</ul> @@ -16,8 +16,8 @@ .grid_role { background-color: gainsboro; } .grid_log { background-color: gainsboro; } .grid_top { background-color: silver; } -.grid_top.Persia.your_turn { background-color: skyblue; } -.grid_top.Greece.your_turn { background-color: salmon; } +.Persia .grid_top.your_turn { background-color: skyblue; } +.Greece .grid_top.your_turn { background-color: salmon; } .grid_top.disconnected { background-color: red; } .role_info { background-color: silver; } .one .role_name { background-color: salmon; } @@ -78,11 +78,10 @@ } #tooltip.card { - position: absolute; + position: fixed; z-index: 100; right: 270px; top: 60px; - margin-left: -250px; width: 375px; height: 525px; } @@ -118,6 +117,8 @@ height: 878px; background-image: url("map.jpg"); background-size: cover; + box-shadow: 0px 1px 10px rgba(0,0,0,0.5); + margin: 0 auto; } .map.hide_markers > div { @@ -248,17 +249,16 @@ <div class="menu_item" onclick="window.open('info/notes.html', '_blank')">Notes</div> <div class="menu_item" onclick="window.open('info/rules.html', '_blank')">Rules</div> <div class="menu_item" onclick="window.open('info/cards.html', '_blank')">Cards</div> - <div class="menu_separator"></div> - <div class="menu_item" onclick="confirm_resign()">Resign</div> - <div class="menu_separator"></div> - <div class="menu_item" onclick="send_save()">🐞 Save</div> - <div class="menu_item" onclick="send_restore()">🐞 Restore</div> - <div class="menu_separator"></div> - <div class="menu_item" onclick="send_restart('Historical')">⚠ Restart</div> + <div class="resign menu_separator"></div> + <div class="resign menu_item" onclick="confirm_resign()">Resign</div> + <div class="debug menu_separator"></div> + <div class="debug menu_item" onclick="send_save()">🐞 Save</div> + <div class="debug menu_item" onclick="send_restore()">🐞 Restore</div> + <div class="debug menu_separator"></div> + <div class="debug menu_item" onclick="send_restart('Historical')">⚠ Restart</div> </div> </div> - <div class="image_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> @@ -276,12 +276,12 @@ <div class="grid_role"> <div class="role one"> - <div class="role_name">Greece (<span class="role_user">$USER</span>)</div> + <div class="role_name">Greece – <span class="role_user">$USER</span></div> <div class="role_info" id="greek_info">0 cards in hand</div> </div> <div class="role two"> - <div class="role_name">Persia (<span class="role_user">$USER</span>)</div> + <div class="role_name">Persia – <span class="role_user">$USER</span></div> <div class="role_info" id="persian_info">0 cards in hand</div> </div> |