Box Header, Left, and Right Fields

Boxes contain a header, a left field and a right field.

Visible Checkbox

All of them contain a Visible checkbox in their settings view, to completely remove them from that box. Unchecking the Visible checkbox on the header will mean the left and right fields are centered vertically in the box. Unchecking it in either the left or right fields will set the other to the full width.

Text Field

Header, left, and right all have a text field. These text fields support markdown and HTML tags, and of course Companion variables. These fields automatically concatenate, so you can combine plain text with Companion variables.

Header, left, and right all have font size and alignment options.

Markdown/HTML Options

Include but are not limited to…

- Bold
    - <b>Text</b>
    - **Text**
    - __Text__
- Italics
    - <i>Text</i>
    - *Text*
    - _Text_
- New Line
    - \n
    - <br>
- Image
    - !(Sample Image)[https://website.com/image.png]
    - <img src="https://website.com/image.png" width="100px" height="100px" />
- Links
    - (Link Text)[https://website.com]
- Video / iFrame
    - <iframe src="https://website.com" width="100px" height="100px" />
- Text
      - <span style="font-size: 12px">Use spans and other HTML text tags to style text</span>

Width

Left and right fields have a Width option. That is how much of the width of the box does the left/right text fields take up. They are tied together, so if left is a 30% then right will be at 70% for example.

Color

Header has both background and text color options, while left and right fields just have text color options. These all have a default, as well as variable options to set a color based on a variable value.