Web Dev Solutions

Catalin Mititiuc

svg { background-color: darkgray; flex-basis: 100%; } div#content { flex-basis: 0; } body { margin: 0; } circle#point { fill: transparent; stroke: black; stroke-width: 2px; } use[href="#point"] { opacity: 0; } use[href="#point"].active { opacity: 1; } circle.counter { stroke: transparent; stroke-width: 0.5in; } circle.counter[data-troop-allegiance="liao"] { fill: green; } circle.counter[data-troop-allegiance="davion"] { fill: red; } text.counter { font-size: 80px; font-weight: bold; stroke: black; fill: white; stroke-width: 2px; font-family: sans-serif; cursor: default; pointer-events: none; } rect#map { fill: black; opacity: 0; /* fill-opacity: 0; stroke: red; stroke-width: 4px; */ } polygon.firing-arc { opacity: 0.1; fill: black; /* fill: transparent; stroke-width: 2px; stroke: black; */ } button.set-firing-arc img { vertical-align: middle; pointer-events: none; } line.firing-arc { stroke: blue; opacity: 0.1; } line.ruler { stroke-width: 0.25in; } .sight-line { stroke: black; stroke-width: 3px; } .soldier-record { display: inline-block; white-space: nowrap; } image#img1 { transform: scale(3.41) rotate(-0.15deg); /* opacity: 0.33; */ } image#img2 { transform: scale(1.39, 1.407) rotate(0.07deg); /* opacity: 0.33; */ } .wall { fill: none; stroke: red; stroke-width: 7px; opacity: 0.7; } #hex { opacity: 0.2; /* stroke: black; stroke-opacity: 0.2; */ transform: scale(0.26) translate(-2in, -2in); } #asterisk { font-size: 30; } #record-sheet { display: flex; /* display: none; */ } #record-sheet > div { padding: 0 2px; } #record-sheet > div > div { border: 1px solid black; margin: 2px 0; padding: 2px; } img.logo { width: 100px; margin: 0 auto; display: block; } div.soldier-record.selected { background-color: lightgray; } rect#debug-view-box { /* stroke: red; stroke-width: 20px; */ fill: blue; fill-opacity: 0.2; } @media (width >= 1800px) { body { display: flex; } }