release: v3.4.0

### Explanation

_No response_

### Issue

_No response_

### Attestations

- [ ] I have read and agree to the [Code of Conduct](https://docs.nhcarrigan.com/community/coc/)
- [ ] I have read and agree to the [Community Guidelines](https://docs.nhcarrigan.com/community/guide/).
- [ ] My contribution complies with the [Contributor Covenant](https://docs.nhcarrigan.com/dev/covenant/).

### Dependencies

- [ ] I have pinned the dependencies to a specific patch version.

### Style

- [ ] I have run the linter and resolved any errors.
- [ ] My pull request uses an appropriate title, matching the conventional commit standards.
- [ ] My scope of feat/fix/chore/etc. correctly matches the nature of changes in my pull request.

### Tests

- [ ] My contribution adds new code, and I have added tests to cover it.
- [ ] My contribution modifies existing code, and I have updated the tests to reflect these changes.
- [ ] All new and existing tests pass locally with my changes.
- [ ] Code coverage remains at or above the configured threshold.

### Documentation

_No response_

### Versioning

_No response_

Reviewed-on: #6
Co-authored-by: Naomi Carrigan <commits@nhcarrigan.com>
Co-committed-by: Naomi Carrigan <commits@nhcarrigan.com>

.gitea/workflows/sonar.yml

@@ -1,34 +0,0 @@
-name: Code Analysis
-on:
-  push:
-    branches:
-      - main
-
-jobs:
-  sonar:
-    name: SonarQube
-
-    steps:
-      - name: Checkout Source Files
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: SonarCube Scan
-        uses: SonarSource/sonarqube-scan-action@v4
-        timeout-minutes: 10
-        env:
-          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
-          SONAR_HOST_URL: "https://quality.nhcarrigan.com"
-        with:
-          args: >
-            -Dsonar.sources=.
-            -Dsonar.projectKey=website-headers
-
-      - name: SonarQube Quality Gate check
-        uses: sonarsource/sonarqube-quality-gate-action@v1
-        with:
-          pollingTimeoutSec: 600
-        env:
-          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
-          SONAR_HOST_URL: "https://quality.nhcarrigan.com"

.vscode/settings.json

@@ -8,5 +8,10 @@
   "sonarlint.connectedMode.project": {
     "connectionId": "nhcarrigan",
     "projectKey": "nhcarrigan_website-headers"
-  }
+  },
+  "cSpell.words": [
+    "Adsense",
+    "nhcarrigan",
+    "noreferrer"
+  ]
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "website-headers",
-  "version": "2.0.0",
+  "version": "3.4.0",
   "description": "",
   "main": "index.js",
   "type": "module",

src/index.ts

@@ -5,13 +5,13 @@
  */
 
 // #region Version
-const version = "{{ version }}";
+const nhcarriganHeadersVersion = "{{ version }}";
 console.log(`
 ========================================
-Loading NHCarrigan library v${version}.
+Loading NHCarrigan library v${nhcarriganHeadersVersion}.
 Copyright (c) ${new Date().getFullYear().
   toString()} NHCarrigan
-Changelog: https://codeberg.org/nhcarrigan/website-headers/releases
+Changelog: https://git.nhcarrigan.com/nhcarrigan/website-headers/releases
 Licensed under our public license: https://docs.nhcarrigan.com/legal/license
 Questions? Contact us at https://docs.nhcarrigan.com/about/contact
 ========================================
@@ -19,12 +19,18 @@ Questions? Contact us at https://docs.nhcarrigan.com/about/contact
 // #endregion
 
 // #region Query Selectors
-const head = document.querySelector("head");
-const body = document.querySelector("body");
-const title = document.querySelector("title");
-const description = document.querySelector(`meta[name="description"]`);
+const nhcarriganHeadersHead = document.querySelector("head");
+const nhcarriganHeadersBody = document.querySelector("body");
+const nhcarriganHeadersTitle = document.querySelector("title");
+const nhcarriganHeadersDescription = document.querySelector(
+  `meta[name="description"]`,
+);
 
-const { href: url, hostname, pathname } = window.location;
+const {
+  href: nhcarriganHeadersUrl,
+  hostname: nhcarriganHeadersHostname,
+  pathname: nhcarriganHeadersPathname,
+} = window.location;
 
 // #endregion
 
@@ -34,86 +40,155 @@ const { href: url, hostname, pathname } = window.location;
  * The title and description are set by each website. This should
  * only load things like open graph data and favicons.
  */
-const openGraphTitle = document.createElement("meta");
-openGraphTitle.setAttribute("property", "og:title");
-openGraphTitle.setAttribute("content", title?.innerText ?? "NHCarrigan");
-const openGraphDescription = document.createElement("meta");
-openGraphDescription.setAttribute("property", "og:description");
-openGraphDescription.setAttribute(
+const nhcarriganHeadersCharacterSet = document.createElement("meta");
+nhcarriganHeadersCharacterSet.setAttribute("charset", "UTF-8");
+const nhcarriganHeadersViewport = document.createElement("meta");
+nhcarriganHeadersViewport.setAttribute("name", "viewport");
+nhcarriganHeadersViewport.setAttribute(
   "content",
-  description?.getAttribute("content")
-  // eslint-disable-next-line stylistic/max-len -- big boi string
+  "width=device-width, initial-scale=1.0",
+);
+const nhcarriganHeadersThemeColor = document.createElement("meta");
+nhcarriganHeadersThemeColor.setAttribute("name", "theme-color");
+nhcarriganHeadersThemeColor.setAttribute("content", "#E1F6F9");
+const nhcarriganHeadersReferrer = document.createElement("meta");
+nhcarriganHeadersReferrer.setAttribute("name", "referrer");
+nhcarriganHeadersReferrer.setAttribute(
+  "content",
+  "strict-origin-when-cross-origin",
+);
+const nhcarriganHeadersOpenGraphTitle = document.createElement("meta");
+nhcarriganHeadersOpenGraphTitle.setAttribute("property", "og:title");
+nhcarriganHeadersOpenGraphTitle.setAttribute(
+  "content",
+  nhcarriganHeadersTitle?.innerText ?? "NHCarrigan",
+);
+const nhcarriganHeadersOpenGraphDescription = document.createElement("meta");
+nhcarriganHeadersOpenGraphDescription.setAttribute(
+  "property",
+  "og:description",
+);
+nhcarriganHeadersOpenGraphDescription.setAttribute(
+  "content",
+  nhcarriganHeadersDescription?.getAttribute("content")
   ?? "We are a software engineering and community management consulting firm.",
 );
-const openGraphImage = document.createElement("meta");
-openGraphImage.setAttribute("property", "og:image");
-openGraphImage.setAttribute(
+const nhcarriganHeadersOpenGraphImage = document.createElement("meta");
+nhcarriganHeadersOpenGraphImage.setAttribute("property", "og:image");
+nhcarriganHeadersOpenGraphImage.setAttribute(
   "content",
   "https://cdn.nhcarrigan.com/og-image.png",
 );
-const openGraphUrl = document.createElement("meta");
-openGraphUrl.setAttribute("property", "og:url");
-openGraphUrl.setAttribute("content", url);
-const openGraphType = document.createElement("meta");
-openGraphType.setAttribute("property", "og:type");
-openGraphType.setAttribute("content", "website");
+const nhcarriganHeadersOpenGraphUrl = document.createElement("meta");
+nhcarriganHeadersOpenGraphUrl.setAttribute("property", "og:url");
+nhcarriganHeadersOpenGraphUrl.setAttribute("content", nhcarriganHeadersUrl);
+const nhcarriganHeadersOpenGraphType = document.createElement("meta");
+nhcarriganHeadersOpenGraphType.setAttribute("property", "og:type");
+nhcarriganHeadersOpenGraphType.setAttribute("content", "website");
+const nhcarriganHeadersOpenGraphSiteName = document.createElement("meta");
+nhcarriganHeadersOpenGraphSiteName.setAttribute("property", "og:site_name");
+nhcarriganHeadersOpenGraphSiteName.setAttribute("content", "NHCarrigan");
+const nhcarriganHeadersOpenGraphLocale = document.createElement("meta");
+nhcarriganHeadersOpenGraphLocale.setAttribute("property", "og:locale");
+nhcarriganHeadersOpenGraphLocale.setAttribute("content", "en_US");
+const nhcarriganHeadersOpenGraphImageAlt = document.createElement("meta");
+nhcarriganHeadersOpenGraphImageAlt.setAttribute("property", "og:image:alt");
+nhcarriganHeadersOpenGraphImageAlt.
+  setAttribute("content", "NHCarrigan logo and branding");
+const nhcarriganHeadersOpenGraphImageWidth = document.createElement("meta");
+nhcarriganHeadersOpenGraphImageWidth.setAttribute("property", "og:image:width");
+nhcarriganHeadersOpenGraphImageWidth.setAttribute("content", "1920");
+const nhcarriganHeadersOpenGraphImageHeight = document.createElement("meta");
+nhcarriganHeadersOpenGraphImageHeight.
+  setAttribute("property", "og:image:height");
+nhcarriganHeadersOpenGraphImageHeight.setAttribute("content", "1080");
 
-const twitterCard = document.createElement("meta");
-twitterCard.setAttribute("name", "twitter:card");
-twitterCard.setAttribute("content", "summary_large_image");
-const twitterDomain = document.createElement("meta");
-twitterDomain.setAttribute("name", "twitter:domain");
-twitterDomain.setAttribute("content", hostname);
-const twitterUrl = document.createElement("meta");
-twitterUrl.setAttribute("name", "twitter:url");
-twitterUrl.setAttribute("content", url);
-const twitterTitle = document.createElement("meta");
-twitterTitle.setAttribute("name", "twitter:title");
-twitterTitle.setAttribute("content", title?.innerText ?? "NHCarrigan");
-const twitterDescription = document.createElement("meta");
-twitterDescription.setAttribute("name", "twitter:description");
-twitterDescription.setAttribute(
+const nhcarriganHeadersTwitterCard = document.createElement("meta");
+nhcarriganHeadersTwitterCard.setAttribute("name", "twitter:card");
+nhcarriganHeadersTwitterCard.setAttribute("content", "summary_large_image");
+const nhcarriganHeadersTwitterDomain = document.createElement("meta");
+nhcarriganHeadersTwitterDomain.setAttribute("name", "twitter:domain");
+nhcarriganHeadersTwitterDomain.setAttribute(
   "content",
-  description?.getAttribute("content")
-  // eslint-disable-next-line stylistic/max-len -- big boi string
+  nhcarriganHeadersHostname,
+);
+const nhcarriganHeadersTwitterUrl = document.createElement("meta");
+nhcarriganHeadersTwitterUrl.setAttribute("name", "twitter:url");
+nhcarriganHeadersTwitterUrl.setAttribute("content", nhcarriganHeadersUrl);
+const nhcarriganHeadersTwitterTitle = document.createElement("meta");
+nhcarriganHeadersTwitterTitle.setAttribute("name", "twitter:title");
+nhcarriganHeadersTwitterTitle.setAttribute(
+  "content",
+  nhcarriganHeadersTitle?.innerText ?? "NHCarrigan",
+);
+const nhcarriganHeadersTwitterDescription = document.createElement("meta");
+nhcarriganHeadersTwitterDescription.setAttribute("name", "twitter:description");
+nhcarriganHeadersTwitterDescription.setAttribute(
+  "content",
+  nhcarriganHeadersDescription?.getAttribute("content")
   ?? "We are a software engineering and community management consulting firm.",
 );
-const twitterImage = document.createElement("meta");
-twitterImage.setAttribute("name", "twitter:image");
-twitterImage.setAttribute("content", "https://cdn.nhcarrigan.com/og-image.png");
+const nhcarriganHeadersTwitterImage = document.createElement("meta");
+nhcarriganHeadersTwitterImage.setAttribute("name", "twitter:image");
+nhcarriganHeadersTwitterImage.setAttribute(
+  "content",
+  "https://cdn.nhcarrigan.com/og-image.png",
+);
+const nhcarriganHeadersTwitterSite = document.createElement("meta");
+nhcarriganHeadersTwitterSite.setAttribute("name", "twitter:site");
+nhcarriganHeadersTwitterSite.setAttribute("content", "@nhcarrigan1");
+const nhcarriganHeadersTwitterCreator = document.createElement("meta");
+nhcarriganHeadersTwitterCreator.setAttribute("name", "twitter:creator");
+nhcarriganHeadersTwitterCreator.setAttribute("content", "@nhcarrigan1");
+
+const nhcarriganHeadersFormatDetection = document.createElement("meta");
+nhcarriganHeadersFormatDetection.setAttribute("name", "format-detection");
+nhcarriganHeadersFormatDetection.setAttribute("content", "telephone=no");
+const nhcarriganHeadersRobots = document.createElement("meta");
+nhcarriganHeadersRobots.setAttribute("name", "robots");
+nhcarriganHeadersRobots.setAttribute("content", "index, follow");
+const nhcarriganHeadersAuthor = document.createElement("meta");
+nhcarriganHeadersAuthor.setAttribute("name", "author");
+nhcarriganHeadersAuthor.setAttribute("content", "Naomi Carrigan");
 
 // #endregion
 
 // #region Favicon
 
-const favicon = document.createElement("link");
-favicon.rel = "icon";
-favicon.type = "image/x-icon";
-favicon.href = "https://cdn.nhcarrigan.com/favicon/favicon.ico";
-const appleTouchIcon = document.createElement("link");
-appleTouchIcon.rel = "apple-touch-icon";
-appleTouchIcon.href = "https://cdn.nhcarrigan.com/favicon/apple-touch-icon.png";
-const smallIcon = document.createElement("link");
-smallIcon.rel = "icon";
-smallIcon.href = "https://cdn.nhcarrigan.com/favicon/favicon-16x16.png";
-const largeIcon = document.createElement("link");
-largeIcon.rel = "icon";
-largeIcon.href = "https://cdn.nhcarrigan.com/favicon/favicon-32x32.png";
+const nhcarriganHeadersFavicon = document.createElement("link");
+nhcarriganHeadersFavicon.rel = "icon";
+nhcarriganHeadersFavicon.type = "image/x-icon";
+nhcarriganHeadersFavicon.href
+  = "https://cdn.nhcarrigan.com/favicon/favicon.ico";
+const nhcarriganHeadersAppleTouchIcon = document.createElement("link");
+nhcarriganHeadersAppleTouchIcon.rel = "apple-touch-icon";
+nhcarriganHeadersAppleTouchIcon.href
+  = "https://cdn.nhcarrigan.com/favicon/apple-touch-icon.png";
+const nhcarriganHeadersSmallIcon = document.createElement("link");
+nhcarriganHeadersSmallIcon.rel = "icon";
+nhcarriganHeadersSmallIcon.href
+  = "https://cdn.nhcarrigan.com/favicon/favicon-16x16.png";
+const nhcarriganHeadersLargeIcon = document.createElement("link");
+nhcarriganHeadersLargeIcon.rel = "icon";
+nhcarriganHeadersLargeIcon.href
+  = "https://cdn.nhcarrigan.com/favicon/favicon-32x32.png";
 
 // #endregion
 
 // #region Styles
 
-const styles = document.createElement("style");
-styles.innerHTML = `
+const nhcarriganHeadersStyles = document.createElement("style");
+nhcarriganHeadersStyles.id = "nhcarrigan-global-styles";
+nhcarriganHeadersStyles.innerHTML = `
 @font-face {
-  font-family: 'OpenDyslexic';
-  src: url('https://cdn.nhcarrigan.com/fonts/OpenDyslexicMono-Regular.otf') format('opentype');
+  font-family: 'Vampyr';
+  src: url('https://cdn.nhcarrigan.com/fonts/vampyr.ttf') format('truetype');
 }
 
 :root {
-  --foreground: #2a0a18;
-  --background: #ffb6c1bb;
+  --foreground: #8F2447;
+  --background: #E1F6F9DC;
+  font-size: 12pt;
 }
 
 * {
@@ -123,7 +198,7 @@ styles.innerHTML = `
 }
 
 html {
-  font-family: 'OpenDyslexic', monospace;
+  font-family: 'Vampyr', monospace;
   cursor: url('https://cdn.nhcarrigan.com/cursors/cursor.cur'), auto;
   min-height: 100vh;
   min-width: 100vw;
@@ -176,11 +251,16 @@ footer {
   align-items: center;
   justify-content: space-around;
 }
-#audio-theme-button, #theme-select-button {
+#show-socials-button, #theme-select-button {
   background: none;
   border: none;
   cursor: url('https://cdn.nhcarrigan.com/cursors/pointer.cur'), pointer;
   color: var(--foreground);
+  font-size: 1rem;
+  font-family: 'Vampyr', monospace;
+}
+#show-socials-button > i, #theme-select-button > i {
+  font-size: 1.5rem;
 }
 a {
   color: unset;
@@ -190,9 +270,40 @@ a {
   display: flex;
   align-items: center;
 }
+#social-list {
+  position: absolute;
+  bottom: 75px;
+  left: 0;
+  right: 0;
+  width: 100vw;
+  max-width: 400px;
+  padding: 10px;
+  background-color: var(--background);
+  color: var(--foreground);
+  border-radius: 10px;
+  border: 1px solid var(--foreground);
+  display: none;
+  z-index: 1000;
+}
+.social-list-item {
+  padding: 10px;
+}
+.social-list-item > a {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  text-decoration: none;
+}
+.social-list-divider {
+  border: 0.5px solid var(--foreground);
+}
+.social-list-item:hover {
+  background-color: var(--foreground);
+  color: var(--background);
+}
 .is-dark {
-  --foreground: #ffb6c1;
-  --background: #2a0a18bb;
+  --foreground: #E1F6F9;
+  --background: #8F2447bb;
 }
 @media screen and (max-width: 625px) {
   #tree-nation-offset-website {
@@ -206,40 +317,104 @@ a {
     margin-bottom: 60px;
   }
 }
+
+@media screen and (max-width: 425px) {
+  #donate-badge {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 350px) {
+  footer, #show-socials-button, #theme-select-button, #show-socials-button > i, #theme-select-button > i {
+    font-size: 10pt;
+  }
+}
 `;
 
 // #endregion
 
 // #region Components
 
-const footer = document.createElement("footer");
-footer.innerHTML = `
+const nhcarriganHeadersFooter = document.createElement("footer");
+nhcarriganHeadersFooter.innerHTML = `
 <div id="footer-inner-container">
-<p>&copy; <a href="https://nhcarrigan.com" target="_blank">Naomi Carrigan</a></p>
-<a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer">
-  <i class="fa-solid fa-comments"></i>
-</a>
-<button id="theme-select-button" type="button">
-  <i id="theme-select-icon" class="fa-solid fa-moon"></i>
+<p id="footer-copyright">&copy; <a href="https://nhcarrigan.com" target="_blank">Naomi Carrigan</a></p>
+<button id="show-socials-button" type="button">
+  <i class="fa-solid fa-share-nodes"></i> Connect with Us
 </button>
-<a href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer">
+<button id="theme-select-button" type="button">
+  <i id="theme-select-icon" class="fa-solid fa-moon"></i> Toggle Theme
+</button>
+<a id="donate-badge" href="https://buy.stripe.com/cN24iTfqu1j6b3afZ2" target="_blank" rel="noreferrer">
   <img src="https://cdn.nhcarrigan.com/donate.png" alt="Donate" style="width: 70px; height: 70px;">
 </a>
 <div id="tree-nation-offset-website"></div>
 </div>
+<div id="social-list">
+  <div class="social-list-item">
+    <a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-discord"></i><span>Join our Discord~!</span>
+    </a>
+  </div>
+  <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://forum.nhcarrigan.com" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-discourse"></i><span>Sign up for our forum~!</span>
+    </a>
+  </div>
+  <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://git.nhcarrigan.com" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-git-alt"></i><span>Check out our source code~!</span>
+    </a>
+  </div>
+  <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://bsky.app/profile/nhcarrigan.com" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-bluesky"></i><span>Follow us on Bluesky~!</span>
+    </a>
+  </div>
+  <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://www.linkedin.com/company/nhcarrigan" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-linkedin"></i><span>Connect with us on LinkedIn~!</span>
+    </a>
+  </div>
+  <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://www.reddit.com/r/nhcarrigan/" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-reddit"></i><span>Join our subreddit~!</span>
+    </a>
+  </div>
+  <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://www.youtube.com/@naomilgbt" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-youtube"></i><span>Subscribe to our YouTube~!</span>
+    </a>
+  </div>
+    <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://twitch.tv/naomilgbt" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-twitch"></i><span>Subscribe to our Twitch~!</span>
+    </a>
+  </div>
+    <hr class="social-list-divider" />
+  <div class="social-list-item">
+    <a href="https://x.com/nhcarrigan1" target="_blank" rel="noreferrer">
+      <i class="fa-brands fa-twitter"></i><span>We are even on Twitter~!</span>
+    </a>
+  </div>
+</div>
 `;
