Conclusion

Component preview

<!-- Success -->
<ul class="dso-conclusion">
    <li class="dso-success">
        <strong>Geen vergunning of melding nodig</strong> voor bouwactiviteit
        <ul>
            <li><strong>Let op:</strong> Soms is er wel een omgevingsvergunning omgevingsplanactiviteit bouwen nodig.</li>
            <li><strong>Let op:</strong> Misschien mag u nog niet gelijk gaan bouwen!</li>
        </ul>

    </li>
</ul>

<dso-alert status="success">
    Succes melding
</dso-alert>

<!-- Warning -->
<ul class="dso-conclusion">
    <li class="dso-warning">
        <strong>Neem contact op</strong> met uw gemeente voor omgevingsplanactiviteit op- en uitritten
    </li>
    <li class="dso-danger">
        <strong>Informatie geven</strong> voor milieubelastende activiteit
    </li>
</ul>

<dso-alert status="warning">
    Waarschuwing
</dso-alert>

<!-- Forbidden -->
<ul class="dso-conclusion">
    <li class="dso-forbidden">
        <strong>Verboden</strong> voor omgevingsplanactiviteit lichthinder
        <button type="button" class="btn dso-info-button dso-open" aria-expanded="true">
            <span class="sr-only">Toelichting bij optie</span>
        </button>

        <div class="dso-info">

            <button type="button">
                <span class="sr-only">Sluiten</span>
            </button>

            <div class="dso-rich-content">
                <p>De regels zijn erg ingewikkeld. Vraag uw gemeente Den Haag (070-1214070) of u een omgevingsvergunning moet aanvragen of een melding moet doen.</p>
            </div>
        </div>

    </li>
</ul>

<ul class="dso-conclusion">
  {%- for item in items -%}
    <li {{ className('dso-' + item.modifier) }}>
      {{ item.label | safe }}
      {%- if item.info %}
        {% render '@info-button', item.info, true %}
      {% endif %}

      {%- if item.subItems %}
        <ul>
          {%- for subItem in item.subItems -%}
            <li>{{ subItem | safe }}</li>
          {% endfor -%}
        </ul>
      {% endif %}

      {%- if item.info %}
        {% render '@info', item.info, true %}
      {% endif %}
    </li>
  {% endfor -%}
</ul>
{% if alert %}
  <dso-alert status="{{ alert.status }}">
    {{ alert.message }}
  </dso-alert>
{% endif %}

/* Success */
__title: succes
items:
  - modifier: success
    label: <strong>Geen vergunning of melding nodig</strong> voor bouwactiviteit
    subItems:
      - >-
        <strong>Let op:</strong> Soms is er wel een omgevingsvergunning
        omgevingsplanactiviteit bouwen nodig.
      - '<strong>Let op:</strong> Misschien mag u nog niet gelijk gaan bouwen!'
alert:
  status: success
  message: Succes melding

/* Warning */
__title: warning
items:
  - modifier: warning
    label: >-
      <strong>Neem contact op</strong> met uw gemeente voor
      omgevingsplanactiviteit op- en uitritten
  - modifier: danger
    label: <strong>Informatie geven</strong> voor milieubelastende activiteit
alert:
  status: warning
  message: Waarschuwing

/* Forbidden */
__title: forbidden
items:
  - modifier: forbidden
    label: <strong>Verboden</strong> voor omgevingsplanactiviteit lichthinder
    info:
      infoOpen: true
      infoText: >-
        <p>De regels zijn erg ingewikkeld. Vraag uw gemeente Den Haag
        (070-1214070) of u een omgevingsvergunning moet aanvragen of een melding
        moet doen.</p>