Skip to main content

Global styles

Component styles

Video backgrounds

Description

This page illustrates the use of background-videos in various components.

Requirments

  • Have play/pause button to stop autoplay

Components that have video backgorunds as an option

  • Banner
  • Hero search bar
  • Hero text box
  • Hero multi boxes
  • Hero article - displaced (Only when backgorund color is not chosen)

Video integrations

  • Umbrcao media library
  • Azure media player
  • Dreambroker

Banner - Video

Hero search bar - Video

Hero search bar - small - Video

Hero text box - Video

Tema

Bystrategi 2021

Kommuneplanen er den bærende og helt afgørende plan, hvor borgere og virksomheder kan orientere sig om mål og regler for arealanvendelsen.This is a link.

Hero multi boxes - Video

Hero article - displaced: background-video

Nyheder
Pressemeddelelse

Hero article - displaced: background-video

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean rhoncus urna vel tortor fringilla, consequat tristique ex eleifend.

19. okt. 2019
Sidst opdateret: 28. okt. 2020

Media box: background-video

Tag

Media box equal heights

Morbi tincidunt augue interdum velit euismod in pellentesque. Adipiscing tristique risus nec feugiat in fermentum. Orci nulla pellentesque dignissim enim sit amet venenatis. Luctus accumsan tortor posuere ac ut consequat. Sed vulputate mi sit amet mauris commodo.This is a link.

Media box: Azure background-video

Tag

Azure background-video

Morbi tincidunt augue interdum velit euismod in pellentesque. Adipiscing tristique risus nec feugiat in fermentum. Orci nulla pellentesque dignissim enim sit amet venenatis. Luctus accumsan tortor posuere ac ut consequat. Sed vulputate mi sit amet mauris commodo.This is a link.

Media box: Dreambroker background-video

Tag

Dreambroker background-video

Morbi tincidunt augue interdum velit euismod in pellentesque. Adipiscing tristique risus nec feugiat in fermentum. Orci nulla pellentesque dignissim enim sit amet venenatis. Luctus accumsan tortor posuere ac ut consequat. Sed vulputate mi sit amet mauris commodo.This is a link.