footer.mustache

<footer class="footer footer-clip bg-black text-white __js-root">
  <ui-app inline-template>
    <div>
      <div class="footer__main py-4 lg:py-16 container--wide">
        <section class="footer__brand">
          <img
            src="https://www.va-fighters.com/pirati/krajska-sablona/dist/assets/img/logo.svg"
            alt=""
            class="w-32 md:w-40 pb-6"
          />
        </section>
        <section class="footer__social lg:text-right lg:mb-10">
          <div class="font-alt text-2xl mb-4">
            Zůstaňte s námi v konaktu
          </div>
          <div
            class="flex flex-col space-y-2 lg:flex-row lg:justify-end lg:space-y-0 lg:space-x-4">
            <a href="" class="flex items-center hover:no-underline">
              <i class="ico--facebook mr-1"></i>
              <span class="text-sm">@ceska.piratska.strana</span>
            </a>
            <a href="" class="flex items-center hover:no-underline">
              <i class="ico--twitter mr-1"></i>
              <span class="text-sm">#piratskastrana</span>
            </a>
            <a href="" class="flex items-center hover:no-underline">
              <i class="ico--instagram mr-1"></i>
              <span class="text-sm">@pirati.cz</span>
            </a>
            <a href="" class="flex items-center hover:no-underline">
              <i class="ico--youtube mr-1"></i>
              <span class="text-sm">pirati.cz</span>
            </a>
          </div>
        </section>
        <section class="footer__main-links text-white lg:flex lg:flex-wrap lg:justify-between gap-8">
          <div class="pt-8 pb-4 lg:py-0">
            <ui-footer-collapsible label="Navigace">
              <ul class="text-white py-8">
                <li>
                  <a href="#">Lorem ipsum</a>
                </li>
                <li>
                  <a href="#">Lorem ipsum</a>
                </li>
                <li>
                  <a href="#">Lorem ipsum</a>
                </li>
              </ul>
            </ui-footer-collapsible>
          </div>
          <div class="py-4 lg:py-0">
            <ui-footer-collapsible label="Transparence">
              <ul class="text-white py-8">
                <li>
                  <a href="#">Lorem ipsum</a>
                </li>
                <li>
                  <a href="#">Lorem ipsum</a>
                </li>
                <li>
                  <a href="#">Lorem ipsum</a>
                </li>
              </ul>
            </ui-footer-collapsible>
          </div>
          <div class="py-4 lg:py-0">
            <ui-footer-collapsible label="osobní stránky">
              <ul class="text-white py-8">
                <li>