docs(Card): adds horizontal fields example

dnbexperience · Nov 17, 2023 · 067e382 · 067e382
1 parent 2fdbd4b
commit 067e382
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/card/Examples.tsx b/packages/dnb-design-system-portal/src/docs/uilib/components/card/Examples.tsx
@@ -43,6 +43,19 @@ export const VerticalFields = () => {
   )
 }
 
+export const HorizontalFields = () => {
+  return (
+    <ComponentBox>
+      <Card>
+        <Flex.Horizontal>
+          <Field.String label="Label" value="Value" />
+          <Field.String label="Label" value="Value" />
+        </Flex.Horizontal>
+      </Card>
+    </ComponentBox>
+  )
+}
+
 export const WithHeadingsAndAriaLabel = () => {
   return (
     <ComponentBox hidePreview>

diff --git a/packages/dnb-design-system-portal/src/docs/uilib/components/card/demos.mdx b/packages/dnb-design-system-portal/src/docs/uilib/components/card/demos.mdx
@@ -14,6 +14,10 @@ import * as Examples from './Examples'
 
 <Examples.VerticalFields />
 
+### Horizontal fields
+
+<Examples.HorizontalFields />
+
 ### Stack
 
 <Examples.Stack />