From 82d3a4b415ba920176058d615b697e84a49adabc Mon Sep 17 00:00:00 2001
From: Catalin Mititiuc
Date: Tue, 30 Apr 2024 10:17:45 -0700
Subject: Create record sheet dynamically when map is loaded
---
public/style.css | 76 ++++++++++++--------------------------------------------
1 file changed, 16 insertions(+), 60 deletions(-)
(limited to 'public/style.css')
diff --git a/public/style.css b/public/style.css
index 22f592f..c229889 100644
--- a/public/style.css
+++ b/public/style.css
@@ -86,6 +86,10 @@ div#content {
background-color: gray;
}
+#record-sheet .name {
+ text-transform: capitalize;
+}
+
#record-sheet > div {
/* padding: 0 2px; */
overflow-y: auto;
@@ -233,72 +237,20 @@ g#points g.hover use.counter {
r: 7px;
}
-g#points g.hover use.counter:not(.clone) {
- /* stroke: orange; */
- /* stroke-width: 2px; */
-}
-
-g#points use.counter[data-allegiance="davion"] {
- fill: red;
-}
-
-g#points use.counter[data-allegiance="liao"] {
- fill: green;
-}
-
g#points use.clone {
stroke: white;
stroke-width: 0.5px;
stroke-dasharray: 1;
}
-g#points use[data-allegiance="davion"].clone {
+g#points use[data-allegiance="defender"].clone {
fill: rgb(255, 126, 126);
}
-g#points use[data-allegiance="liao"].clone {
+g#points use[data-allegiance="attacker"].clone {
fill: rgb(130, 190, 130);
}
-
-/* ======================================================= */
-
-/* g#counters {
- pointer-events: none;
-} */
-
-/* g#counters use {
- r: 5px;
-}
-
-g#counters use:hover {
- stroke: orange;
- stroke-width: 2px;
- r: 8px;
-} */
-
-/* g#counters use[data-allegiance="davion"] {
- fill: red;
-}
-
-g#counters use[data-allegiance="liao"] {
- fill: green;
-} */
-
-/* g#counters use.clone {
- stroke: white;
- stroke-width: 0.5px;
- stroke-dasharray: 1;
-}
-
-g#counters use[data-allegiance="davion"].clone {
- fill: rgb(255, 126, 126);
-}
-
-g#counters use[data-allegiance="liao"].clone {
- fill: rgb(130, 190, 130);
-} */
-
text.counter, #troop-counter text {
font-size: 12px;
font-weight: bold;
@@ -314,11 +266,11 @@ text.counter, #troop-counter text {
user-select: none;
}
-polygon.firing-arc[data-allegiance="davion"] {
+polygon.firing-arc[data-allegiance="defender"] {
fill: red;
}
-polygon.firing-arc[data-allegiance="liao"] {
+polygon.firing-arc[data-allegiance="attacker"] {
fill: green;
}
@@ -353,11 +305,11 @@ button.set-firing-arc img {
background-color: white;
}
-.soldier-record[data-allegiance="liao"] [slot="troop-number"] svg {
+.soldier-record[data-allegiance="attacker"] [slot="troop-number"] svg {
fill: green;
}
-.soldier-record[data-allegiance="davion"] [slot="troop-number"] svg {
+.soldier-record[data-allegiance="defender"] [slot="troop-number"] svg {
fill: red;
}
@@ -377,11 +329,11 @@ button.set-firing-arc img {
font-family: monospace;
}
-.soldier-record[data-allegiance="davion"] [slot="troop-number"] img {
+.soldier-record[data-allegiance="defender"] [slot="troop-number"] img {
fill: red;
}
-.soldier-record[data-allegiance="liao"] [slot="troop-number"] img {
+.soldier-record[data-allegiance="attacker"] [slot="troop-number"] img {
fill: green;
}
@@ -419,6 +371,10 @@ img.logo {
display: none;
}
+#map-dialog {
+ border: 1px solid black;
+}
+
@media (width >= 1800px) {
#record-sheet {
flex-direction: row;
--
cgit v1.2.3