Web Dev Solutions

Catalin Mititiuc

From de5f3c266677590d63fda98f25085b4327710def Mon Sep 17 00:00:00 2001 From: Catalin Mititiuc Date: Mon, 25 Mar 2024 12:54:27 -0700 Subject: Clean up some styles --- damage_block.css | 2 +- index.js | 16 +++--- soldier_record_block.css | 5 +- style.css | 136 ----------------------------------------------- 4 files changed, 12 insertions(+), 147 deletions(-) diff --git a/damage_block.css b/damage_block.css index 46e55a0..c232c07 100644 --- a/damage_block.css +++ b/damage_block.css @@ -58,4 +58,4 @@ label:has(+ label input:checked) { label:has(input:checked) + label { display: block; -} \ No newline at end of file +} diff --git a/index.js b/index.js index dfff1a3..deef03b 100644 --- a/index.js +++ b/index.js @@ -300,15 +300,13 @@ map.addEventListener('mousemove', e => { document.querySelectorAll('.soldier-record').forEach(el => el.addEventListener('click', e => { - if (e.target.tagName !== 'INPUT' && e.target.tagName !== 'LABEL') { - if (el.classList.contains('selected')) { - el.classList.remove('selected'); - } else { - document.querySelectorAll('.soldier-record.selected').forEach(el => - el.classList.remove('selected') - ); - el.classList.add('selected'); - } + if (el.classList.contains('selected')) { + el.classList.remove('selected'); + } else { + document.querySelectorAll('.soldier-record.selected').forEach(el => + el.classList.remove('selected') + ); + el.classList.add('selected'); } }) ); diff --git a/soldier_record_block.css b/soldier_record_block.css index 12925b2..47bf583 100644 --- a/soldier_record_block.css +++ b/soldier_record_block.css @@ -4,11 +4,14 @@ span { margin-right: 1em; } +.physical-status-track { + text-align: center; +} + .physical-status-track span { margin: 0; padding: 0; display: inline-block; - text-align: center; vertical-align: middle; } diff --git a/style.css b/style.css index 51481b9..2283b43 100644 --- a/style.css +++ b/style.css @@ -70,142 +70,6 @@ line.ruler { display: inline-block; } -.soldier-record ul { - margin: 0; - padding: 0; -} - -.soldier-record ul li { - display: inline; - margin-left: 1em; -} - -.soldier-record p { - margin: 0; -} - -.damage label { - margin: 0; - padding: 0; -} - -.damage span { - margin: 0; - padding: 0; -} - -.damage > span { - display: inline-block; - text-align: center; - font-family: serif; - vertical-align: middle; -} - -.damage-selector { - width: 20px; - height: 30px; - margin: 0; - padding: 0; - border: 1px solid black; - display: inline-block; -} - -.damage-selector.clear { - background-color: white; -} - -.damage-selector.bruise { - background-color: orange; -} - -.damage-selector.lethal { - background-color: red; -} - -.damage label input { - position: absolute; - opacity: 0; - margin: 0; - padding: 0; -} - -/* .soldier-record p.damage span { - display: inline-block; -} - -.soldier-record p.damage span input { - display: block; -} */ - -/* input { - border: none; - 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:checked + label { - border: 1px solid red; - display: none; -} - -input:has(+ label + input:checked) { - border: none; - outline: 2px solid deeppink; -} - -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; -} -*/ - -label { - display: none; -} - -label:first-of-type { - display: block; -} - -label:has(input:checked) { - display: none; -} - -label:has(+ label input:checked) { - display: none; -} - -label:has(input:checked) + label { - display: block; -} - image#img1 { transform: scale(3.41) rotate(-0.15deg); /* opacity: 0.33; */ -- cgit v1.2.3