| index : btroops | |
| Virtual board game-aid for BattleTroops, an infantry combat simulator wargame published by FASA in 1989. |
| aboutsummaryrefslogtreecommitdiff |
diff options
| author | Catalin Mititiuc <Catalin.Mititiuc@gmail.com> | 2024-03-23 14:25:29 -0700 |
|---|---|---|
| committer | Catalin Mititiuc <Catalin.Mititiuc@gmail.com> | 2024-03-23 14:25:29 -0700 |
| commit | e9d104f07823a6165315938ce48cf3d14465fe17 (patch) | |
| tree | 6257abea7f78f68baa38918d3cdc9621bd51a4f5 | |
| parent | 51f2656ad9b4cfcd1661fec3ea4ef4986cdbee8a (diff) | |
Works but need to next inputs inside labels if want no text
| -rw-r--r-- | index.html | 18 | ||||
| -rw-r--r-- | style.css | 34 |
2 files changed, 38 insertions, 14 deletions
@@ -77,18 +77,12 @@ </p> --> <p class="damage"> <span> - <!-- <label> - </label> - <label> - </label> - <label> - </label> --> - <input type="radio" name="d1"> - <!-- <label>label1</label> --> - <input type="radio" name="d1"> - <!-- <label>label2</label> --> - <input type="radio" name="d1" checked> - <!-- <label>label3</label> --> + <input type="radio" name="d1" id="clear" checked> + <label for="clear">lethal</label> + <input type="radio" name="d1" id="bruise"> + <label for="bruise">clear</label> + <input type="radio" name="d1" id="lethal"> + <label for="lethal">bruise</label> </span> </p> <p><span>Troop Number</span> 1</p> @@ -95,24 +95,54 @@ input { outline: 2px solid deeppink; } +input + label { + border: 1px solid red; + display: none; +} + input:first-of-type { outline: none; } +label:first-of-type { + border: none; + display: inline; +} + input:checked { border: none; outline: 2px solid deeppink; } -input:has(+ input:checked) { +input:checked + label { + border: 1px solid red; + display: none; +} + +input:has(+ label + input:checked) { border: none; outline: 2px solid deeppink; } -input[type="radio"]:checked + input { +label:has(+ input:checked) { + border: 1px solid red; + display: none; +} + +input[type="radio"]:checked + label + input { outline: none; } +input:checked + label + input + label { + border: none; + display: inline; +} + +input { + position: absolute; + opacity: 0; +} + image#img1 { transform: scale(3.41) rotate(-0.15deg); /* opacity: 0.33; */ |