Jumbotron: Image

Component preview opent in nieuw tabblad

Plaatst een lichtgewicht, flexibel component dat optioneel de gehele breedte van de viewport kan bevatten om belangrijke content van je site te tonen. Gebaseerd op Bootstrap Jumbotron.

<div class="dso-jumbotron">
    <h2 class="dso-jumbotron-title">Aan de slag met de Omgevingswet</h2>
    <div class="dso-jumbotron-body">
        <p>Data en services van het digitaal stelsel Omgevingswet zijn in ontwikkeling en worden gedurende het project via het Ontwikkelaarsportaal ter beschikking gesteld voor derden. De datasets op dit platform zijn benaderbaar vie RESTfull APIs. In onze API store zijn de volgende services in beta versie beschikbaar.</p>
    </div>
    <div class="dso-jumbotron-image">
        <img src="../../dummy/images/sneeuwpop.png" alt="Afbeelding van een sneeuwpop">
    </div>
</div>
<div class="dso-jumbotron">
  <h2 class="dso-jumbotron-title">{{ title }}</h2>
  <div class="dso-jumbotron-body">
    <p>{{ content }}</p>
    {%- if button %}
      <div class="dso-jumbotron-cta">
        {% render '@button', button -%}
      </div>
    {% endif -%}
  </div>
  {%- if image %}
    <div class="dso-jumbotron-image">
      {% render '@image', image %}
    </div>
  {% endif -%}
</div>
__title: Jumbotron met Image
title: Aan de slag met de Omgevingswet
content: >-
  Data en services van het digitaal stelsel Omgevingswet zijn in ontwikkeling en
  worden gedurende het project via het Ontwikkelaarsportaal ter beschikking
  gesteld voor derden. De datasets op dit platform zijn benaderbaar vie RESTfull
  APIs. In onze API store zijn de volgende services in beta versie beschikbaar.
image:
  source: /dummy/images/sneeuwpop.png
  alt: Afbeelding van een sneeuwpop