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

Good-for-now fix to counter positions for webkit

Browse Source
This commit is contained in:
Catalin Constantin Mititiuc 2024-07-27 14:10:06 -07:00
parent 54ad14b3f9
commit 4a4efb894f
1 changed files with 11 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -501,48 +501,33 @@ text.elevation {
} }
use[class^="counter-"] { use[class^="counter-"] {
--scale: 1;
--translateX: -5px;
--translateY: -5px;
transform: scale(var(--scale)) translate(var(--translateX), var(--translateY)); transform: scale(var(--scale)) translate(var(--translateX), var(--translateY));
} transition: transform 0.25s;
use[class^="counter-"] {
transition: x 0.25s, y 0.25s;
--scale: 0.5; --scale: 0.5;
} }
g.counter use[class^="counter-"] { g.counter use[class^="counter-"] {
x: calc(var(--x) * 1.25); --translateX: calc(var(--x) - 5px);
y: calc(var(--y) * 1.25); --translateY: var(--y);
} }
[data-q][data-r][data-s][data-t] > use[class^="counter-"] { [data-q][data-r][data-s][data-t] > use[class^="counter-"],
x: calc(var(--x) / 6); .grid-top > use[class^="counter-"] {
y: calc(var(--y) / 6); --translateX: calc(var(--x) / 6 - 5px);
--translateY: calc(var(--y) / 6 - 5px);
} }
/* Counters carried by a trooper */
[data-q][data-r][data-s][data-t]:hover g.counter use[class^="counter-"] {
/*x: calc(var(--x) * 1.5);*/
/*y: calc(var(--y) * 1.5);*/
/*--translateY: -5px;*/
}
/* Counters placed on a hex */
[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-"],
[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 > g.counter ~ use[class^="counter-"] {
x: calc(var(--x) * 2); --translateX: calc(var(--x) * 2 - 5px);
y: calc(var(--y) * 2); --translateY: calc(var(--y) * 2 - 5px);
--translateY: -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-"],
[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 > use[class^="counter-"] {
x: calc(var(--x) * 1.5); --translateX: calc(var(--x) * 1.5 - 5px);
y: calc(var(--y) * 1.5); --translateY: calc(var(--y) * 1.5 - 5px);
--translateY: -5px;
} }