removed redundant media references from MockDreams data; updated DreamPage carousel container class for specificity and styled controls in App.css for improved UI consistencies

Signed-off-by: Matthias Puchstein <matthias@puchstein.bayern>
This commit is contained in:
2025-07-16 20:13:09 +02:00
parent 8df4c91907
commit b8e8057442
3 changed files with 35 additions and 12 deletions

View File

@@ -97,3 +97,37 @@
box-shadow: 0 15px 35px var(--shadow), inset 0 0 20px rgba(255, 255, 255, 0.3);
opacity: 1;
}
/* Carousel controls styling */
.carousel-container .slick-prev,
.carousel-container .slick-next {
z-index: 10;
width: 40px;
height: 40px;
background: rgba(166, 77, 255, 0.7);
border-radius: 50%;
display: flex !important;
align-items: center;
justify-content: center;
padding: 10px;
transition: all 0.3s ease;
}
.carousel-container .slick-prev {
left: 20px;
}
.carousel-container .slick-next {
right: 20px;
}
.carousel-container .slick-prev:hover,
.carousel-container .slick-next:hover {
background: rgba(166, 77, 255, 0.9);
}
.carousel-container .slick-prev:before,
.carousel-container .slick-next:before {
font-size: 20px;
opacity: 1;
}

View File

@@ -61,8 +61,6 @@ export const mockDreams: Dream[] = [new Dream({
description: 'I wandered through a glowing forest where every tree was made of shimmering crystal, reflecting thousands of stars above.',
} as ImageInput, ai: {
interpretation: 'The crystal forest represents clarity and the search for inner truth. The reflections of stars symbolize inspiration and the connection between your dreams and aspirations.',
audio: 'crystal_forest.mp3',
image: 'crystal_forest_ai.png',
},
}), new Dream({
id: 7, userId: 2, title: 'Mirror Lake', date: getRandomDateInRange(), input: {
@@ -72,8 +70,6 @@ export const mockDreams: Dream[] = [new Dream({
description: 'I stood at the edge of a silent lake, its surface so calm it looked like a perfect mirror, reflecting the moon and drifting clouds.',
} as ImageInput, ai: {
interpretation: 'The mirror lake suggests self-reflection and emotional calm. The moon and clouds indicate subconscious thoughts and the ever-changing nature of your feelings.',
video: 'mirror_lake_ai.mp4',
image: 'mirror_lake_ai.png',
},
}), new Dream({
id: 8, userId: 3, title: 'Floating City', date: getRandomDateInRange(), input: {
@@ -91,8 +87,6 @@ export const mockDreams: Dream[] = [new Dream({
input: 'Ich reiste durch einen Tunnel aus pulsierenden Datenströmen. Jede Berührung löste neue Realitäten aus, die sich wie Fraktale vor mir entfalteten.',
} as TextInput, ai: {
interpretation: 'Die Quantenreise symbolisiert deine Faszination für Möglichkeiten und Parallelwelten. Die Datenströme repräsentieren Informationsverarbeitung und Entscheidungsfindung in deinem Unterbewusstsein.',
image: 'quantum_journey.png',
video: 'quantum_journey.mp4',
}
}), new Dream({
id: 10, userId: 4, title: 'Neuronales Netzwerk', date: getRandomDateInRange(), input: {
@@ -100,8 +94,6 @@ export const mockDreams: Dream[] = [new Dream({
input: 'Ich befand mich in einem riesigen neuronalen Netzwerk, wo Gedanken als leuchtende Impulse zwischen synaptischen Verbindungen tanzten. Ich konnte sie mit meinen Händen formen und lenken.',
} as TextInput, ai: {
interpretation: 'Das neuronale Netzwerk spiegelt dein Interesse an künstlicher Intelligenz und dem menschlichen Bewusstsein wider. Die Fähigkeit, Gedanken zu formen, deutet auf deinen Wunsch nach Kontrolle über deine mentalen Prozesse hin.',
image: 'neural_network.png',
audio: 'neural_network.mp3',
}
}), new Dream({
id: 11, userId: 4, title: 'Digitaler Garten', date: getRandomDateInRange(), input: {
@@ -111,7 +103,6 @@ export const mockDreams: Dream[] = [new Dream({
description: 'Ich pflegte einen Garten, in dem Pflanzen aus Codezeilen und Algorithmen wuchsen. Jede Blüte entfaltete sich zu einer neuen Technologie.',
} as ImageInput, ai: {
interpretation: 'Der digitale Garten verkörpert deine kreative Verbindung von Natur und Technologie. Er zeigt, wie du Innovation als organischen, wachsenden Prozess betrachtest.',
image: 'digital_garden_ai.png',
}
}), new Dream({
id: 12, userId: 4, title: 'Zeitschleife', date: getRandomDateInRange(), input: {
@@ -119,8 +110,6 @@ export const mockDreams: Dream[] = [new Dream({
input: 'Ich erlebte denselben Tag immer wieder, konnte aber jedes Mal kleine Änderungen vornehmen. Mit jeder Iteration wurde die Realität komplexer und unvorhersehbarer.',
} as TextInput, ai: {
interpretation: 'Die Zeitschleife reflektiert deine Gedanken über Kausalität und die Auswirkungen kleiner Entscheidungen. Sie symbolisiert auch den Wunsch, Fehler zu korrigieren und verschiedene Möglichkeiten zu erkunden.',
image: 'time_loop.png',
audio: 'time_loop.mp3',
}
}),

View File

@@ -97,7 +97,7 @@ export default function DreamPage() {
speed={500}
slidesToShow={1}
slidesToScroll={1}
className="max-w-full mx-auto"
className="max-w-full mx-auto carousel-container"
>
<div className="flex justify-center px-2">
<img