diff options
| author | Tor Andersson <tor@ccxvii.net> | 2024-10-27 17:00:06 +0100 |
|---|---|---|
| committer | Tor Andersson <tor@ccxvii.net> | 2024-10-27 17:00:06 +0100 |
| commit | 3e9f0e02ed19ca23970f540bca93906e9c615991 (patch) | |
| tree | ec43f257ec177b1d33ea784bfa851cfc40f0ee30 | |
| parent | 3535e2755451c78534919e9feb38653edbb7993d (diff) | |
| download | maria-3e9f0e02ed19ca23970f540bca93906e9c615991.tar.gz | |
political card tooltips
| -rw-r--r-- | play.css | 18 | ||||
| -rw-r--r-- | play.html | 2 | ||||
| -rw-r--r-- | play.js | 9 |
3 files changed, 29 insertions, 0 deletions
@@ -45,6 +45,24 @@ body { background-color: #ece1a9; } +#tooltip { + pointer-events: none; + position: fixed; + z-index: 600; + right: 240px; + top: 60px; +} + +@media (max-width: 800px) { + #tooltip { + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + } +} + #political_display { position: relative; width: 877px; @@ -17,6 +17,8 @@ </head> <body> +<div id="tooltip" class="hide"></div> + <header> <div id="toolbar"> <details> @@ -444,6 +444,7 @@ const ui = { prompt: document.getElementById("prompt"), status: document.getElementById("status"), header: document.querySelector("header"), + tooltip: document.getElementById("tooltip"), spaces_element: document.getElementById("spaces"), pieces_element: document.getElementById("pieces"), markers_element: document.getElementById("markers"), @@ -830,6 +831,14 @@ function on_blur_piece_tip(s) { ui.pieces[s].classList.remove("tip") } +function on_focus_political_tip(c) { + ui.tooltip.className = "card polcard c" + c +} + +function on_blur_political_tip() { + ui.tooltip.className = "hide" +} + function on_focus_city(evt) { ui.status.textContent = data.cities.name[evt.target.my_id] } |