chore(Card): reorder examples

dnbexperience · Dec 17, 2024 · 7e318fb · 7e318fb
1 parent ae4648a
commit 7e318fb
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 14 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
@@ -182,10 +182,8 @@ export const VerticalFields = () => {
   return (
     <ComponentBox>
       <Form.Card>
-        <Flex.Vertical>
-          <Field.String label="Label" value="Value" />
-          <Field.String label="Label" value="Value" />
-        </Flex.Vertical>
+        <Field.String label="Label" value="Value" />
+        <Field.String label="Label" value="Value" />
       </Form.Card>
     </ComponentBox>
   )

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
@@ -10,6 +10,16 @@ import * as Examples from './Examples'
 
 <Examples.Default />
 
+### Stack
+
+When `stack` is set to `true`, the Card will add a gap between its children and stretch them to the full.
+
+For [form components](uilib/extensions/forms/), you should use [Form.Card](/uilib/extensions/forms/Form/Card/) instead of the original Card component.
+
+When `stack` is set to `true`, the Card will add a gap between its children and stretch them to the full.
+
+<Examples.Stack />
+
 ### Vertical fields
 
 When using Eufemia Forms, you may want to use [Form.Card](/uilib/extensions/forms/Form/Card/) instead of the original Card component.
@@ -22,16 +32,6 @@ When using Eufemia Forms, you may want to use [Form.Card](/uilib/extensions/form
 
 <Examples.HorizontalFields />
 
-### Stack
-
-When `stack` is set to `true`, the Card will add a gap between its children and stretch them to the full.
-
-For [form components](uilib/extensions/forms/), you should use [Form.Card](/uilib/extensions/forms/Form/Card/) instead of the original Card component.
-
-When `stack` is set to `true`, the Card will add a gap between its children and stretch them to the full.
-
-<Examples.Stack />
-
 ### Nested Cards
 
 Nested cards have `responsive={false}` by default and will not behave responsive.