{#
/**
 * @file
 * Template for "Kopfzeile" component.
 */
#}
{% set classes = [
  'kern-kopfzeile'
] %}
{% if webcomponent %}
  {% set delivery_method = delivery_method|default('local') %}
  {{ attach_library('kern_ux_canvas/kopfzeile_' ~ delivery_method) }}
  <kern-kopfzeile {{ attributes.addClass(classes) }}{% if breakpoints %} breakpoints="{{ breakpoints }}"{% endif %}{{ fluid ? ' fluid' }}>{{ label }}</kern-kopfzeile>
{% else %}
  <div {{ attributes.addClass(classes) }}>
    <div class="kern-container{{ fluid ? '-fluid' }}">
      <div class="kern-kopfzeile__content">
        <span class="kern-kopfzeile__flagge" aria-hidden="true">
          <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 16">
            <path fill="#000" d="M0 .5h24v5.333H0z" />
            <path fill="red" d="M0 5.833h24v5.333H0z" />
            <path fill="#FACA2C" d="M0 11.167h24V16.5H0z" />
          </svg>
        </span>
        <span class="kern-kopfzeile__label">
          {{ label }}
        </span>
      </div>
    </div>
  </div>
{% endif %}
