Components/Asset-Layers.md

+Asset layers are the pieces that come together to make a single [[Assets]] "piece" of a HUD.
+Layers each have a single role/feature, and are configured in the order they will visually appear from top to bottom.  For example, A `shadow` layer would probably be at the bottom of your asset layers, since it should be behind everything.  An `icon` would likely be on top, so nothing blocks the static texture.
+## Arrangement
+### Alignment
+Asset layers move in the direction of their alignment, from their start position:
+
+| **align:** | `left` | `center` | `right` |
+| ---------- | ------ | -------- | ------- |
+### Outlined
+This will give a shadow-backdrop outline to the asset layer.
+```yaml
+outlined: true
+```
+### Offset
+The core positioning of the asset layer - this moves the asset based on the origin point for the whole Asset (where it is placed in [HUD Layouts](Layouts) ).  This is how to position various layers around within an asset, to make a single object ready to arrange within a HUD.
+```yaml
+  offset:
+    x: -5  # pixels left/right
+    y: 2   # pixels up/down
+```
+### Color
+Some layers can be colored, such as tinting a texture or a font color.  Supports named colors from minimessage and hex color codes.
+```yaml
+  color: white
+  color: "#ffbb00"
+```
+## Contents
+### Text Layer
+Text layers can be static or contain placeholders, either from the layer's listener or PlaceholderAPI.
+
+| **Listener Placeholder** | **Description**                        |
+| ------------------------ | -------------------------------------- |
+| `%{layer-key}-value%`    | The `value` of the listener.           |
+| `%{layer-key}-max%`      | The `max` of the listener.             |
+| `%{layer-key}-percent%`  | The percentage output of the listener. |
+
+The `{layer-key}` to be used here is the name of the asset layer whose listener you are displaying, usually the name of the functional text layer to display the value(s) of the bar the asset is for.
+### Static Texture Layer
+This layer type is for rendering a single, positioned texture.  These are often used for the background of a bar to fill behind it as the front, functional layer empties, or a static icon.
+#### Example
+```yaml
+outline:
+  texture:   # looking within the `/MythicHUD/textures/` folder
+    path: assetsvanilla/exp_bar_short_outline.png  
+  align: right
+  outlined: false
+  color: white
+  offset:
+    x: 0
+    y: 0
+```
+### Functional Texture Layer
+This is a layer for a segmented texture to be linked to one of the configured [Listeners](Listeners), to create a bar which will fill/empty based on the listener's returned percentage.
+
+Uses other layer configurations, and has a `function` section to configure how the bar represents the `listener`:
+#### Listener
+Listeners determine the percentage fill a bar texture renders.
+```
+function:
+    listener: health
+```
+#### Increment
+The increment is the amount of sections your layer should split into.
+```
+function:
+    increment: 13
+```
+##### Orientation
+The way the layer should deplete from. Can either be Horizontal or Vertical.
+```
+function:
+    orientation: horizontal
+```
+##### Reversed
+Whether or not the layer should deplete the other way. This option defaults to false.
+```
+function:
+    reversed: true
+```
+#### Example
+```
+fill:
+  texture:   # looking within the `/MythicHUD/textures/` folder
+    path: assets/vanilla/exp_bar_short_fill.png
+  align: right
+  outlined: false
+  color: "#f23a3a"
+  offset:
+    x: 0
+    y: 0
+  function:
+    listener: health
+    increment: 13
+    orientation: horizontal
+    reversed: false
+```
\ No newline at end of file