ccm/btroops
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Handle clicks in grid-top cell

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc
2025-06-16 22:41:33 -07:00
parent 1233d8e66c
commit 05e74bc33e
3 changed files with 98 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
public/assets/css/map.css
View File

@@ -265,9 +265,7 @@ g[data-y]:nth-child(odd) {
transform: scale(var(--scale));
}
[data-x]:hover use[href="#hex"],
[data-q][data-r][data-s][data-t]:hover use[href="#hex"],
[data-q][data-r][data-s][data-t].hover use[href="#hex"] {
.grid-top:hover use[href="#hex"] {
opacity: 1;
fill: orange;
stroke: black;
@@ -512,21 +510,21 @@ g.counter use[class^="counter-"] {
}
[data-q][data-r][data-s][data-t] > use[class^="counter-"],
.grid-top > use[class^="counter-"] {
.grid-top .container > use[class^="counter-"] {
--translateX: calc(var(--x) / 6 - 5px);
--translateY: calc(var(--y) / 6 - 5px);
}
[data-q][data-r][data-s][data-t]:hover > g.counter ~ use[class^="counter-"],
[data-q][data-r][data-s][data-t].hover > g.counter ~ use[class^="counter-"],
.grid-top > g.counter ~ use[class^="counter-"] {
.grid-top .container > g.counter ~ use[class^="counter-"] {
--translateX: calc(var(--x) * 2 - 5px);
--translateY: calc(var(--y) * 2 - 5px);
}
[data-q][data-r][data-s][data-t]:hover > use[class^="counter-"],
[data-q][data-r][data-s][data-t].hover > use[class^="counter-"],
.grid-top > use[class^="counter-"] {
.grid-top .container > use[class^="counter-"] {
--translateX: calc(var(--x) * 1.5 - 5px);
--translateY: calc(var(--y) * 1.5 - 5px);
}

5
public/assets/images/scenario_template.svg
View File

@@ -63,6 +63,9 @@
</g>
<g class="grid"/>
<g class="grid-top"/>
<g class="grid-top">
<use href="#hex"/>
<g class="container"/>
</g>
</g>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.6 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB