www/src/layouts/partials/footer.html

<section class="footer">
  <hr>
  <div class="container">
      <div class="row">
        <div class="col-lg-8 footer-content">
          <h4>Equitable open-source for <span id="cycle">web3</span></h4>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
          <img class="footer-grid" src="/Images/footer-grid-element.svg" alt="tea.grid">
        </div>
        <div class="col-lg-4">
          <div class="card social-box" style="width: 100%; float:right;">
            <ul class="list-group list-group-flush">
              <a class="list-group-item" role="button" href="https://twitter.com"><i class="icon-twitter social-icon"></i>Twitter</a>
              <a class="list-group-item" role="button" href="https://twitter.com"><i class="icon-discord social-icon"></i>Discord</a>
              <a class="list-group-item" role="button" href="https://twitter.com"><i class="icon-github social-icon"></i>GitHub</a>
              <a class="list-group-item" role="button" href="https://twitter.com"><i class="icon-reddit social-icon"></i>Reddit</a>
              <a class="list-group-item" role="button" href="https://twitter.com"><i class="icon-telegram social-icon"></i>Telegram</a>
              <a class="list-group-item" role="button" href="https://twitter.com"><i class="icon-instagram social-icon"></i>Instagram</a>
            </ul>
          </div>
        </div>
      </div>
      <div class="row mb-4">
        <h4>subscribe to our email list</h4>
        <hr>
          <div class="col">
            <div class="input-group">
              <input type="text" class="form-control footer-email" placeholder="you@email.com" aria-label="Recipient's username with two button addons">
              <button class="btn btn-outline-secondary email-btn" type="button">Send</button>
            </div>
          </div>
        <hr>
      </div>
      <div class="row">
        <div class="col-lg-6">
          <p class="small">©2022 tea inc. You can also share our <a href="" class="teal">Linktree</a>.</p>
        </div>
        <div class="col-lg-6">
          {{- partial "footer-nav.html" . -}}
        </div>
      </div>
  </div>
</section>

<script src="https://cdn.jsdelivr.net/npm/swiper/swiper-bundle.min.js"></script>

<!-- JavaScript Bundle with Popper -->

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous">
    </script>

  <script src="https://code.jquery.com/jquery-3.6.0.min.js"
    integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>

  <script>
    $(window).scroll(function () {
      $('nav').toggleClass('scrolled', $(this).scrollTop() > 100);
    });

    if (localStorage['signup'].match(/:::/)) {
      const [username, serial_] = localStorage.signup.split(':::');
      const serial = (+serial_).toLocaleString()
      $('.box-auth-true').show();
      $('.box-auth-false').hide();
      $('#auth-username').html(username);
      $('#count').html(`${serial} / <span id='count3'></span>`);
      $('#count-sub-text').html('YOUR AUTHENTICATION NUMBER');
      $('#communitea').html('Thanks for joining our communi&#39;<span style="color:#54BAAB;">tea</span>');
      $('#revolution-text').html(
        'Now stay tuned! As an early authenticator, you’ll be entitled to a variety of exciting rewards, including minted NFT certificates.'
      );
      $('#auth-body-text').hide();
      $('.rounded-pill').hide();
      $('.auth-btn').html('Configure GitHub App');
      $('.auth-btn').attr('href', 'https://github.com/apps/tea-xyz')
    }
  </script>

<script>
  try {
    fetch('https://app.tea.xyz/api/signups')
      .then(res => res.json())
      .then(res => {
        const signups = res.signups ? res.signups.toLocaleString() : ""
        if (!(localStorage['signup'] || '').match(/:::/)) {
          $('#count').html(signups)
        }
        $('#count1').html(signups)
        $('#count2').html(signups)
        $('#count3').html(signups)
        $('#count4').html(signups)
        $('#count5').html(signups)
        $('#count6').html(signups)
        $('#count7').html(signups)
      })
  } catch (e) {
    console.error(e)
  }
</script>

<script type="text/javascript">
    (function(c,l,a,r,i,t,y){
        c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
        t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
        y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
    })(window, document, "clarity", "script", "c9ohlhyxzf");
</script>

<script async src="https://www.googletagmanager.com/gtag/js?id=G-Q3M5LVH76F"></script>
  <script>
    window.dataLayer = window.dataLayer || [];

    function gtag() {
      dataLayer.push(arguments);
    }
    gtag('js', new Date());

    gtag('config', 'G-Q3M5LVH76F');
  </script>

  <script>
    const textList = [
    "web3",
    "game&#8208;dev",
    "AI",
    "automation",
    "data",
    "ML",
    "web",
    "devops",
    "creating",
    "everything",
    "<i>you<i>"
    ];
    const cycle = document.querySelector(".cycle","#cycle");
    let i = 0;
    const cycleText = () => {
      cycle.innerHTML = textList[i];
      i = ++i % textList.length;
    };
    cycleText();
    setInterval(cycleText, 2400);

  </script>

  <script>
    rdt('track', 'SignUp');
    rdt('track', 'ViewContent');
  </script>

  <script>
    var swiper = new Swiper(".mySwiper", {
      slidesPerView: 1.15,
      spaceBetween: 10,
      freeMode: true,
      loop: true,
      pagination: {
        el: ".swiper-pagination",
        clickable: true,
      },
    });
  </script>