diff --git a/netbox/templates/base.html b/netbox/templates/base.html
index a2f1337ac..085293d0e 100644
--- a/netbox/templates/base.html
+++ b/netbox/templates/base.html
@@ -1,8 +1,20 @@
-{% load static %} {% load helpers %}
+{# Base template for (almost) all NetBox pages #}
+{% load static %}
+{% load static %}
+{% load helpers %}
 <!DOCTYPE html>
 <html lang="en">
   <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="viewport"
+      content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"
+    />
+
+    {# Page title #}
     <title>{% block title %}Home{% endblock %} | NetBox</title>
+
+    {# Static resources #}
     <link
       rel="stylesheet"
       href="{% static 'netbox-external.css'%}"
@@ -18,30 +30,38 @@
       href="{% static 'netbox-dark.css'%}"
       onerror="window.location='{% url 'media_failure' %}?filename=netbox-dark.css'"
     />
-
     <link rel="icon" type="image/png" href="{% static 'netbox.ico' %}" />
-    <meta charset="UTF-8" />
-    <meta
-      name="viewport"
-      content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"
-    />
+
+    {# Javascript #}
     <script
       type="text/javascript"
       src="{% static 'netbox.js' %}"
       onerror="window.location='{% url 'media_failure' %}?filename=netbox.js'">
     </script>
+
+    {# Additional <head> content #}
     {% block head %}{% endblock %}
   </head>
-  {% with color_mode=preferences|get_key:'ui.colormode' %}
-  
-  <body{%if color_mode == 'dark'%} data-netbox-color-mode="dark"{% elif color_mode == 'light' %} data-netbox-color-mode="light"{% endif %}>
   
+  <body
+    {% if preferences|get_key:'ui.colormode' == 'dark'%} data-netbox-color-mode="dark"
+    {% else %} data-netbox-color-mode="light"
+    {% endif %}
+  >
+
+    {# Page layout #}
     {% block layout %}{% endblock %}
+
+    {# Additional Javascript #}
     {% block javascript %}{% endblock %}
+
+    {# User messages #}
     {% include './messages.html' %}
+
+    {# Data container #}
     <div id="netbox-data" style="display: none!important; visibility: hidden!important">
-    {% block data %}{% endblock %}
+      {% block data %}{% endblock %}
     </div>
+
   </body>
-  {% endwith %}
 </html>
diff --git a/netbox/templates/bottom.html b/netbox/templates/bottom.html
deleted file mode 100644
index 5b5978e3a..000000000
--- a/netbox/templates/bottom.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<div class="d-flex flex-column container-fluid mt-auto justify-content-end sidebar-bottom">
-  <nav class="nav justify-content-between mb-2 mt-4 px-2">
-    <a type="button" target="_blank" class="nav-link" href="https://netbox.readthedocs.io/">
-      <i title="Docs" class="mdi mdi-book-open-variant text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
-    </a>
-    <a class="nav-link" href="{% url 'api_docs' %}" target="_blank">
-      <i title="API" data-bs-placement="top" data-bs-toggle="tooltip" class="mdi mdi-code-braces text-primary"></i>
-    </a>
-    <a class="nav-link" href="https://github.com/netbox-community/netbox" target="_blank">
-      <i title="Source Code" data-bs-placement="top" data-bs-toggle="tooltip" class="mdi mdi-code-tags text-primary"></i>
-    </a>
-    <a target="_blank" class="nav-link" href="https://github.com/netbox-community/netbox/wiki">
-      <i title="Get Help" data-bs-placement="top" data-bs-toggle="tooltip" class="mdi mdi-lifebuoy text-primary"></i>
-    </a>
-  </nav>
-</div>
diff --git a/netbox/templates/footer.html b/netbox/templates/footer.html
deleted file mode 100644
index e0f78ddbe..000000000
--- a/netbox/templates/footer.html
+++ /dev/null
@@ -1,42 +0,0 @@
-<footer class="footer mt-auto bg-light p-3 text-center">
-  <div class="container-fluid">
-    <div class="row">
-      <div class="col d-flex flex-column justify-content-center">
-        <span class="text-muted">
-          {{ settings.HOSTNAME }} (v{{ settings.VERSION }})
-        </span>
-      </div>
-      <div class="col d-flex flex-column justify-content-center">
-        <span class="text-muted">{% now 'Y-m-d H:i:s T' %}</span>
-      </div>
-      <div class="col d-flex flex-column justify-content-center">
-        <nav class="nav">
-          <a
-            class="nav-link"
-            href="https://netbox.readthedocs.io/"
-            target="_blank"
-          >
-            <i class="mdi mdi-book-open-page-variant text-primary"></i> Docs
-          </a>
-          <a class="nav-link" href="{% url 'api_docs' %}" target="_blank">
-            <i class="mdi mdi-cloud-braces text-primary"></i> API
-          </a>
-          <a
-            class="nav-link"
-            href="https://github.com/netbox-community/netbox"
-            target="_blank"
-          >
-            <i class="mdi mdi-xml text-primary"></i> Code
-          </a>
-          <a
-            class="nav-link"
-            href="https://github.com/netbox-community/netbox/wiki"
-            target="_blank"
-          >
-            <i class="mdi mdi-lifebuoy text-primary"></i> Help
-          </a>
-        </nav>
-      </div>
-    </div>
-  </div>
-</footer>
diff --git a/netbox/templates/layout.html b/netbox/templates/layout.html
index 66de47c08..d151ccc22 100644
--- a/netbox/templates/layout.html
+++ b/netbox/templates/layout.html
@@ -1,81 +1,124 @@
+{# Base layout for the core NetBox UI w/navbar and page content #}
 {% extends 'base.html' %}
+{% load nav %}
 {% load search_options %}
-
-{% block head %}{% endblock %}
+{% load static %}
 
 {% block layout %}
-<div class="container-fluid">
-  <div class="row">
-    <main class="col-md-9 ms-sm-auto col-lg-10 px-0">
-      <nav id="sidebar-menu" class="col-md-3 col-lg-2 d-md-block sidebar collapse px-0">
-        <div class="position-sticky pt-3">
-          <a class="px-2 sidebar-logo d-none d-md-flex" href="{% url 'home' %}">
-            {% load static %}
-            {% include 'logo.html' %}
-          </a>
-          <ul class="nav flex-column">
-            <div class="d-block d-md-none mx-1 my-3 search-container">
-              {% search_options %}
-            </div>
-            <div class="d-flex d-md-none mx-1 my-3 justify-content-end">
-              {% include './profile_button.html' %}
-            </div>
-            {% load nav %} {% nav %}
-          </ul>
-        </div>
-        {% include './bottom.html' %}
-      </nav>
-      <nav class="navbar navbar-light sticky-top flex-md-nowrap py-4 search container-fluid">
-        <div class="d-md-none w-100 d-flex justify-content-between align-items-center my-3">
-            <a class="px-2 sidebar-logo d-block d-md-none" href="{% url 'home' %}">
+  <div class="container-fluid">
+    <div class="row">
+      <main class="col-md-9 ms-sm-auto col-lg-10 px-0">
+
+        {# Sidebar #}
+        <nav id="sidebar-menu" class="col-md-3 col-lg-2 d-md-block sidebar collapse px-0">
+
+          {# Sidebar content #}
+          <div class="position-sticky pt-3">
+
+            {# Logo #}
+            <a class="px-2 sidebar-logo d-none d-md-flex" href="{% url 'home' %}">
               {% include 'logo.html' %}
             </a>
-            <button
-              type="button"
-              aria-expanded="false"
-              data-bs-toggle="collapse"
-              aria-controls="sidebar-menu"
-              data-bs-target="#sidebar-menu"
-              aria-label="Toggle Navigation"
-              class="navbar-toggler position-relative collapsed"
-            >
-              <span class="navbar-toggler-icon"></span>
-            </button>
-          </div>
-          <div class="d-none d-md-flex w-100 search-container">
-            {% search_options %}
-            {% include './profile_button.html' %}
-          </div>
-      </nav>
-      
-      <div class="px-4 content-container">
-        {% block title_container %}
-        <div class="title-container">
-          <div id="content-title">
-            <h1 class="h2 w-100">{% block title %}{% endblock %}</h1>
-            {% block breadcrumb_main %}{% endblock %}
+
+            {# Search bar #}
+            <ul class="nav flex-column">
+              <div class="d-block d-md-none mx-1 my-3 search-container">
+                {% search_options %}
+              </div>
+              <div class="d-flex d-md-none mx-1 my-3 justify-content-end">
+                {% include './profile_button.html' %}
+              </div>
+              {% nav %}
+            </ul>
+
           </div>
 
-          {% block controls %}{% endblock %}
-        </div>
-        {% endblock %}
-        <div id="content" class="container-fluid p-0 m-0">
-          {% block tabs %}{% endblock %}
-          {% block content %}{% endblock %}
-        </div>
-        <footer class="footer container-fluid pb-3 pt-4 px-0">
-          <div class="row align-items-center justify-content-end">
-          <div class="col-auto d-none d-md-block"></div>
-            <div class="col text-center text-md-end small text-muted">
-              <span class="fw-light d-block d-md-inline">{% now 'Y-m-d H:i:s T' %}</span>
-              <span class="ms-md-3 d-block d-md-inline">{{ settings.HOSTNAME }} (v{{ settings.VERSION }})</span>
-            </div>
+          {# Sidebar footer #}
+          <div class="d-flex flex-column container-fluid mt-auto justify-content-end sidebar-bottom">
+            <nav class="nav justify-content-between mb-2 mt-4 px-2">
+
+              {# Documentation #}
+              <a type="button" target="_blank" class="nav-link" href="https://netbox.readthedocs.io/">
+                <i title="Docs" class="mdi mdi-book-open-variant text-primary" data-bs-placement="top" data-bs-toggle="tooltip"></i>
+              </a>
+
+              {# API docs #}
+              <a class="nav-link" href="{% url 'api_docs' %}" target="_blank">
+                <i title="API" data-bs-placement="top" data-bs-toggle="tooltip" class="mdi mdi-code-braces text-primary"></i>
+              </a>
+
+              {# GitHub #}
+              <a class="nav-link" href="https://github.com/netbox-community/netbox" target="_blank">
+                <i title="Source Code" data-bs-placement="top" data-bs-toggle="tooltip" class="mdi mdi-code-tags text-primary"></i>
+              </a>
+
+              {# GitHub wiki #}
+              <a target="_blank" class="nav-link" href="https://github.com/netbox-community/netbox/wiki">
+                <i title="Get Help" data-bs-placement="top" data-bs-toggle="tooltip" class="mdi mdi-lifebuoy text-primary"></i>
+              </a>
+            </nav>
           </div>
-        </footer>
-      </div>
-    </main>
+
+        </nav>
+
+        {# Top bar #}
+        <nav class="navbar navbar-light sticky-top flex-md-nowrap py-4 search container-fluid">
+          <div class="d-md-none w-100 d-flex justify-content-between align-items-center my-3">
+              <a class="px-2 sidebar-logo d-block d-md-none" href="{% url 'home' %}">
+                {% include 'logo.html' %}
+              </a>
+              <button
+                type="button"
+                aria-expanded="false"
+                data-bs-toggle="collapse"
+                aria-controls="sidebar-menu"
+                data-bs-target="#sidebar-menu"
+                aria-label="Toggle Navigation"
+                class="navbar-toggler position-relative collapsed"
+              >
+                <span class="navbar-toggler-icon"></span>
+              </button>
+            </div>
+            <div class="d-none d-md-flex w-100 search-container">
+              {% search_options %}
+              {% include './profile_button.html' %}
+            </div>
+        </nav>
+
+        {# Body #}
+        <div class="px-4 content-container">
+
+          {# Page title #}
+          {% block title_container %}
+            <div class="title-container">
+              <div id="content-title">
+                <h1 class="h2 w-100">{% block title %}{% endblock %}</h1>
+                {% block breadcrumb_main %}{% endblock %}
+              </div>
+              {% block controls %}{% endblock %}
+            </div>
+          {% endblock %}
+
+          {# Page content #}
+          <div id="content" class="container-fluid p-0 m-0">
+            {% block tabs %}{% endblock %}
+            {% block content %}{% endblock %}
+          </div>
+
+          {# Page footer #}
+          <footer class="footer container-fluid pb-3 pt-4 px-0">
+            <div class="row align-items-center justify-content-end">
+            <div class="col-auto d-none d-md-block"></div>
+              <div class="col text-center text-md-end small text-muted">
+                <span class="fw-light d-block d-md-inline">{% now 'Y-m-d H:i:s T' %}</span>
+                <span class="ms-md-3 d-block d-md-inline">{{ settings.HOSTNAME }} (v{{ settings.VERSION }})</span>
+              </div>
+            </div>
+          </footer>
+
+        </div>
+
+      </main>
+    </div>
   </div>
-</div>
 {% endblock %}
-{% block javascript %}{% endblock %}
-{% block data %}{% endblock %}
