Initial commit

docs/components/layout.md

@@ -0,0 +1,70 @@
+- Home
+- Components
+- Layout
+
+#FormLayout
+
+A layout component for organizing content with flexible orientation and alignment options.
+
+## Props
+
+
+Prop	Type	Default	Description
+orientation	'horizontal' | 'vertical'	'horizontal'	Layout direction
+align	'start' | 'center' | 'end'	'start'	Cross-axis alignment
+asChild	boolean	false	Render with Slot to style a child element
+...div props	ComponentProps<'div'>	-	All native div props
+
+### Examples
+
+```
+<FormLayout asChild orientation="label-left" align="end">
+  <label>
+    <span>Email</span>
+    <InputRoot type="email" placeholder="you@example.com" />
+  </label>
+</FormLayout>
+```
+
+## Usage
+
+Number
+
+```
+<FormLayout asChild className="w-2xs">
+  <label className="text-uk-md">
+    <p>Number</p>
+
+    <InputRoot placeholder="input"/>
+  </label>
+</FormLayout>
+```
+
+## vertical
+
+Number
+
+```
+<FormLayout asChild className="w-2xs" orientation="label-left">
+  <label>
+    <p className="text-uk-md">Number</p>
+
+    <InputRoot placeholder="input"/>
+  </label>
+</FormLayout>
+```
+
+## vertical start
+
+Number
+
+```
+<FormLayout asChild className="w-2xs">
+  <label>
+    <p className="text-uk-md">Number</p>
+
+    <InputRoot placeholder="input"/>
+  </label>
+</FormLayout>
+```
+