diff options
author | Tor Andersson <tor@ccxvii.net> | 2023-12-08 18:35:26 +0100 |
---|---|---|
committer | Tor Andersson <tor@ccxvii.net> | 2024-01-08 16:36:47 +0100 |
commit | 756b4c410df948ee2871a522107e0fdcdfaa6e9a (patch) | |
tree | df77909ffa8972b90d1f7e6a028435fa54edce1b /play.html | |
parent | 9036c6733898f57d47411a4e8a3c3c0fdf1dfd33 (diff) | |
download | table-battles-756b4c410df948ee2871a522107e0fdcdfaa6e9a.tar.gz |
Don't wrap battle lines.
Diffstat (limited to 'play.html')
-rw-r--r-- | play.html | 69 |
1 files changed, 33 insertions, 36 deletions
@@ -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> |