mpuchstein/REMind
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added dreamy gradient styles to index.css, expanded getBackgroundStyle for gradient types, introduced ChipCard component, updated Home with ChipCard, and refined layouts with consistent paddings and shadows

Browse Source 
Signed-off-by: Matthias Puchstein <matthias@puchstein.bayern>
This commit is contained in:
Matthias Puchstein
2025-07-12 12:32:58 +02:00
parent 153f5fd146
commit ccca533db6
10 changed files with 190 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/pages/Home.tsx
View File

@@ -7,6 +7,7 @@ import {NavLink} from 'react-router-dom';
import {DreamRecord} from "../components/DreamRecord.tsx";
import {DreamCardCompact} from "../components/DreamCardCompact.tsx";
import {DailyHighlights} from "../components/DailyHighlights.tsx";
import {ChipCard} from "../components/ChipCard.tsx";
export default function Home() {
const currentUser = MockUserMap.get(4); // Neo Quantum
@@ -57,8 +58,8 @@ export default function Home() {
{/* Personal Feed */}
<NavLink to='/feed'
className="block mb-3 transition-all duration-300 hover:transform hover:scale-[1.01] bg-gradient-to-br from-[rgba(166,77,255,0.35)] to-[rgba(213,0,249,0.35)] backdrop-blur-md rounded-xl shadow-lg dreamy-card">
<div className="p-3">
className="block mb-4 transition-all duration-300 hover:transform hover:scale-[1.01] bg-gradient-to-br from-[rgba(166,77,255,0.35)] to-[rgba(213,0,249,0.35)] backdrop-blur-md rounded-xl shadow-lg dreamy-card">
<div className="p-4">
<h3 className="font-bold mb-2 dream-title text-base">Deine letzten Träume</h3>
{personalDreams.length > 0 ? (
<div className="space-y-2">
@@ -80,8 +81,8 @@ export default function Home() {
{/* Friends Feed */}
<NavLink to='/feed'
className="block mb-3 transition-all duration-300 hover:transform hover:scale-[1.01] bg-gradient-to-br from-[rgba(166,77,255,0.35)] to-[rgba(213,0,249,0.35)] backdrop-blur-md rounded-xl shadow-lg dreamy-card">
<div className="p-3">
className="block mb-4 transition-all duration-300 hover:transform hover:scale-[1.01] bg-gradient-to-br from-[rgba(166,77,255,0.35)] to-[rgba(213,0,249,0.35)] backdrop-blur-md rounded-xl shadow-lg dreamy-card">
<div className="p-4">
<h3 className="font-bold mb-2 dream-title text-base">Träume von Freunden</h3>
<div className="space-y-2">
{friendsDreams.map((dream, index) => {
@@ -105,34 +106,8 @@ export default function Home() {
<DailyHighlights/>
</NavLink>
{/* Ad Banner */
}
<div
className={getCardStyle(true).className}
style={getBackgroundStyle('gradient')}>
<div className="flex flex-col sm:flex-row items-center">
<div
className="mb-4 sm:mb-0 sm:mr-4 transition-all duration-300 hover:transform hover:rotate-12">
<svg xmlns="http://www.w3.org/2000/svg" className="h-16 w-16" fill="none"
viewBox="0 0 24 24"
stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1}
d="M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/>
</svg>
</div>
<div>
<h3 className="font-bold text-lg mb-1">ReMind Sensor-Gerät</h3>
<p className="text-sm mb-2">Verbessere deine Traumerfahrung mit unserem Sensor
mit EEG,
Bewegungserkennung und Vitalzeichen-Überwachung.</p>
<div
className="mb-3 inline-block px-2 py-1 text-xs font-bold rounded transition-all duration-300 hover:transform hover:scale-105"
style={{backgroundColor: 'var(--accent-soft)', color: 'var(--text)'}}>
Pro-Funktionen: VR-Räume, Automatische Traumerkennung und Aufzeichnung
</div>
</div>
</div>
</div>
{/* Ad Banner */}
<ChipCard/>
</div>
)
;