-
-// #endregion
-
 // #region Scripts
 
-const treeNation = document.createElement("script");
-treeNation.src
+const nhcarriganHeadersTreeNation = document.createElement("script");
+nhcarriganHeadersTreeNation.src
   = "https://widgets.tree-nation.com/js/widgets/v1/widgets.min.js?v=1.0";
-const treeNationBottom = document.createElement("script");
-treeNationBottom.defer = true;
-treeNationBottom.async = true;
-treeNationBottom.innerHTML = `
+const nhcarriganHeadersTreeNationBottom = document.createElement("script");
+nhcarriganHeadersTreeNationBottom.defer = true;
+nhcarriganHeadersTreeNationBottom.async = true;
+nhcarriganHeadersTreeNationBottom.innerHTML = `
 const interval = setInterval(() => {
   const tree = document.querySelector("#tree-nation-offset-website");
   if (!tree) {
@@ -254,134 +429,164 @@ const interval = setInterval(() => {
   clearInterval(interval);
 }, 1000);
 `;
-const fontAwesome = document.createElement("script");
-fontAwesome.src = "https://kit.fontawesome.com/f949111719.js";
-const analytics = document.createElement("script");
-analytics.defer = true;
-analytics.setAttribute("domain", "nhcarrigan.com");
-analytics.src
-  // eslint-disable-next-line stylistic/max-len
-  = "https://analytics.nhcarrigan.com/js/script.file-downloads.hash.outbound-links.pageview-props.revenue.tagged-events.js";
-analytics.setAttribute("event-domain", hostname);
-analytics.setAttribute("data-domain", "nhcarrigan.com");
-analytics.setAttribute("event-page", title?.innerText ?? "Unknown Page");
-analytics.setAttribute("event-path", pathname);
-const analytics2 = document.createElement("script");
-analytics2.innerHTML = `
-window.plausible = window.plausible ??
-function() { 
-  (window.plausible.q = window.plausible.q ?? []).push(arguments) 
-}
+const nhcarriganHeadersFontAwesome = document.createElement("script");
+nhcarriganHeadersFontAwesome.src = "https://kit.fontawesome.com/f949111719.js";
+const nhcarriganHeadersAnalytics = document.createElement("script");
+nhcarriganHeadersAnalytics.defer = true;
+nhcarriganHeadersAnalytics.src
+
+  = "https://analytics.nhcarrigan.com/js/pa-YUXAn1vhhRttySUAw_LMN.js";
+const nhcarriganHeadersAnalytics2 = document.createElement("script");
+nhcarriganHeadersAnalytics2.innerHTML = `
+  window.plausible=window.plausible||function(){(plausible.q=plausible.q||[]).push(arguments)},plausible.init=plausible.init||function(i){plausible.o=i||{}};
+  plausible.init({
+    domain: "${nhcarriganHeadersHostname}",
+    page: "${nhcarriganHeadersTitle?.innerText ?? "Unknown Page"}",
+    path: "${nhcarriganHeadersPathname}",
+  })
 `;
-const googleAdsense = document.createElement("script");
-googleAdsense.async = true;
-googleAdsense.src
+const nhcarriganHeadersGoogleAdsense = document.createElement("script");
+nhcarriganHeadersGoogleAdsense.async = true;
+nhcarriganHeadersGoogleAdsense.src
   // eslint-disable-next-line stylistic/max-len -- big boi string
   = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3569924701890974";
-googleAdsense.setAttribute("crossorigin", "anonymous");
+nhcarriganHeadersGoogleAdsense.setAttribute("crossorigin", "anonymous");
 
 // #endregion
 
 // #region Inject Elements
 
-head?.appendChild(openGraphTitle);
-head?.appendChild(openGraphDescription);
-head?.appendChild(openGraphImage);
-head?.appendChild(openGraphUrl);
-head?.appendChild(openGraphType);
-head?.appendChild(twitterCard);
-head?.appendChild(twitterDomain);
-head?.appendChild(twitterUrl);
-head?.appendChild(twitterTitle);
-head?.appendChild(twitterDescription);
-head?.appendChild(twitterImage);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersCharacterSet);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersViewport);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersThemeColor);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersReferrer);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphTitle);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphDescription);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImage);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphUrl);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphType);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphSiteName);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphLocale);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImageAlt);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImageWidth);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersOpenGraphImageHeight);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterCard);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterDomain);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterUrl);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterTitle);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterDescription);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterImage);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterSite);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTwitterCreator);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersFavicon);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAppleTouchIcon);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersSmallIcon);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersLargeIcon);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersFormatDetection);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersRobots);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAuthor);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersStyles);
 
