Make light/dark theme work on index page

fab6f5ed2fd7766988c8c97ccbec21f4d0c41fe3

Tucker McKnight | Sat Jan 03 2026

Make light/dark theme work on index page

Adds the light/dark/auto dropdown on the index page, along
with the JS file (top.js) that is needed to make it work.
js_templates/index.ts:10
Before
10
11
          <div class="container my-4">
            <div class="row">
After
10
11
          <script src="${data.reposPath}/frontend/top.js"></script>
          <div class="container">
            <div class="row d-flex justify-content-end">
              <div class="col-auto pt-2">
                <div class="dropdown">
                  <button class="dropdown-toggle btn btn-bg" id="dark-mode-switch" type="button" data-bs-toggle="dropdown" aria-expanded="false">
                    <span>&#xFE0F;</span>
                  </button>
                  <ul class="dropdown-menu">
                    <li><button class="btn shadow-none" data-theme-pref="light" onclick="toggleDarkMode(this)"><span class="me-1">&#x1F31E;</span>Light</button></li>
                    <li><button class="btn shadow-none" data-theme-pref="dark" onclick="toggleDarkMode(this)"><span class="me-1">&#x1F319;</span>Dark</button></li>
                    <li><button class="btn shadow-none" data-theme-pref="auto" onclick="toggleDarkMode(this)"><span class="me-1">&#x1F5A5;&#xFE0F;</span>Match OS</button></li>
                  </ul>
                </div>
              </div>
            </div>
            <div class="row my-3">