Video player

To komponent, który reprezentuje treści wideo. Po jego kliknięciu, treść wideo odtwarzana jest w dedykowanym odtwarzaczu.

Nadrtytuł

Nazwa filmu

<div class="video">
  <section class="video__container">
    <span class="play-icon__container">
      <img class="pictogram--m" id="play-icon" src="#" alt="play" />
    </span>
    <iframe
      src="https://www.youtube.com/embed/Fv37jOM5LFg?controls=0"
      width="100%"
      frameborder="0"
      allow="autoplay"
      allowfullscreen="false"
    ></iframe>
  </section>
  <section>
    <h4 class="video__teaser small-label">Nadrtytuł</h4>
    <h3 class="headline-3">Nazwa filmu</h3>
  </section>
</div>

1. Okładka

   Okładka to stopklatka lub zdjęcie. Powinna ona dobrze oddawać treść wideo i zachęcać do jego odtworzenia.

2. Piktogram "odtwórz"

   Symbolizuje możliwość odtworzenia wideo.

3. Kategoria lub data opcjonalne

   To informacja o kategorii stron, do której należy wideo lub o dacie dodania materiału. Kategoria i data nie występują jednocześnie. W przypadku kategorii rekomendowany limit słów to 2.

4. Tytuł opcjonalny

   Rekomendowany limit tekstu to 2 linijki na wszystkich rozdzielczościach

Klikalny jest cały komponent. Kliknięcie w dowolne miejsce komponentu wideo powoduje otwarcie okna, które rozciąga się na całą szerokość ekranu. W oknie rozpoczyna się odtwarzanie wideo w zaimplementowanym odtwarzaczu.