diff --git a/static/js/modules/mindmap.js b/static/js/modules/mindmap.js index 7ae6be2..e5eba3a 100644 Binary files a/static/js/modules/mindmap.js and b/static/js/modules/mindmap.js differ diff --git a/templates/base.html b/templates/base.html index d4bd0a0..83c5e83 100644 --- a/templates/base.html +++ b/templates/base.html @@ -206,10 +206,10 @@ /* Light Mode Buttons */ body:not(.dark) .btn, body:not(.dark) button:not(.toggle) { - background: linear-gradient(135deg, #6d28d9, #5b21b6); + background: linear-gradient(135deg, #7c3aed, #6d28d9); color: white !important; border: none; - box-shadow: 0 2px 4px rgba(91, 33, 182, 0.25); + box-shadow: 0 2px 4px rgba(124, 58, 237, 0.25); border-radius: 8px; padding: 0.625rem 1.25rem; transition: all 0.2s ease; @@ -220,22 +220,22 @@ body:not(.dark) .btn:hover, body:not(.dark) button:not(.toggle):hover { - background: linear-gradient(135deg, #7c3aed, #6d28d9); + background: linear-gradient(135deg, #8b5cf6, #7c3aed); transform: translateY(-1px); - box-shadow: 0 4px 12px rgba(109, 40, 217, 0.3); + box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3); color: white !important; } /* KI-Chat Button im Light-Mode */ body:not(.dark) [onclick*="MindMap.assistant.toggleAssistant"] { - background: linear-gradient(135deg, #7c3aed, #3b82f6); + background: linear-gradient(135deg, #7c3aed, #4f46e5); color: white !important; font-weight: 500; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } body:not(.dark) [onclick*="MindMap.assistant.toggleAssistant"]:hover { - background: linear-gradient(135deg, #8b5cf6, #4f46e5); + background: linear-gradient(135deg, #8b5cf6, #6366f1); box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3); } @@ -374,7 +374,7 @@ class="absolute w-5 h-5 rounded-full bg-white shadow-md transform transition-transform duration-300" :class="darkMode ? 'translate-x-7' : 'translate-x-1'" > - {{ darkMode ? 'Zum Light Mode wechseln' : 'Zum Dark Mode wechseln' }} + {% if current_user.is_authenticated %} diff --git a/templates/edit_mindmap.html b/templates/edit_mindmap.html index e69de29..ac06fa0 100644 --- a/templates/edit_mindmap.html +++ b/templates/edit_mindmap.html @@ -0,0 +1,318 @@ +{% extends "base.html" %} + +{% block title %}Mindmap bearbeiten{% endblock %} + +{% block extra_css %} + +{% endblock %} + +{% block content %} +
+
+ +
+

+ Mindmap bearbeiten +

+

Aktualisiere die Details deiner Mindmap

+
+ +
+
+

Mindmap-Details

+
+ +
+
+
+ + +
+ +
+ + +
+ +
+
+ + + Private Mindmap (nur für dich sichtbar) +
+
+ +
+ + + Zurück + + +
+
+
+
+ + +
+

+ Tipps zum Bearbeiten einer Mindmap +

+
+
    +
  • Überprüfe, ob der Name noch zum aktuellen Inhalt passt
  • +
  • Aktualisiere die Beschreibung, um neue Aspekte zu berücksichtigen
  • +
  • Entscheide, ob die Sichtbarkeitseinstellungen noch passend sind
  • +
  • Nutze aussagekräftige Namen für bessere Auffindbarkeit
  • +
  • Behalte die Konsistenz mit verknüpften Konzepten im Auge
  • +
+
+
+
+
+{% endblock %} + +{% block extra_js %} + +{% endblock %} \ No newline at end of file diff --git a/templates/profile.html b/templates/profile.html index 8696cf3..83cfada 100644 --- a/templates/profile.html +++ b/templates/profile.html @@ -518,6 +518,61 @@ transform: translateY(-2px); box-shadow: 0 4px 12px rgba(109, 40, 217, 0.25); } + + /* Thought item styling */ + .thought-border { + border-left: 4px solid #B39DDB; + } + + /* Light Mode Gedanken */ + body:not(.dark) .thought-item { + background-color: white; + border-color: rgba(0, 0, 0, 0.1); + } + + body:not(.dark) .thought-item h3 { + color: #6d28d9; + } + + body:not(.dark) .thought-item p { + color: #4b5563; + } + + /* Verbesserte Kontraste im Light-Mode */ + body:not(.dark) .profile-tab.active { + color: #7c3aed; + border-bottom-color: #7c3aed; + background-color: rgba(124, 58, 237, 0.1); + } + + body:not(.dark) .profile-tab:hover:not(.active) { + color: #6d28d9; + background-color: rgba(124, 58, 237, 0.05); + } + + body:not(.dark) .nav-link-light { + color: #4b5563; + } + + body:not(.dark) .nav-link-light:hover { + color: #1f2937; + } + + body:not(.dark) .edit-profile-btn { + background: #7c3aed; + color: white; + padding: 0.5rem 1rem; + border-radius: 0.5rem; + font-weight: 500; + transition: all 0.2s ease; + border: none; + } + + body:not(.dark) .edit-profile-btn:hover { + background: #6d28d9; + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(109, 40, 217, 0.25); + } {% endblock %} @@ -657,7 +712,7 @@ {% for thought in thoughts %}
-
+

{{ thought.title }}

{ + tabContent.style.transition = 'all 0.3s ease'; + tabContent.style.opacity = '1'; + tabContent.style.transform = 'translateY(0)'; + }, 50); + } }); }); @@ -902,6 +971,89 @@ countElement.textContent = count; }); }); + + // Profilbearbeitung + const editProfileBtn = document.querySelector('.edit-profile-btn'); + + if (editProfileBtn) { + editProfileBtn.addEventListener('click', function() { + // Zum Einstellungstab wechseln + const settingsTab = document.querySelector('[data-tab="settings"]'); + if (settingsTab) { + settingsTab.click(); + } + }); + } + + // Einstellungen-Formular-Handling + const settingsForm = document.querySelector('.settings-card form'); + const saveSettingsBtn = document.querySelector('.settings-card .profile-action-btn.primary'); + + if (saveSettingsBtn && !settingsForm) { + saveSettingsBtn.addEventListener('click', function() { + // Sammle Daten aus den Eingabefeldern + const formData = new FormData(); + formData.append('action', 'update_profile'); + formData.append('bio', document.getElementById('bio').value); + formData.append('location', document.getElementById('location').value); + formData.append('website', document.getElementById('website').value || ''); + + // AJAX-Anfrage senden + fetch('{{ url_for("settings") }}', { + method: 'POST', + body: formData, + credentials: 'same-origin' + }) + .then(response => response.json()) + .catch(error => { + console.error('Fehler beim Speichern der Profileinstellungen:', error); + }) + .then(data => { + // Erfolgsanimation + const originalText = this.innerHTML; + this.innerHTML = ' Gespeichert'; + + setTimeout(() => { + this.innerHTML = originalText; + }, 2000); + }); + }); + } + + // Mindmap-Karten mit Hover-Effekten + const mindmapItems = document.querySelectorAll('.mindmap-item'); + mindmapItems.forEach(item => { + item.addEventListener('mouseenter', () => { + item.style.transform = 'translateY(-5px)'; + item.style.boxShadow = '0 12px 30px rgba(0, 0, 0, 0.15)'; + }); + + item.addEventListener('mouseleave', () => { + item.style.transform = 'translateY(0)'; + item.style.boxShadow = 'none'; + }); + }); + + // Gedanken-Karten mit Hover-Effekten und Border-Farben + const thoughtItems = document.querySelectorAll('.thought-item'); + thoughtItems.forEach(item => { + // Hover-Effekte + item.addEventListener('mouseenter', () => { + item.style.transform = 'translateY(-5px)'; + item.style.boxShadow = '0 12px 30px rgba(0, 0, 0, 0.15)'; + }); + + item.addEventListener('mouseleave', () => { + item.style.transform = 'translateY(0)'; + item.style.boxShadow = 'none'; + }); + + // Border-Farben anwenden + const borderElem = item.querySelector('.thought-border'); + if (borderElem && borderElem.dataset.color) { + borderElem.style.borderLeftColor = borderElem.dataset.color; + } + }); }); {% endblock %} \ No newline at end of file