diff --git a/packetserver/http/routers/messages.py b/packetserver/http/routers/messages.py
index ba381db..e8ab18a 100644
--- a/packetserver/http/routers/messages.py
+++ b/packetserver/http/routers/messages.py
@@ -235,6 +235,6 @@ async def message_list_page(
             "page": page,
             "per_page": per_page,
             "total_pages": total_pages,
-            "current_user": current_user,
+            "current_user": current_user.username,
         },
     )
\ No newline at end of file
diff --git a/packetserver/http/templates/message_list.html b/packetserver/http/templates/message_list.html
index 5781aeb..2d55e0c 100644
--- a/packetserver/http/templates/message_list.html
+++ b/packetserver/http/templates/message_list.html
@@ -1,89 +1,107 @@
-<h1>Messages</h1>
+{% extends "base.html" %}
 
-<div class="mb-4 d-flex justify-content-between align-items-start flex-wrap gap-3">
-  <div>
-    <!-- Type tabs -->
-    <ul class="nav nav-tabs">
-      <li class="nav-item">
-        <a class="nav-link {% if current_type == 'received' %}active{% endif %}"
-           href="?type=received{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Received</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link {% if current_type == 'sent' %}active{% endif %}"
-           href="?type=sent{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Sent</a>
-      </li>
-      <li class="nav-item">
-        <a class="nav-link {% if current_type == 'all' %}active{% endif %}"
-           href="?type=all{% if current_search %}&search={{ current_search }}{% endif %}&page=1">All</a>
-      </li>
+{% block title %}Messages{% endblock %}
+
+{% block content %}
+<div class="container mt-4">
+  <h1>Messages</h1>
+
+  <div class="mb-4 d-flex justify-content-between align-items-start flex-wrap gap-3">
+    <div>
+      <!-- Type tabs -->
+      <ul class="nav nav-tabs">
+        <li class="nav-item">
+          <a class="nav-link {% if current_type == 'received' %}active{% endif %}"
+             href="?type=received{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Received</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link {% if current_type == 'sent' %}active{% endif %}"
+             href="?type=sent{% if current_search %}&search={{ current_search }}{% endif %}&page=1">Sent</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link {% if current_type == 'all' %}active{% endif %}"
+             href="?type=all{% if current_search %}&search={{ current_search }}{% endif %}&page=1">All</a>
+        </li>
+      </ul>
+    </div>
+
+    <div class="d-flex gap-2">
+      <!-- Search form -->
+      <form method="get" class="d-flex align-items-center">
+        <input type="hidden" name="type" value="{{ current_type }}">
+        <input type="text" name="search" class="form-control me-2" placeholder="Search messages..." value="{{ current_search or '' }}">
+        <button type="submit" class="btn btn-outline-primary">Search</button>
+      </form>
+      {% if current_search %}
+        <a href="?type={{ current_type }}" class="btn btn-outline-secondary">Clear</a>
+      {% endif %}
+
+      <!-- Compose button -->
+      <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#composeModal">
+        Compose New Message
+      </button>
+    </div>
+  </div>
+
+  {% if total > 0 %}
+    <p class="text-muted mb-3">
+      Showing {{ ((page-1)*per_page) + 1 }}–{{ page*per_page if page*per_page < total else total }} of {{ total }} messages
+    </p>
+  {% endif %}
+
+  {% if messages %}
+    <ul class="list-group message-list">
+      {% for msg in messages %}
+        <li class="list-group-item">
+          <strong>
+            <a href="/dashboard/message/{{ msg.id }}">
+              {{ msg.text[:80] }}{% if msg.text|length > 80 %}...{% endif %}
+            </a>
+          </strong>
+          {% if msg.has_attachments %}<span class="badge bg-info ms-2">Attachments</span>{% endif %}
+          {% if not msg.retrieved %}<span class="badge bg-warning ms-2">Unread</span>{% endif %}
+          <div class="text-muted small mt-1">
+            From: {{ msg.from }} | To: {{ msg.to | join(', ') }} | {{ msg.sent_at[:10] }} {{ msg.sent_at[11:16] }}
+          </div>
+          <div class="text-secondary small mt-2">
+            {{ msg.text[:200] }}{% if msg.text|length > 200 %}...{% endif %}
+          </div>
+        </li>
+      {% endfor %}
     </ul>
