"Refactor Mindicate mindmap Update for Mindate Mindous Mind mindmap Modifications in the Mind (feat/update to-mendments toughly, update forums ofthe mind-peed_induced.cetapane

This commit is contained in:
2025-05-02 19:16:34 +02:00
parent 304a399b85
commit f0c4c514c4
4 changed files with 479 additions and 9 deletions

View File

@@ -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);
}
</style>
{% endblock %}
@@ -657,7 +712,7 @@
{% for thought in thoughts %}
<div class="thought-item bg-opacity-70 rounded-xl overflow-hidden border transition-all duration-300 hover:transform hover:scale-105 hover:shadow-lg"
x-bind:class="darkMode ? 'bg-gray-800/80 border-gray-700/60' : 'bg-white/90 border-gray-200/60'">
<div class="p-5" style="border-left: 4px solid {{ thought.color_code|default('#B39DDB') }}">
<div class="p-5 thought-border" data-color="{{ thought.color_code|default('#B39DDB') }}">
<h3 class="text-xl font-bold mb-2"
x-bind:class="darkMode ? 'text-purple-300' : 'text-purple-700'">{{ thought.title }}</h3>
<p class="mb-4 text-sm"
@@ -876,7 +931,21 @@
// Entsprechenden Tab-Inhalt anzeigen
const tabId = this.getAttribute('data-tab');
document.getElementById(`${tabId}-tab`).classList.remove('hidden');
const tabContent = document.getElementById(`${tabId}-tab`);
if (tabContent) {
tabContent.classList.remove('hidden');
// Animation für Tab-Inhalt
tabContent.style.opacity = '0';
tabContent.style.transform = 'translateY(10px)';
setTimeout(() => {
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 = '<i class="fas fa-check mr-1"></i> 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;
}
});
});
</script>
{% endblock %}