Style mechanics blocks so they stand out more even without move nodes (…

…#194) Fixes: #185
iron-vault-plugin · Jun 10, 2024 · 5dcd86c · 5dcd86c
1 parent 516754e
commit 5dcd86c
Show file tree

Hide file tree

Showing 10 changed files with 31 additions and 11 deletions.
diff --git a/src/mechanics/css/details.css b/src/mechanics/css/details.css
@@ -1,7 +1,11 @@
+.iron-vault-mechanics .move .detail {
+  --blockquote-background-color: var(--background-secondary-alt);
+}
 .iron-vault-mechanics .detail {
   color: var(--text-muted);
-  --blockquote-background-color: var(--background-primary);
+  --blockquote-background-color: var(--background-secondary);
   --blockquote-color: var(--text-muted);
+  border-radius: 10px;
   & > :first-child {
     margin-left: 0.5em;
     padding-left: 1.2em;

diff --git a/src/mechanics/css/dlist-add.css b/src/mechanics/css/dlist-add.css
@@ -5,7 +5,7 @@
   & dd {
     &.amount {
       &:before {
-        color: var(--text-faint);
+        color: var(--text-muted);
       }
       &.positive {
         color: var(--text-success);

diff --git a/src/mechanics/css/dlist-meter.css b/src/mechanics/css/dlist-meter.css
@@ -5,7 +5,7 @@
   & dd {
     &.delta {
       &:before {
-        color: var(--text-faint);
+        color: var(--text-muted);
       }
       &.positive {
         color: var(--text-success);

diff --git a/src/mechanics/css/dlist-progress.css b/src/mechanics/css/dlist-progress.css
@@ -31,7 +31,7 @@
 
     &.rank {
       text-transform: capitalize;
-      color: var(--text-faint);
+      color: var(--text-muted);
       &:before {
         content: " (";
       }
@@ -60,7 +60,8 @@
       content: "t";
     }
 
-    &.from-ticks, &.to-ticks {
+    &.from-ticks,
+    &.to-ticks {
       margin-left: calc(var(--item-gap) * -1);
     }
   }

diff --git a/src/mechanics/css/dlist-roll.css b/src/mechanics/css/dlist-roll.css
@@ -10,7 +10,7 @@
       content: " + ";
     }
     &.stat-name {
-      color: var(--text-faint);
+      color: var(--text-muted);
       &:before {
         content: " (";
       }

diff --git a/src/mechanics/css/dlist-shared.css b/src/mechanics/css/dlist-shared.css
@@ -52,7 +52,7 @@
     }
     &:before,
     &:after {
-      color: var(--text-faint);
+      color: var(--text-muted);
     }
   }
   &.strong-hit {

diff --git a/src/mechanics/css/dlist-xp.css b/src/mechanics/css/dlist-xp.css
@@ -5,7 +5,7 @@
   & dd {
     &.delta {
       &:before {
-        color: var(--text-faint);
+        color: var(--text-muted);
       }
       &.positive {
         color: var(--text-success);

diff --git a/src/mechanics/css/mechanics.css b/src/mechanics/css/mechanics.css
@@ -20,9 +20,14 @@
 @import url("dlist-impact.css");
 
 .iron-vault-mechanics {
+  --shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
   cursor: default;
   margin: 0.5em auto;
   max-width: 460px;
+  background-color: var(--background-secondary);
+  padding: 1em;
+  border-radius: 10px;
+  box-shadow: var(--shadow);
   &.collapsed > :not(.toggle) {
     display: none;
   }

diff --git a/src/mechanics/css/move.css b/src/mechanics/css/move.css
@@ -1,10 +1,9 @@
 .iron-vault-mechanics details.move {
+  background-color: var(--background-secondary-alt);
   margin: 0.5em auto;
   border: 1px solid var(--color-base-30);
   border-radius: 10px;
-  box-shadow:
-    0 14px 28px rgba(0, 0, 0, 0.25),
-    0 10px 10px rgba(0, 0, 0, 0.22);
+  box-shadow: var(--shadow);
   & > :not(:nth-child(1)) {
     margin: 1em;
   }

diff --git a/test-vault/Journals/Chapter 01.md b/test-vault/Journals/Chapter 01.md
@@ -115,3 +115,14 @@ move "[Endure Harm](move:starforged\/moves\/suffer\/endure_harm)" {
 }
 
 ```
+asdfasdf
+```mechanics
+oracle-group name="Character: Curtis \"Centurion\" Shelton" {
+    oracle name="[Character Oracles \/ Character Name \/ Given Name](oracle:starforged\/oracles\/characters\/name\/given)" result="Curtis" roll=64
+    oracle name="[Character Oracles \/ Character Name \/ Callsign](oracle:starforged\/oracles\/characters\/name\/callsign)" result="Centurion" roll=19
+    oracle name="[Character Oracles \/ Character Name \/ Family Name](oracle:starforged\/oracles\/characters\/name\/family_name)" result="Shelton" roll=52
+    oracle name="[Character Oracles \/ First Look](oracle:starforged\/oracles\/characters\/first_look)" result="Weathered" roll=89
+    oracle name="[Character Oracles \/ Initial Disposition](oracle:starforged\/oracles\/characters\/initial_disposition)" result="Wanting" roll=58
+}
+```
+