-head?.appendChild(favicon);
-head?.appendChild(appleTouchIcon);
-head?.appendChild(smallIcon);
-head?.appendChild(largeIcon);
-
-head?.appendChild(styles);
-
-head?.appendChild(treeNation);
-head?.appendChild(fontAwesome);
-head?.appendChild(analytics);
-head?.appendChild(analytics2);
-head?.appendChild(googleAdsense);
-
-body?.appendChild(footer);
-body?.appendChild(treeNationBottom);
-// #endregion
-
-// #region Audio
-
-const playButton = document.querySelector("#audio-theme-button");
-const audio = new Audio("https://cdn.nhcarrigan.com/theme.mp3");
-let playing = false;
-playButton?.addEventListener("click", () => {
-  if (playing) {
-    audio.pause();
-    playing = false;
-    playButton.innerHTML = "<i class=\"fa-solid fa-play\"></i>";
-  } else {
-    void audio.play();
-    playing = true;
-    playButton.innerHTML = "<i class=\"fa-solid fa-pause\"></i>";
-  }
-});
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersTreeNation);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersFontAwesome);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAnalytics);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersAnalytics2);
+nhcarriganHeadersHead?.appendChild(nhcarriganHeadersGoogleAdsense);
 
+nhcarriganHeadersBody?.appendChild(nhcarriganHeadersFooter);
+nhcarriganHeadersBody?.appendChild(nhcarriganHeadersTreeNationBottom);
 // #endregion
 
 // #region Theme
 
