Skip to main content
Version: 4.x

vime-control-group

A simple container that enables player controls to be organized into groups. Each group starts on a new line.

Visual#

Vime control group component

Usage#

<vime-player>  <!-- ... -->  <vime-ui>    <!-- ... -->    <vime-controls full-width>      <vime-control-group>        <vime-scrubber-control></vime-scrubber-control>      </vime-control-group>
      <vime-control-group space="top">        <vime-playback-control></vime-playback-control>        <vime-volume-control></vime-volume-control>      </vime-control-group>    </vime-controls>  </vime-ui></vime-player>

Properties#

PropertyAttributeDescriptionTypeDefault
spacespaceDetermines where to add spacing/margin. The amount of spacing is determined by the CSS variable --control-group-spacing."both" ∣ "bottom" ∣ "none" ∣ "top"'none'

CSS Custom Properties#

NameDescription
--vm-control-group-spacingThe space between control groups.

Dependencies#

Used by#

Graph#

graph TD;  vime-default-controls --> vime-control-group  style vime-control-group fill:#f9f,stroke:#333,stroke-width:4px

Built with StencilJS