docs/objects/Flexbox.md

@@ -4,9 +4,25 @@ In addition to the methods inherited from Frame, Container, VisualObject and Obj
 
 |   |   |
 |---|---|
-|[setDirection](objects/BaseFrame/getOffset.md)|Sets the direction in which the children will be placed
-|[getDirection](objects/BaseFrame/getOffset.md)|Returns the direction
-|[setSpacing](objects/BaseFrame/setOffset.md)|Sets the space between objects
-|[getSpacing](objects/BaseFrame/setOffset.md)|Returns the space
-|[setJuustifyContent](objects/BaseFrame/getOffset.md)|Determines how the children are aligned along the main axis
-|[getJuustifyContent](objects/BaseFrame/getOffset.md)|Returns the justify content
+|[setSpacing](objects/Flexbox/setSpacing.md)|Sets the space between objects
+|[getSpacing](objects/Flexbox/getSpacing.md)|Returns the space between objects
+|[setFlexDirection](objects/Flexbox/setFlexDirection.md)|Sets the direction in which the children will be placed
+|[setJustifyContent](objects/Flexbox/setJustifyContent.md)|Determines how the children are aligned along the main axis
+
+### Example
+
+Here's an example of how to create a Flexbox object:
+
+```lua
+local main = basalt.createFrame()
+local flexbox = main:addFlexbox()
+  :setFlexDirection("column")
+  :setJustifyContent("space-between")
+  :setSpacing(5)
+```
+
+Alternatively, you can create a flexbox using an XML layout:
+
+```xml
+<flexbox flexDirection="column" justifyContent="space-between" spacing="5">
+```

docs/objects/Flexbox/getSpacing.md

@@ -0,0 +1,19 @@
+## getSpacing
+
+### Description
+
+Returns the space between objects
+
+### Returns
+
+1. `number` Number of pixels of spacing between each object
+
+### Usage
+
+* Creates a default flexbox and prints the default spacing.
+
+```lua
+local main = basalt.createFrame()
+local flexbox = mainFrame:addFlexbox()
+basalt.debug(flexbox:getSpacing())
+```

docs/objects/Flexbox/setFlexDirection.md

@@ -0,0 +1,23 @@
+## setFlexDirection
+
+### Description
+
+Sets the direction in which the children will be placed
+
+### Parameters
+
+1. `string` One of ("row", "column") - default is row
+
+### Returns
+
+1. `object` The object in use
+
+### Usage
+
+* Creates a default flexbox and sets the flex direction to column.
+
+```lua
+local main = basalt.createFrame()
+local flexbox = mainFrame:addFlexbox()
+      :setFlexDirection("column")
+```

docs/objects/Flexbox/setJustifyContent.md

@@ -0,0 +1,23 @@
+## setJustifyContent
+
+### Description
+
+Determines how the children are aligned along the main axis
+
+### Parameters
+
+1. `string` One of ("flex-start", "flex-end", "center", "space-between", "space-around") - default is flex-start. Works the same as the property of the same name in [CSS flexboxes](https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flexbox-properties)
+
+### Returns
+
+1. `object` The object in use
+
+### Usage
+
+* Creates a default flexbox and sets the justify content to space-between.
+
+```lua
+local main = basalt.createFrame()
+local flexbox = mainFrame:addFlexbox()
+      :setJustifyContent("space-between")
+```

docs/objects/Flexbox/setSpacing.md

@@ -0,0 +1,23 @@
+## setSpacing
+
+### Description
+
+Sets the space between objects
+
+### Parameters
+
+1. `number` Number of pixels of spacing between each object - default is 1
+
+### Returns
+
+1. `object` The object in use
+
+### Usage
+
+* Creates a default flexbox and sets the spacing to 5 pixels.
+
+```lua
+local main = basalt.createFrame()
+local flexbox = mainFrame:addFlexbox()
+      :setSpacing(5)
+```