Overview
The Video Player component allows a video to be embedded and displayed on a page. A video can provide supplemental information to a page. Most of the time, the video will be hosted through Youtube or Vimeo.
Aspect Ratio
Video Player can be configured in a variety of ratios, the most commonly supported being 16:9 and 4:3. The video player should adopt the ratio of the embedded video.
Modifiers
Title
With the title added to the video component, a video can include a title beneath to replace the native video title. This title should use Headline/Small/Bold in the appropriate typography viewport.
Description
A video can include a description beneath the video player and title to provide additional context. This description should use Body/Small/Regular.
Transcript Link
An optional link may appear below the video to link to the transcript associated with the video.
Border
A 1px inside border can be added to the video component to help frame images. This is useful when the page background and video background are the same or similar colors. For video border color, use outline-variant.
Border Radius
A 32px border radius can be added to the video component as a visual element.
