<script defer src="https://unpkg.com/alpinejs-scroll-to@latest/dist/scroll-to.min.js"></script>

<script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>

<div x-data>
  <header x-scroll-to-header class="fixed inset-x-0 top-0 z-50 bg-gray-100 p-4">
    <nav class="flex items-center gap-2">
      <a
        x-on:click.prevent="$scrollTo({ offsetHeader: true })"
        href="#AboutContent"
        class="underline"
      >
        About
      </a>

      <a x-on:click.prevent="$scrollTo