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:
34
src/App.css
34
src/App.css
@@ -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;
|
||||
}
|
||||
|
@@ -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',
|
||||
}
|
||||
}),
|
||||
|
||||
|
@@ -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
|
||||
|
Reference in New Issue
Block a user