BBH

Oeffnungszeiten Toggle 

<div class="c-accordion has-border-bottom">
    <div class="c-accordion__heading" ui-toggle="uid-18d698aa6625">
        <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">Öffnungszeiten</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-18d698aa6625" ui-toggle-target>
        <span class="w-20 shrink-0"></span>
        <div class="w-full">

            <div class="c-time-table">

                <span>Di.</span>
                <span>10:00 – 20:00 Uhr</span>
                <span></span>
                <span class="c-time-table__info"></span>

            </div>

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

            <div class="c-time-table">

                <span>Mo.</span>
                <span>10:00 – 20:00 Uhr</span>
                <span></span>
                <span class="c-time-table__info">Lorem ipsum dolor sit amet</span>

                <span><strong>Di.</strong></span>
                <span><strong>10:00 – 20:00 Uhr</strong></span>
                <span></span>
                <span class="c-time-table__info">Lorem ipsum dolor sit amet</span>

                <span>Mi.</span>
                <span>10:00 – 20:00 Uhr</span>
                <span></span>
                <span class="c-time-table__info">Lorem ipsum dolor sit amet</span>

                <span>Do.</span>
                <span>10:00 – 20:00 Uhr</span>
                <span></span>
                <span class="c-time-table__info">Lorem ipsum dolor sit amet</span>

                <span>Fr.</span>
                <span>10:00 – 20:00 Uhr</span>
                <span></span>
                <span class="c-time-table__info">Lorem ipsum dolor sit amet</span>

            </div>

            <hr class="mb-6">

            <div class="c-copy">
                <p>Lorem ipsum dolor sit amet elitrsed Diam nonumy eirmod.</p>
            </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">Öffnungszeiten</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">

      {% render '@time-table', {
        days: [{ label: 'Di.', time: '10:00 – 20:00 Uhr' }]
      } %}

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

      {% render '@time-table' %}

      <hr class="mb-6">

      <div class="c-copy">
        <p>Lorem ipsum dolor sit amet elitrsed Diam nonumy eirmod.</p>
      </div>
    </div>
  </div>
</div>
 
/* No context defined. */

No notes defined.