templates/index.html aktualisiert

This commit is contained in:
2026-03-04 19:37:16 +00:00
parent ed01acfc12
commit 6c4cc24cc2

View File

@@ -11,6 +11,7 @@
<link rel="stylesheet" href="/static/xterm.css" /> <link rel="stylesheet" href="/static/xterm.css" />
<script src="/static/xterm.js"></script> <script src="/static/xterm.js"></script>
<script src="/static/xterm-addon-fit.js"></script> <script src="/static/xterm-addon-fit.js"></script>
<script src="/static/marked.min.js"></script>
<style> <style>
.grid-stack { background: #0f172a; min-height: 100vh; } .grid-stack { background: #0f172a; min-height: 100vh; }
@@ -52,6 +53,25 @@
::-webkit-scrollbar { width: 6px; } ::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #1e293b; } ::-webkit-scrollbar-track { background: #1e293b; }
::-webkit-scrollbar-thumb { background: #475569; border-radius: 10px; } ::-webkit-scrollbar-thumb { background: #475569; border-radius: 10px; }
/* Styling für KI Markdown */
.markdown-content pre {
background: #000;
padding: 8px;
border-radius: 4px;
border: 1px solid #334155;
overflow-x: auto;
margin: 8px 0;
}
.markdown-content code {
font-family: monospace;
color: #4ade80; /* Ein schickes Grün für Inline-Code */
}
.markdown-content pre code { color: #fff; } /* Weiß für echten Code in der Box */
.markdown-content p { margin-bottom: 8px; }
.markdown-content ul { list-style-type: disc; margin-left: 20px; margin-bottom: 8px; }
.markdown-content ol { list-style-type: decimal; margin-left: 20px; margin-bottom: 8px; }
.markdown-content strong { color: #fff; font-weight: bold; }
</style> </style>
</head> </head>
<body class="bg-slate-950 text-white overflow-hidden"> <body class="bg-slate-950 text-white overflow-hidden">
@@ -190,7 +210,21 @@
function appendChat(user, msg, classes) { function appendChat(user, msg, classes) {
const win = document.getElementById('chat-window'); const win = document.getElementById('chat-window');
win.innerHTML += `<div class="mb-2"><span class="${classes}">${user}:</span> ${msg}</div>`;
// Fallback: Wenn `marked` nicht geladen ist, benutze den Rohtext
let formattedMsg = msg;
// Wenn die Nachricht von der KI kommt, parse das Markdown in HTML!
if (user === "KI" && typeof marked !== 'undefined') {
formattedMsg = marked.parse(msg);
}
win.innerHTML += `
<div class="mb-4">
<span class="${classes} block mb-1">${user}:</span>
<div class="markdown-content text-slate-300 text-sm leading-relaxed">${formattedMsg}</div>
</div>
`;
win.scrollTop = win.scrollHeight; win.scrollTop = win.scrollHeight;
} }