-const themeButton = document.querySelector("#theme-select-button");
-const themeIcon = document.querySelector("#theme-select-icon");
+const nhcarriganHeadersThemeButton = document.querySelector(
+  "#theme-select-button",
+);
+const nhcarriganHeadersThemeIcon = document.querySelector("#theme-select-icon");
 if (localStorage.getItem("theme") === "dark") {
-  themeIcon?.classList.remove("fa-moon");
-  themeIcon?.classList.add("fa-sun");
+  nhcarriganHeadersThemeIcon?.classList.remove("fa-moon");
+  nhcarriganHeadersThemeIcon?.classList.add("fa-sun");
   document.querySelector("html")?.classList.add("is-dark");
 }
-const toggleTheme = (): void => {
-  const currentTheme = localStorage.getItem("theme");
-  if (currentTheme === "dark") {
+const nhcarriganHeadersToggleTheme = (): void => {
+  const nhcarriganHeadersCurrentTheme = localStorage.getItem("theme");
+  if (nhcarriganHeadersCurrentTheme === "dark") {
     localStorage.setItem("theme", "light");
-    themeIcon?.classList.remove("fa-sun");
-    themeIcon?.classList.add("fa-moon");
+    nhcarriganHeadersThemeIcon?.classList.remove("fa-sun");
+    nhcarriganHeadersThemeIcon?.classList.add("fa-moon");
     document.querySelector("html")?.classList.remove("is-dark");
     return;
   }
   localStorage.setItem("theme", "dark");
-  themeIcon?.classList.remove("fa-moon");
-  themeIcon?.classList.add("fa-sun");
+  nhcarriganHeadersThemeIcon?.classList.remove("fa-moon");
+  nhcarriganHeadersThemeIcon?.classList.add("fa-sun");
   document.querySelector("html")?.classList.add("is-dark");
 };
-themeButton?.addEventListener("click", toggleTheme);
-const prefersDark = window.matchMedia("(prefers-color-scheme: dark)");
-if (prefersDark.matches && localStorage.getItem("theme") !== null) {
+nhcarriganHeadersThemeButton?.addEventListener(
+  "click",
+  nhcarriganHeadersToggleTheme,
+);
+const nhcarriganHeadersPrefersDark = window.matchMedia(
+  "(prefers-color-scheme: dark)",
+);
+if (
+  nhcarriganHeadersPrefersDark.matches
+  && localStorage.getItem("theme") !== null
+) {
   localStorage.setItem("theme", "dark");
-  themeIcon?.classList.remove("fa-moon");
-  themeIcon?.classList.add("fa-sun");
+  nhcarriganHeadersThemeIcon?.classList.remove("fa-moon");
+  nhcarriganHeadersThemeIcon?.classList.add("fa-sun");
   document.querySelector("html")?.classList.add("is-dark");
 }
 
 // #endregion
 
+// #region Social Toggle
+const nhcarriganHeadersShowSocialsButton
+  = document.querySelector<HTMLButtonElement>("#show-socials-button");
+const nhcarriganHeadersSocialList
+  = document.querySelector<HTMLDivElement>("#social-list");
+const nhcarriganHeadersToggleSocials = (): void => {
+  if (!nhcarriganHeadersSocialList) {
+    throw new Error("Social list element not found.");
+  }
+  if (nhcarriganHeadersSocialList.style.display === "block") {
+    nhcarriganHeadersSocialList.style.display = "none";
+    nhcarriganHeadersShowSocialsButton?.setAttribute("aria-expanded", "false");
+    nhcarriganHeadersShowSocialsButton?.setAttribute(
+      "aria-label",
+      "Show Socials",
+    );
+    return;
+  }
+  nhcarriganHeadersSocialList.style.display = "block";
+  nhcarriganHeadersShowSocialsButton?.setAttribute("aria-expanded", "true");
+  nhcarriganHeadersShowSocialsButton?.setAttribute(
+    "aria-label",
+    "Hide Socials",
+  );
+};
+nhcarriganHeadersShowSocialsButton?.addEventListener(
+  "click",
+  nhcarriganHeadersToggleSocials,
+);
+
 // #region CTA
 
-const cta = document.createElement("dialog");
-cta.style.position = "fixed";
-cta.style.top = "50%";
-cta.style.left = "50%";
-cta.style.transform = "translate(-50%, -50%)";
-cta.style.padding = "10px";
-cta.style.borderRadius = "10px";
-cta.style.backgroundColor = "var(--background)";
-cta.style.color = "var(--foreground)";
-cta.style.textAlign = "center";
-cta.style.width = "95%";
-cta.style.maxWidth = "400px";
-cta.id = "community-cta";
-cta.innerHTML = `
+const nhcarriganHeadersCta = document.createElement("dialog");
+nhcarriganHeadersCta.style.position = "fixed";
+nhcarriganHeadersCta.style.top = "50%";
+nhcarriganHeadersCta.style.left = "50%";
+nhcarriganHeadersCta.style.transform = "translate(-50%, -50%)";
+nhcarriganHeadersCta.style.padding = "10px";
+nhcarriganHeadersCta.style.borderRadius = "10px";
+nhcarriganHeadersCta.style.backgroundColor = "var(--background)";
+nhcarriganHeadersCta.style.color = "var(--foreground)";
+nhcarriganHeadersCta.style.textAlign = "center";
+nhcarriganHeadersCta.style.width = "95%";
+nhcarriganHeadersCta.style.maxWidth = "400px";
+nhcarriganHeadersCta.id = "community-cta";
+nhcarriganHeadersCta.innerHTML = `
   <h1 autofocus>Hello~!</h1>
   <div style="display: flex; justify-content: space-around; margin-bottom: 10px;">
     <img src="https://cdn.nhcarrigan.com/logo.png" alt="NHCarrigan Logo" style="width: 100px; height: 100px;">
@@ -392,47 +597,62 @@ cta.innerHTML = `
   <a href="https://chat.nhcarrigan.com" target="_blank" rel="noreferrer" style="padding: 10px; background: var(--foreground); color: var(--background); outline: none">Okay, take me there~!</a>
 `;
 
-const modalBg = document.createElement("div");
-modalBg.style.zIndex = "4999";
-modalBg.style.position = "fixed";
-modalBg.style.top = "0";
-modalBg.style.left = "0";
-modalBg.style.width = "100vw";
-modalBg.style.height = "100vh";
-modalBg.style.backgroundColor = "rgba(0, 0, 0, 0.5)";
-modalBg.style.display = "none";
-modalBg.id = "modal-bg";
-const closeModal = (): void => {
-  cta.close();
-  modalBg.style.display = "none";
+const nhcarriganHeadersModalBg = document.createElement("div");
+nhcarriganHeadersModalBg.style.zIndex = "4999";
+nhcarriganHeadersModalBg.style.position = "fixed";
+nhcarriganHeadersModalBg.style.top = "0";
+nhcarriganHeadersModalBg.style.left = "0";
+nhcarriganHeadersModalBg.style.width = "100vw";
+nhcarriganHeadersModalBg.style.height = "100vh";
+nhcarriganHeadersModalBg.style.backgroundColor = "rgba(0, 0, 0, 0.5)";
+nhcarriganHeadersModalBg.style.display = "none";
+nhcarriganHeadersModalBg.id = "modal-bg";
+const nhcarriganHeadersCloseModal = (): void => {
+  nhcarriganHeadersCta.close();
+  nhcarriganHeadersModalBg.style.display = "none";
 };
-const handleModalClick = (event: MouseEvent): void => {
+const nhcarriganHeadersHandleModalClick = (event: MouseEvent): void => {
   event.stopPropagation();
-  if (event.target === cta) {
-    closeModal();
+  if (event.target === nhcarriganHeadersCta) {
+    nhcarriganHeadersCloseModal();
   }
 };
-const showModal = (): void => {
-  const lastShown = Number.parseInt(
+const nhcarriganHeadersShowModal = (): void => {
+  const nhcarriganHeadersLastShown = Number.parseInt(
     localStorage.getItem("naomi-community-cta") ?? "0",
     10,
   );
-  const lastShownDate = new Date(lastShown);
-  const diff = Date.now() - lastShownDate.getTime();
-  console.table({ diff, lastShown, lastShownDate });
+  const nhcarriganHeadersLastShownDate = new Date(nhcarriganHeadersLastShown);
+  const nhcarriganHeadersDiff
+    = Date.now() - nhcarriganHeadersLastShownDate.getTime();
+  console.table({
+    diff:          nhcarriganHeadersDiff,
+    lastShown:     nhcarriganHeadersLastShown,
+    lastShownDate: nhcarriganHeadersLastShownDate,
+  });
   // We only want to show this once a week.
-  if (diff < 1000 * 60 * 60 * 24 * 7) {
+  if (nhcarriganHeadersDiff < 1000 * 60 * 60 * 24 * 7) {
     return;
   }
-  cta.showModal();
-  modalBg.style.display = "block";
-  modalBg.addEventListener("click", closeModal);
-  const closeButton = cta.querySelector("button");
-  closeButton?.addEventListener("click", closeModal);
-  cta.addEventListener("click", handleModalClick);
+  nhcarriganHeadersCta.showModal();
+  nhcarriganHeadersModalBg.style.display = "block";
+  nhcarriganHeadersModalBg.addEventListener(
+    "click",
+    nhcarriganHeadersCloseModal,
+  );
+  const nhcarriganHeadersCloseButton
+    = nhcarriganHeadersCta.querySelector("button");
+  nhcarriganHeadersCloseButton?.addEventListener(
+    "click",
+    nhcarriganHeadersCloseModal,
+  );
+  nhcarriganHeadersCta.addEventListener(
+    "click",
+    nhcarriganHeadersHandleModalClick,
+  );
   localStorage.setItem("naomi-community-cta", Date.now().toString());
 };
 
-body?.appendChild(cta);
-body?.appendChild(modalBg);
-showModal();
+nhcarriganHeadersBody?.appendChild(nhcarriganHeadersCta);
+nhcarriganHeadersBody?.appendChild(nhcarriganHeadersModalBg);
+nhcarriganHeadersShowModal();