Box Settings, Backgrounds

Companion Dashboard is made up of boxes. Access Box settings by double clicking a box.

Boxes have the following parameters:

Full Box Settings/Options

Position: X, Y position based on the top left corner of the app. Anchor point is adjustable to change where the X, Y position is measured off the box.

Width/Height/Layer: Box size in pixels, and layer is relative to the other boxes. Increase/decrease layer to put boxes in front of or behind other boxes.

Opacity: Set opacity for the entire box, all the way down to 0%. Opacity values can be set based on variable values as well using Variable Opacity.

Click Action: When the canvas is locked, clicking the box will push a button in Companion. Buttons in Companion have locations, based on page/row/column and can be found in the button editor.

—

Background

Default Background has a color picker, or variable/hex/image URL. There's also an option to browse for a local image.

Contain will make sure to fit the entire image in the box. Cover will scale the image to make sure the entire box is filled.

Background Image Opacity will adjust the opacity of any images used.

Variable Background Color allows you to pick a color for when a variable has a certain value.

Overlay

Default Overlay allows you to pick a color, or use a variable/hex/image URL. The overlay will be a color that appears on top of the background.

Variable Overlay Color allows you to pick a color for when a variable has a certain value.

Default/Variable Size defines how much of the background the overlay takes up. Use a number or variable in the default field, or set certain size variables for a given variable value.

Overlay Direction defines from which direction the overlay derives its size from; where the overlay starts.

Border

Default Border Color allows you to pick a color, or use a variable/hex. Variable Border Color allows you to define a border color based on variable values.