Adds a toggle to RetroAchievements nav on desktop to unofficial achievements on a game page

ra-show-unofficial.user.js

// ==UserScript==
// @name         View RetroAchievements Unofficial
// @namespace    https://sethdehaan.com
// @author       Seth DeHaan
// @version      1.0
// @description  Adds a button that appends ?unpublished=true to the URL and reloads the page
// @icon         https://www.google.com/s2/favicons?sz=64&domain=retroachievements.org
// @match        https://retroachievements.org/game/*
// @updateURL    https://gist.github.com/sethxd/8b25aefee92aeb5c33175c38c3fb32d7/raw/de8379f97746b31e81cb2b59006b4d9ec407b9b7/ra-show-unofficial.user.js
// @downloadURL  https://gist.github.com/sethxd/8b25aefee92aeb5c33175c38c3fb32d7/raw/de8379f97746b31e81cb2b59006b4d9ec407b9b7/ra-show-unofficial.user.js
// @grant        none
// ==/UserScript==

;(function () {
  "use strict"

  const url = new URL(window.location.href)

  const container = document.createElement("div")
  container.classList.add("nav-item")
  const svg = '<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><!-- Lock body outline --><rect x="3" y="6" width="9" height="7" rx="1.2" stroke="currentColor" stroke-width="1.2" fill="none"/><!-- Shackle --><path d="M4.5 6V3.5C4.5 2.3 5.7 1.2 7.5 1.2C9.3 1.2 10.5 2.3 10.5 3.5V6" stroke="currentColor" stroke-width="1.2" fill="none"/></svg>'
  const btn = document.createElement("a")
  btn.innerHTML = svg;
  if (url.searchParams.get("unpublished", "true")) {
    btn.innerHTML += "<span class='ml-1 hidden sm:inline-block'>Show Official</span>"
  } else {
    btn.innerHTML += "<span class='ml-1 hidden sm:inline-block'>Show Unofficial</span>"
  }

  btn.setAttribute("href", "#")
  btn.style.color = "rgb(204, 153, 0)";

  // Add classes
  btn.classList.add("nav-link")

  btn.addEventListener("click", (e) => {
    e.preventDefault()
    if (url.searchParams.get("unpublished", "true")) {
      url.searchParams.delete("unpublished")
    } else {
      url.searchParams.set("unpublished", "true")
    }

    window.location.href = url.toString()
  })
  const nav = document.querySelector("#nav-brand-wrapper + div")
  container.appendChild(btn)
  nav.appendChild(container)
})()