-  </div>
+  {% else %}
+    <div class="alert alert-info mt-4">
+      {% if current_search %}
+        No messages found matching "{{ current_search }}".
+      {% else %}
+        No messages yet.
+      {% endif %}
+    </div>
+  {% endif %}
 
-  <div class="d-flex gap-2">
-    <!-- Search form -->
-    <form method="get" class="d-flex">
-      <input type="hidden" name="type" value="{{ current_type }}">
-      <input type="text" name="search" class="form-control me-2" placeholder="Search messages..." value="{{ current_search or '' }}">
-      <button type="submit" class="btn btn-outline-primary">Search</button>
-    </form>
-    {% if current_search %}
-      <a href="?type={{ current_type }}" class="btn btn-outline-secondary">Clear</a>
-    {% endif %}
+  <!-- Pagination -->
+  {% if total_pages > 1 %}
+    <nav aria-label="Messages pagination" class="mt-5">
+      <ul class="pagination justify-content-center">
+        <li class="page-item {% if page == 1 %}disabled{% endif %}">
+          <a class="page-link" href="?page={{ page - 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Previous</a>
+        </li>
 
-    <!-- Compose button -->
-    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#composeModal">
-      Compose New Message
-    </button>
+        {% for p in range(1, total_pages + 1) %}
+          <li class="page-item {% if p == page %}active{% endif %}">
+            <a class="page-link" href="?page={{ p }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">{{ p }}</a>
+          </li>
+        {% endfor %}
+
+        <li class="page-item {% if page == total_pages %}disabled{% endif %}">
+          <a class="page-link" href="?page={{ page + 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Next</a>
+        </li>
+      </ul>
+    </nav>
+  {% endif %}
+
+  <div class="mt-4">
+    <a href="/dashboard" class="btn btn-outline-secondary">← Back to Dashboard</a>
   </div>
 </div>
-
-{% if total > 0 %}
-  <p class="text-muted mb-3">
-    Showing {{ ((page-1)*per_page) + 1 }}–{{ page*per_page if page*per_page < total else total }} of {{ total }} messages
-  </p>
-{% else %}
-  <p class="text-muted mb-3">No messages</p>
-{% endif %}
-
-{% if messages %}
-<ul class="message-list">
-  {% for msg in messages %}
-  <li>
-    <strong><a href="/dashboard/message/{{ msg.id }}">{{ msg.text[:60] }}{% if msg.text|length > 60 %}...{% endif %}</a></strong>
-    {% if msg.has_attachments %}<span class="text-info">(Attachments)</span>{% endif %}
-    {% if not msg.retrieved %}<span class="text-warning">(Unread)</span>{% endif %}
-    <span class="meta">
-      From: {{ msg.from }} | To: {{ msg.to | join(', ') }} | {{ msg.sent_at[:10] }} {{ msg.sent_at[11:19] }}
-    </span>
-    <div class="preview">{{ msg.text[:200] }}{% if msg.text|length > 200 %}...{% endif %}</div>
-  </li>
-  {% endfor %}
-</ul>
-{% else %}
-<div class="alert alert-info">
-  {% if current_search %}No messages found matching "{{ current_search }}".{% else %}No messages yet.{% endif %}
-</div>
-{% endif %}
-
-<!-- Pagination (only if >1 page) -->
-{% if total_pages > 1 %}
-<nav aria-label="Messages pagination" class="mt-4">
-  <ul class="pagination justify-content-center">
-    <li class="page-item {% if page == 1 %}disabled{% endif %}">
-      <a class="page-link" href="?page={{ page - 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Previous</a>
-    </li>
-
-    {% for p in range(1, total_pages + 1) %}
-      <li class="page-item {% if p == page %}active{% endif %}">
-        <a class="page-link" href="?page={{ p }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">{{ p }}</a>
-      </li>
-    {% endfor %}
-
-    <li class="page-item {% if page == total_pages %}disabled{% endif %}">
-      <a class="page-link" href="?page={{ page + 1 }}&type={{ current_type }}{% if current_search %}&search={{ current_search }}{% endif %}">Next</a>
-    </li>
-  </ul>
-</nav>
-{% endif %}
-
-<p><a href="/dashboard">← Back to Dashboard</a></p>
\ No newline at end of file
+{% endblock %}
\ No newline at end of file