feat(frontend): split offset and group fieldset modifiers

getindiekit · Jan 12, 2024 · 435ea84 · 435ea84
1 parent 28cf9a2
commit 435ea84
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 2 deletions.
diff --git a/packages/endpoint-posts/views/post-form.njk b/packages/endpoint-posts/views/post-form.njk
@@ -32,7 +32,7 @@
 
 {% macro photoFieldset(index) %}
 {% call fieldset({
-  classes: "fieldset--group"
+  classes: "fieldset--group fieldset--offset"
 }) %}
   {{ input({
     name: "photo[" + index + "][url]",

diff --git a/packages/frontend/components/fieldset/styles.css b/packages/frontend/components/fieldset/styles.css
@@ -12,11 +12,18 @@
 }
 
 .fieldset--group {
-  --fieldset-flow-space: var(--space-m);
   --label-font: var(--font-fieldset-label);
+
+  & .field {
+    margin-block-start: var(--space-m);
+  }
+}
+
+.fieldset--offset {
   background-color: var(--color-offset);
   border-radius: var(--border-radius-small);
   color: var(--color-on-offset);
+  margin-block: calc(var(--space-xs) * -1);
   padding: var(--space-m);
 
   & .fieldset__legend {