From b192fc0790a4815703afa6ccc782f2b573c64722 Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Thu, 11 Apr 2024 12:46:26 -0700
Subject: Import map svg in an object; add a dev server
---
public/damage_block.css | 64 +++++++++++++++++++++++++++++++++++++++++++++++++
1 file changed, 64 insertions(+)
create mode 100644 public/damage_block.css
(limited to 'public/damage_block.css')
diff --git a/public/damage_block.css b/public/damage_block.css
new file mode 100644
index 0000000..f050e36
--- /dev/null
+++ b/public/damage_block.css
@@ -0,0 +1,64 @@
+.damage-selector, .damage-effect-indicator, label {
+ width: 20px;
+}
+
+.damage-selector, .damage-effect-indicator {
+ height: 30px;
+}
+
+.damage-selector {
+ margin: 0;
+ padding: 0;
+ border: 1px solid black;
+ display: inline-block;
+}
+
+.damage-effect-indicator {
+ position: absolute;
+ margin: 0;
+ padding: 0;
+ display: block;
+ pointer-events: none;
+ font-family: monospace;
+}
+
+.damage-selector.clear {
+ background-color: white;
+}
+
+.damage-selector.bruise {
+ background-color: orange;
+}
+
+.damage-selector.lethal {
+ background-color: red;
+}
+
+label input[type="radio"] {
+ position: absolute;
+ opacity: 0;
+ margin: 0;
+ padding: 0;
+}
+
+label {
+ display: none;
+ margin: 0 auto;
+ padding: 0;
+}
+
+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;
+}
--
cgit v1.2.3