PaperModX/layouts/partials/footer.html

{{- if not (.Param "hideFooter") }}
<footer class="footer">
    {{- if site.Copyright }}
    <span>{{ site.Copyright | markdownify }}</span>
    {{- else }}
    <span>&copy; {{ now.Year }} <a href="{{ "" | absLangURL }}">{{ site.Title }}</a></span>
    {{- end }}
    <span>
        Powered by
        <a href="https://gohugo.io/" rel="noopener noreferrer" target="_blank">Hugo</a> &
        <a href="https://git.io/hugopapermod" rel="noopener" target="_blank">PaperMod</a>
    </span>
</footer>
{{- end }}

{{- if (not site.Params.disableScrollToTop) }}
<a href="#top" aria-label="go to top" title="Go to Top (Alt + G)" class="top-link" id="top-link" accesskey="g">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 6" fill="currentColor">
        <path d="M12 6H0l6-6z" />
    </svg>
</a>
{{- end }}

{{- partial "extend_footer.html" . }}

<script>
  (function() {
    let menu = document.getElementById('menu')
    if (menu) {
        menu.scrollLeft = localStorage.getItem("menu-scroll-position");
        menu.onscroll = function () {
            localStorage.setItem("menu-scroll-position", menu.scrollLeft);
        }
    }

    const disableSmoothScroll = '{{- if (.Param "DisableSmoothScroll") -}}1{{- end -}}' == '1';
    if (window.matchMedia('(prefers-reduced-motion: reduce)').matches || disableSmoothScroll) {
      return;
    }
    // only run this code if smooth scroll should be enabled
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener("click", function (e) {
            e.preventDefault();
            var id = this.getAttribute("href").substr(1);
            document.querySelector(`[id='${decodeURIComponent(id)}']`).scrollIntoView({
                behavior: "smooth"
            });
            if (id === "top") {
                history.replaceState(null, null, " ");
            } else {
                history.pushState(null, null, `#${id}`);
            }
        });
    });
  })();
</script>

{{- if (not site.Params.disableScrollToTop) }}
<script>
    var mybutton = document.getElementById("top-link");
    window.onscroll = function () {
        if (document.body.scrollTop > 800 || document.documentElement.scrollTop > 800) {
            mybutton.style.visibility = "visible";
            mybutton.style.opacity = "1";
        } else {
            mybutton.style.visibility = "hidden";
            mybutton.style.opacity = "0";
        }
    };

</script>
{{- end }}

{{- if (not site.Params.disableThemeToggle) }}
<script>
    document.getElementById("theme-toggle").addEventListener("click", () => {
        if (document.body.className.includes("dark")) {
            document.body.classList.remove('dark');
            localStorage.setItem("pref-theme", 'light');
        } else {
            document.body.classList.add('dark');
            localStorage.setItem("pref-theme", 'dark');
        }
    })

</script>
{{- end }}

{{- if (and (eq .Kind "page") (ne .Layout "archives") (ne .Layout "search") (.Param "ShowCodeCopyButtons")) }}
<script>
    document.querySelectorAll('pre > code').forEach((codeblock) => {
        const container = codeblock.parentNode.parentNode;

        const copybutton = document.createElement('button');
        copybutton.classList.add('copy-code');
        copybutton.innerText = '{{- i18n "code_copy" | default "copy" }}';

        function copyingDone() {
            copybutton.innerText = '{{- i18n "code_copied" | default "copied!" }}';
            setTimeout(() => {
                copybutton.innerText = '{{- i18n "code_copy" | default "copy" }}';
            }, 2000);
        }

        copybutton.addEventListener('click', (cb) => {
            if ('clipboard' in navigator) {
                navigator.clipboard.writeText(codeblock.textContent);
                copyingDone();
                return;
            }

            const range = document.createRange();
            range.selectNodeContents(codeblock);
            const selection = window.getSelection();
            selection.removeAllRanges();
            selection.addRange(range);
            try {
                document.execCommand('copy');
                copyingDone();
            } catch (e) { };
            selection.removeRange(range);
        });

        if (container.classList.contains("highlight")) {
            container.appendChild(copybutton);
        } else if (container.parentNode.firstChild == container) {
            // td containing LineNos
        } else if (codeblock.parentNode.parentNode.parentNode.parentNode.parentNode.nodeName == "TABLE") {
            // table containing LineNos and code
            codeblock.parentNode.parentNode.parentNode.parentNode.parentNode.appendChild(copybutton);
        } else {
            // code blocks not having highlight as parent class
            codeblock.parentNode.appendChild(copybutton);
        }
    });
</script>
{{- end }}

{{- if (and (eq .Kind "page") (.Param "ShowToc") (.Param "TocSide")) }}
<script>
window.addEventListener('DOMContentLoaded', function (event) {
  const headings = document.querySelectorAll('h1[id],h2[id],h3[id],h4[id],h5[id]');
  const activeClass = 'active';

  // Make the first header active
  let activeHeading = headings[0];
  getLinkByHeading(activeHeading).classList.add(activeClass);

  const onScroll = () => {
    const passedHeadings = [];
    for (const h of headings) {
      // 5 px as a buffer
      if (getOffsetTop(h) < 5) {
        passedHeadings.push(h)
      } else {
        break;
      }
    }
    if (passedHeadings.length > 0) {
      newActiveHeading = passedHeadings[passedHeadings.length - 1];
    } else {
      newActiveHeading = headings[0];
    }
    if (activeHeading != newActiveHeading) {
      getLinkByHeading(activeHeading).classList.remove(activeClass);
      activeHeading = newActiveHeading;
      getLinkByHeading(activeHeading).classList.add(activeClass);
    }
  }

  let timer = null;
  window.addEventListener('scroll', () => {
    if (timer !== null) {
      clearTimeout(timer)
    }
    timer = setTimeout(onScroll, 50)
  }, false);

  function getLinkByHeading(heading) {
    const id = encodeURI(heading.getAttribute('id')).toLowerCase();
    return document.querySelector(`.toc ul li a[href="#${id}"]`);
  }

  function getOffsetTop(heading) {
    if (!heading.getClientRects().length) {
      return 0;
    }
    let rect = heading.getBoundingClientRect();
    return rect.top
  }
}, false);
</script>
{{- end }}