summaryrefslogtreecommitdiff
path: root/cards.css
diff options
context:
space:
mode:
authorTor Andersson <tor@ccxvii.net>2023-11-20 02:58:24 +0100
committerTor Andersson <tor@ccxvii.net>2024-01-08 16:36:47 +0100
commit95b90a9b4c21d6fd0805177d5193a8a62fa217ad (patch)
treecbbe969cf9b3e392da9ee80e4e67192885a33192 /cards.css
parentea85d06093090d417d60a01e3bbe637931c4544d (diff)
downloadtable-battles-95b90a9b4c21d6fd0805177d5193a8a62fa217ad.tar.gz
data processing
Diffstat (limited to 'cards.css')
-rw-r--r--cards.css154
1 files changed, 154 insertions, 0 deletions
diff --git a/cards.css b/cards.css
new file mode 100644
index 0000000..a670221
--- /dev/null
+++ b/cards.css
@@ -0,0 +1,154 @@
+.card {
+ position: relative;
+ grid-template-rows: min-content min-content 1fr min-content min-content;
+ font-family: "Source Serif";
+ font-size: 14px;
+ line-height: 18px;
+ width: 250px;
+ height: 350px;
+ background-color: #ca8;
+ color: black;
+ border: 1px solid black;
+ border-radius: 12px;
+ box-shadow: 1px 2px 8px #0008;
+}
+
+.formation {
+ border-top: 1px solid black;
+ border-bottom: 1px solid black;
+ margin: 12px 0;
+ padding: 6px 30px 6px 0;
+ text-align: center;
+ font-size: 16px;
+ line-height: 16px;
+}
+
+.formation.red { background-color: #e32223; color: white; }
+.formation.pink { background-color: #f49899; color: black; }
+.formation.blue { background-color: #2482e4; color: white; }
+.formation.dkblue { background-color: #44d; color: white; }
+
+.strength {
+ position: absolute;
+ top: 6px;
+ right: 4px;
+ background-color: #dadada;
+ color: black;
+ border: 2px solid black;
+ border-width: 4px 1px;
+ border-radius: 50%;
+ min-width: 18px;
+ padding: 0 2px;
+ height: 32px;
+ line-height: 32px;
+ font-size: 18px;
+ text-align: center;
+}
+
+.dice_area {
+ position: relative;
+ font-size: 24px;
+ line-height: 24px;
+ text-align: center;
+ margin: 12px 0;
+}
+
+.dice_area::before { content: " ~ " }
+.dice_area::after { content: " ~ " }
+
+.dice_area .star {
+ position: absolute;
+ right: 0px;
+ top: 4px;
+ font-size: 24px;
+ line-height: 24px;
+ padding: 0 12px;
+}
+
+.action_row {
+ font-style: italic;
+ display: grid;
+ margin: 12px 0;
+ padding: 0 8px;
+ grid-template-columns: 1fr 1fr;
+ gap: 4px;
+}
+
+.action_row > div {
+ border: 1px solid black;
+ padding: 2px 4px;
+}
+
+.action_target:empty {
+ visibility: hidden;
+}
+
+.action_effect:empty {
+ visibility: hidden;
+}
+
+.action_type {
+ background-color: #e0855d;
+ min-height: 18px;
+}
+.action_type.reaction {
+ background-color: #d06aa1;
+}
+.action_requirement {
+ background-color: #daad5d;
+ text-align: center;
+}
+.action_target {
+ grid-column: 1 / 3;
+ background-color: #daad5d;
+ min-height: 18px;
+ text-align: center;
+}
+.action_effect {
+ grid-column: 1 / 3;
+ background-color: #e3d3c3;
+ min-height: 36px;
+}
+
+.action_effect:empty {
+ min-height: 18px;
+}
+
+.flavor {
+ font-family: "Source Serif SmText";
+ margin: 12px 0;
+ padding: 0 12px;
+ font-size: 11px;
+ line-height: 14px;
+}
+
+.reserve {
+ position: absolute;
+ font-size: 12px;
+ line-height: 12px;
+ bottom: 0px;
+ left: 0px;
+ padding: 8px;
+ width: 234px;
+ text-align: center;
+}
+
+.card_number {
+ position: absolute;
+ font-size: 10px;
+ line-height: 12px;
+ bottom: 0px;
+ right: 0px;
+ padding: 8px 8px;
+ opacity: 50%;
+}
+
+.wing_name {
+ position: absolute;
+ font-size: 10px;
+ line-height: 12px;
+ bottom: 0px;
+ left: 0px;
+ padding: 8px 8px;
+ opacity: 50%;
+}