summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorTor Andersson <tor@ccxvii.net>2021-06-19 13:19:04 +0200
committerTor Andersson <tor@ccxvii.net>2023-02-18 12:42:59 +0100
commitab0d0d9fe5f882b8c608d07894b4d3dfe876fbe3 (patch)
tree4a8169cd15443d307f73a04323893d1175fb7660
parent659ab5a18faaea5f47ebe8d02b47b0d8e696e5f1 (diff)
download300-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.html8
-rw-r--r--play.html28
2 files changed, 22 insertions, 14 deletions
diff --git a/about.html b/about.html
index f87d2e3..3e9110a 100644
--- a/about.html
+++ b/about.html
@@ -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>
&copy; 2018 Bonsai Games &amp;
&copy; 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>
diff --git a/play.html b/play.html
index be0a8f9..81db5f9 100644
--- a/play.html
+++ b/play.html
@@ -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()">&#x1F41E; Save</div>
- <div class="menu_item" onclick="send_restore()">&#x1F41E; Restore</div>
- <div class="menu_separator"></div>
- <div class="menu_item" onclick="send_restart('Historical')">&#x26a0; 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()">&#x1F41E; Save</div>
+ <div class="debug menu_item" onclick="send_restore()">&#x1F41E; Restore</div>
+ <div class="debug menu_separator"></div>
+ <div class="debug menu_item" onclick="send_restart('Historical')">&#x26a0; 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 &#x2013; <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 &#x2013; <span class="role_user">$USER</span></div>
<div class="role_info" id="persian_info">0 cards in hand</div>
</div>