summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--play.html69
1 files changed, 33 insertions, 36 deletions
diff --git a/play.html b/play.html
index 74d5977..a83b122 100644
--- a/play.html
+++ b/play.html
@@ -26,23 +26,11 @@ main {
box-shadow: inset 0 0 8px #0008;
}
-/*
-main[data-scenario="1"] {
- background-image: url("images/The_Battle_of_White_Mountain_(by_Peter_Snayers).jpg");
- background-size: cover;
- background-position: center;
+#player1, #player2 {
+ padding: 1px;
}
-main[data-scenario="5"] {
- background-image: url(images/Malplaquet.jpg);
- background-size: cover;
- background-position: center;
-}
-*/
-
-/*
-#player1 div, #player2 div { outline: 1px dotted pink; }
-*/
+.table { width: fit-content; margin: 0 auto; }
.card, .card * {
pointer-events: none;
@@ -73,14 +61,20 @@ main[data-scenario="5"] {
.table_reserve, .table_front, .table_pool {
display: flex;
justify-content: center;
- flex-wrap: wrap;
gap: 24px;
+ padding: 0 23px;
+}
+
+.table_front {
+ min-height: 509px;
}
.table_reserve {
- margin: 24px;
+ min-height: 1px;
}
+.table_reserve .slot_dice { display: none }
+
.slot_cubes {
height: 87px;
display: flex;
@@ -122,8 +116,6 @@ main[data-scenario="5"] {
align-content: start;
}
-.table_reserve .slot_dice { display: none }
-
.stick {
width: 200px;
height: 6px;
@@ -303,27 +295,32 @@ main[data-scenario="5"] {
<div id="log"></div>
</aside>
-<main data-min-zoom="0.5" data-max-zoom="1.125" map-width="1920" map-height="1080">
+<main data-min-zoom="0.5" data-max-zoom="1.125" data-map-xheight="500">
+
+ <div class="table">
- <div class="flip" id="player1">
- <div class="player_pool">
- <div id="name1" class="player_name"></div>
- <div id="pool1" class="table_pool"></div>
- <div id="morale1" class="table_pool"></div>
+ <div class="flip" id="player1">
+ <div class="player_pool">
+ <div id="name1" class="player_name"></div>
+ <div id="pool1" class="table_pool"></div>
+ <div id="morale1" class="table_pool"></div>
+ </div>
+ <div id="reserve1" class="table_reserve"></div>
+ <div id="front1" class="table_front"></div>
</div>
- <div id="reserve1" class="table_reserve"></div>
- <div id="front1" class="table_front"></div>
- </div>
- <div id="player2">
- <div id="front2" class="table_front"></div>
- <div id="reserve2" class="table_reserve"></div>
- <div class="player_pool">
- <div id="morale2" class="table_pool"></div>
- <div id="pool2" class="table_pool"></div>
- <div id="name2" class="player_name"></div>
+ <div id="player2">
+ <div id="front2" class="table_front"></div>
+ <div id="reserve2" class="table_reserve"></div>
+ <div class="player_pool">
+ <div id="morale2" class="table_pool"></div>
+ <div id="pool2" class="table_pool"></div>
+ <div id="name2" class="player_name"></div>
+ </div>
</div>
- </div>
+
+ <div class="table">
+
</main>
<footer id="status"></footer>