Verbessere die Funktionalität des Chat-Assistenten in app.py: Aktualisiere die Systemnachricht mit spezifischen Informationen zur Systades-Wissensdatenbank und erweitere die API-Nachrichtenformatierung. Füge Unterstützung für ausgewählte Elemente aus der Datenbank hinzu und erhöhe die maximale Tokenanzahl für detailliertere Antworten. Implementiere eine neue JavaScript-Datei für eine neuronale Netzwerk-Hintergrundanimation und verbessere die CSS-Stile für den Light Mode. Optimiere die Benutzeroberfläche und die Lesbarkeit in beiden Modi. Aktualisiere die Grundstile für eine konsistente Darstellung.

This commit is contained in:
2025-04-28 14:49:02 +02:00
parent 65c44ab371
commit 7a0533ac09
9 changed files with 2175 additions and 302 deletions

View File

@@ -35,6 +35,21 @@
--transition-fast: 150ms ease-in-out;
--transition-normal: 300ms ease-in-out;
--transition-slow: 500ms ease-in-out;
/* Light mode optimierte Farben */
--light-bg: #f9fafb;
--light-text: #1e293b;
--light-heading: #0f172a;
--light-primary: #3b82f6;
--light-primary-hover: #4f46e5;
--light-secondary: #6b7280;
--light-border: #e5e7eb;
--light-card-bg: rgba(255, 255, 255, 0.92);
--light-navbar-bg: rgba(255, 255, 255, 0.92);
--light-input-bg: #ffffff;
--light-input-border: #d1d5db;
--light-input-focus: #3b82f6;
--light-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}
/* Base Styles */
@@ -60,9 +75,9 @@ html.dark body {
}
/* Light Mode */
body {
background-color: var(--bg-primary-light);
color: var(--text-primary-light);
body:not(.dark) {
background-color: var(--light-bg);
color: var(--light-text);
}
/* Typography */
@@ -418,4 +433,94 @@ html.dark .mystical-dot {
html.dark :focus-visible {
outline-color: var(--accent-primary-dark);
}
/* Light Mode Überschriften */
body:not(.dark) h1,
body:not(.dark) h2,
body:not(.dark) h3,
body:not(.dark) h4,
body:not(.dark) h5,
body:not(.dark) h6 {
color: var(--light-heading);
}
/* Light Mode Links */
body:not(.dark) a {
color: var(--light-primary);
}
body:not(.dark) a:hover {
color: var(--light-primary-hover);
}
/* Light Mode Buttons */
body:not(.dark) .btn,
body:not(.dark) button:not(.toggle) {
background-color: var(--light-primary);
color: white;
border: none;
box-shadow: var(--light-shadow);
border-radius: 0.375rem;
padding: 0.5rem 1rem;
transition: all 0.3s ease;
}
body:not(.dark) .btn:hover,
body:not(.dark) button:not(.toggle):hover {
background-color: var(--light-primary-hover);
transform: translateY(-2px);
box-shadow: 0 6px 10px rgba(0, 0, 0, 0.1);
}
/* Light Mode Cards und Panels */
body:not(.dark) .card,
body:not(.dark) .panel {
background-color: var(--light-card-bg);
border: 1px solid var(--light-border);
border-radius: 0.5rem;
box-shadow: var(--light-shadow);
}
/* Light Mode Tabelle */
body:not(.dark) table {
background-color: var(--light-card-bg);
border-collapse: collapse;
}
body:not(.dark) th {
background-color: var(--light-bg);
color: var(--light-heading);
border-bottom: 1px solid var(--light-border);
}
body:not(.dark) td {
border-bottom: 1px solid var(--light-border);
}
/* Light Mode Inputs */
body:not(.dark) input,
body:not(.dark) textarea,
body:not(.dark) select {
background-color: var(--light-input-bg);
border: 1px solid var(--light-input-border);
color: var(--light-text);
border-radius: 0.375rem;
padding: 0.5rem;
}
body:not(.dark) input:focus,
body:not(.dark) textarea:focus,
body:not(.dark) select:focus {
border-color: var(--light-input-focus);
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
outline: none;
}
/* Navbar im Light Mode verbessern */
body:not(.dark) nav,
body:not(.dark) .navbar {
background-color: var(--light-navbar-bg);
box-shadow: var(--light-shadow);
border-bottom: 1px solid var(--light-border);
}