@studiometa/ui

Appearance

Twig API ​

Parameters ​

Required parameters

The src or sources parameter is required.

src ​

  • Type: string
  • Required if sources is empty.

Configures the src attribute of the video.

sources ​

  • Type: array<object>
  • Required if src is empty.

Configures multiple sources of the video. Sources must contain at least one object with src key.

width ​

  • Type: number
  • Default: 100

Configures the width attribute of the video and the component sizing.

height ​

  • Type: number
  • Default: 100

Configures the height attribute of the video and the component sizing.

lazy ​

  • Type: boolean
  • Default: true

Configures the type of loading for the video. Defaults to true which requires the FigureVideo JavaScript component to be loaded in your project.

caption ​

  • Type: string

The caption of the video.

fit ​

  • Type: 'cover'|'contain'|'fill'|'none'

Defines how the video fits.

absolute ​

  • Type: boolean

Uses absolute position on the video holder instead of relative.

inline ​

  • Type: boolean

Whether to enable the display of the figure inline or not. When inline, the root element will have a max-width set corresponding to the width given. Use with caution.

placeholder ​

  • Type: string

Defines a custom placeholder instead of the generic placeholder:

twig
{%- set placeholder_markup -%}
  <svg xmlns="http://www.w3.org/2000/svg"
    viewbox="0 0 {{ width }} {{ height }}"
    width="{{ width }}"
    height="{{ height }}">
    <rect x="0" y="0" width="{{ width }}" height="{{ height }}" fill="{{ placeholder_color }}" />
  </svg>
{%- endset -%}
{% set generic_placeholder = 'data:image/svg+xml,%s'|format(placeholder_markup|url_encode) %}

placeholder_color ​

  • Type: string
  • Default: "#eee"

Defines the color of the generic placeholder.

attr ​

  • Type: array

Custom attributes for the root element.

inner_attr ​

  • Type: array

Custom attributes for the inner element.

video_attr ​

  • Type: array

Custom attributes for the video element.

caption_attr ​

  • Type: array

Custom attributes for the caption element.

Blocks ​

caption ​

Customizes the video's caption. Defaults to the caption parameter.

sources ​

Customizes the video's sources. Defaults to the sources parameter.