From aa0475c151f999775ea6c07da83e373a446bacd4 Mon Sep 17 00:00:00 2001
From: Kai <kai@localhost>
Date: Tue, 17 Feb 2026 17:26:03 +0100
Subject: [PATCH] =?UTF-8?q?Matrix-Chat:=20feste=20Scrollfl=C3=A4che=20gege?=
 =?UTF-8?q?n=20Layout-Verschiebung?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/styles.css        | 27 ++++++++++++++++++++++++---
 templates/dashboard.html | 22 ++++++++++++----------
 2 files changed, 36 insertions(+), 13 deletions(-)

diff --git a/static/styles.css b/static/styles.css
index 268ef55..a0ec817 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -252,12 +252,10 @@ button:hover { background: linear-gradient(180deg, #7cbc19, #5e8a12); }
 
 .matrix-list {
   list-style: none;
-  margin: .5rem 0 0;
+  margin: 0;
   padding: 0;
   display: grid;
   gap: .5rem;
-  max-height: 280px;
-  overflow: auto;
 }
 
 .matrix-list li {
@@ -267,6 +265,29 @@ button:hover { background: linear-gradient(180deg, #7cbc19, #5e8a12); }
   padding: .5rem .6rem;
   display: grid;
   gap: .2rem;
+  min-width: 0;
+}
+
+.matrix-body {
+  max-height: 7.5rem;
+  overflow: auto;
+  white-space: pre-wrap;
+  overflow-wrap: anywhere;
+  word-break: break-word;
+}
+
+.matrix-card {
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+}
+
+.matrix-scroll {
+  margin-top: .5rem;
+  max-height: 320px;
+  overflow-y: auto;
+  overflow-x: hidden;
+  padding-right: .25rem;
 }
 
 .table-wrap {
diff --git a/templates/dashboard.html b/templates/dashboard.html
index fa734d6..0217947 100644
--- a/templates/dashboard.html
+++ b/templates/dashboard.html
@@ -83,21 +83,23 @@
       {{end}}
     </section>
 
-    <section class="card">
+    <section class="card matrix-card">
       <h2>Matrix-Chat</h2>
       {{if .MatrixEnabled}}
         {{if .MatrixError}}
           <p class="muted">Chat konnte nicht geladen werden: {{.MatrixError}}</p>
         {{else if .MatrixMessages}}
-          <ul class="matrix-list">
-            {{range .MatrixMessages}}
-            <li>
-              <div><strong>{{.Sender}}</strong></div>
-              <div>{{.Body}}</div>
-              <div class="muted">{{.Timestamp}}</div>
-            </li>
-            {{end}}
-          </ul>
+          <div class="matrix-scroll">
+            <ul class="matrix-list">
+              {{range .MatrixMessages}}
+              <li>
+                <div><strong>{{.Sender}}</strong></div>
+                <div class="matrix-body">{{.Body}}</div>
+                <div class="muted">{{.Timestamp}}</div>
+              </li>
+              {{end}}
+            </ul>
+          </div>
         {{else}}
           <p class="muted">Keine Nachrichten gefunden.</p>
         {{end}}