BBH

Merkmale Toggle 

<div class="c-accordion has-border-bottom">
    <div class="c-accordion__heading" ui-toggle="uid-b8c45985060c">
        <h4 class="flex items-center text-neutral-black">
            <span class="w-20">

                <svg class="text-neutral-grey-02">
                    <use xlink:href="#time"></use>
                </svg>
            </span>
            <span class="text-style-big">Merkmale & Besonderheiten</span>
        </h4>
        <span ui-toggle-icon>
            <span aria-hidden>

                <svg class="text-neutral-grey-02">
                    <use xlink:href="#minus"></use>
                </svg>
            </span>
            <span>

                <svg class="text-neutral-grey-02">
                    <use xlink:href="#plus"></use>
                </svg>
            </span>
        </span>
    </div>
    <div class="flex" id="uid-b8c45985060c" ui-toggle-target>
        <span class="w-20 shrink-0"></span>
        <div class="w-full">

            <p>Lorem, ipsum, dolorem, ...</p>

        </div>
    </div>
    <div class="flex" id="uid-b8c45985060c" ui-toggle-target aria-hidden>
        <span class="w-20 shrink-0"></span>
        <div class="w-full">

            <div class="grid grid-cols-1 gap-4">

                <div class="c-icon-tag">
                    <span class="c-icon-tag__icon">

                        <svg class="text-neutral-grey-02">
                            <use xlink:href="#acc-entry"></use>
                        </svg>

                    </span>
                    <p class="c-icon-tag__label ">
                        Barrierefreier Zugang
                    </p>
                </div>

                <div class="c-icon-tag">
                    <span class="c-icon-tag__icon">

                        <svg class="text-neutral-grey-02">
                            <use xlink:href="#foodmenu"></use>
                        </svg>

                    </span>
                    <p class="c-icon-tag__label ">
                        Speisen zum mitnehmen
                    </p>
                </div>
            </div>

        </div>
    </div>
</div>
 
{% set rnd4 = [0,1,2,3] | random %}
{% set uid = getUID() %}

<div class="c-accordion has-border-bottom">
  <div class="c-accordion__heading" ui-toggle="{{ uid }}">
    <h4 class="flex items-center text-neutral-black">
      <span class="w-20">{% render '@svg', { name: 'time' } %}</span>
      <span class="text-style-big">Merkmale & Besonderheiten</span>
    </h4>
    <span ui-toggle-icon>
      <span aria-hidden>{% render '@svg', { name: 'minus' } %}</span>
      <span>{% render '@svg', { name: 'plus' } %}</span>
    </span>
  </div>
  <div class="flex" id="{{ uid }}" ui-toggle-target>
    <span class="w-20 shrink-0"></span>
    <div class="w-full">

      <p>Lorem, ipsum, dolorem, ...</p>

    </div>
  </div>
  <div class="flex" id="{{ uid }}" ui-toggle-target aria-hidden>
    <span class="w-20 shrink-0"></span>
    <div class="w-full">

      <div class="grid grid-cols-1 gap-4">
        {% render '@icon-tag', { icon: 'acc-entry', label: 'Barrierefreier Zugang' } %}
        {% render '@icon-tag', { icon: 'foodmenu', label: 'Speisen zum mitnehmen' } %}
      </div>

    </div>
  </div>
</div>
 
/* No context defined. */

No notes defined.