diff --git a/src/judas_server/web/templates/client_details.html b/src/judas_server/web/templates/client_details.html
index 2fec335..9f3fd6c 100644
--- a/src/judas_server/web/templates/client_details.html
+++ b/src/judas_server/web/templates/client_details.html
@@ -1,37 +1,46 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Details for client {{ client.id }}</title>
-    <link
-      rel="stylesheet"
-      href="{{ url_for('static', filename='css/style.css') }}"
-    />
-  </head>
-  <body>
+<div class="details-header">
+  <p>Machine {{ client.id }}</p>
+</div>
+<div class="details-container">
+  <div class="details-sidebar">
+    <ul>
+      <li>
+        <a href="?tab=summary">
+          <i class="fi fi-ss-summary-check"></i>
+          <span>Summary</span>
+        </a>
+      </li>
+    </ul>
+  </div>
+  <div class="details-content">
     <h1>Details for client {{ client.id }}</h1>
-    <p><strong>ID:</strong> {{ client.id }}</p>
-    <p><strong>IP Address:</strong> {{ client.addr[0] }}</p>
-    <p><strong>Port:</strong> {{ client.addr[1] }}</p>
+
     <p>
       <strong>Last Seen:</strong>
       <span id="last-seen">{{ client.last_seen }}</span>
     </p>
-    <p>
-      <strong>Initial:</strong>
-      <pre>{{ client.initial_telemetry | tojson(indent=2) }}</pre>
-    </p>
-  </body>
+  </div>
+</div>
 
-  <script>
-    function updateLastSeen() {
-      const lastSeenElement = document.getElementById("last-seen");
-      const lastSeenTimestamp = parseInt(lastSeenElement.textContent);
-      const lastSeenDate = new Date(lastSeenTimestamp * 1000);
-      lastSeenElement.textContent = lastSeenDate.toLocaleString();
-    }
+<script>
+  function updateLastSeen() {
+    const lastSeenElement = document.getElementById("last-seen");
+    const lastSeenTimestamp = parseInt(lastSeenElement.textContent);
+    const lastSeenDate = new Date(lastSeenTimestamp * 1000);
+    lastSeenElement.textContent = lastSeenDate.toLocaleString();
+  }
 
-    updateLastSeen();
-  </script>
-</html>
+  $(".details-sidebar > ul > li > a").click(function (e) {
+    e.preventDefault();
+    const tab = $(this).attr("href").split("=")[1];
+    const urlParams = new URLSearchParams(window.location.search);
+    urlParams.set("tab", tab);
+    window.history.pushState(
+      {},
+      "",
+      `${window.location.pathname}?${urlParams}`,
+    );
+  });
+
+  updateLastSeen();
+</script>
