Web Dev Solutions

Catalin Mititiuc

From f1d67663dab2fd084c7e3996a83d17e9a6c5e037 Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Thu, 25 Jul 2024 12:25:44 -0700 Subject: WIP: add multiple counters to troopers and cells --- public/assets/css/map.css | 31 ++++++++++++++++++++----------- 1 file changed, 20 insertions(+), 11 deletions(-) (limited to 'public/assets/css') diff --git a/public/assets/css/map.css b/public/assets/css/map.css index e6a25aa..06fe169 100644 --- a/public/assets/css/map.css +++ b/public/assets/css/map.css @@ -516,30 +516,39 @@ use[class^="counter-"] { --translateX: -5px; --translateY: -5px; transform: scale(var(--scale)) translate(var(--translateX), var(--translateY)); - /*transform: translate(var(--translateX), var(--translateY)) scale(var(--scale));*/ } use[class^="counter-"] { transition: x 0.25s, y 0.25s; --scale: 0.5; - /*--translateY: 0px;*/ -} - -.counter use[href^="#counter"] { - /*transform: scale(0.5);*/ } g.counter use[class^="counter-"] { x: calc(var(--x) * 1.25); y: calc(var(--y) * 1.25); - /*y: 10px;*/ - /*x: var(--x);*/ - /*y: var(--y);*/ } -[data-q][data-r][data-s][data-t]:hover use[class^="counter-"], +[data-q][data-r][data-s][data-t] > use[class^="counter-"] { + x: calc(var(--x) / 6); + y: calc(var(--y) / 6); +} + +/* 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-"] { + x: calc(var(--x) * 2); + y: calc(var(--y) * 2); + --translateY: -5px; +} + +[data-q][data-r][data-s][data-t]:hover > use[class^="counter-"] { x: calc(var(--x) * 1.5); y: calc(var(--y) * 1.5); - /*--scale: 1;*/ --translateY: -5px; } -- cgit v1.2.3