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

refactored Record component into DreamRecord, updated routes and navigation for consistency, and integrated DreamRecord into Home.

Browse Source 
Signed-off-by: Matthias Puchstein <matthias@puchstein.bayern>
This commit is contained in:
Matthias Puchstein
2025-07-12 11:21:51 +02:00
parent 0cb192ef81
commit ff30258377
4 changed files with 12 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/pages/Home.tsx
View File

@@ -5,6 +5,7 @@ import {primaryMoodCategories, topDreamTopics} from '../data/MockDailyHighlights
import {getBackgroundStyle, getCardStyle, getTextStyle} from '../styles/StyleUtils';
import {formatDateFull, formatDateSimple} from '../utils/DateUtils';
import {NavLink} from 'react-router-dom';
import {DreamRecord} from "../components/DreamRecord.tsx";
export default function Home() {
const currentUser = MockUserMap.get(4); // Neo Quantum
@@ -51,6 +52,8 @@ export default function Home() {
</div>
</div>
<DreamRecord/>
{/* 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">

78
src/pages/Record.tsx
View File

@@ -1,78 +0,0 @@
import {getAccentStyle, getBackgroundStyle, getCardStyle, getTextStyle} from "../styles/StyleUtils.ts";
import {useState} from "react";
export function Record() {
const [inputMode, setInputMode] = useState<'text' | 'drawing'>('text');
return (
<div className={getCardStyle().className}
style={getCardStyle()}>
<div className="flex justify-between items-center mb-3">
<h3 className="font-bold dream-title">Neuer Traum</h3>
<div className="flex rounded-lg overflow-hidden" style={{border: '1px solid var(--accent-soft)'}}>
<button
className={`px-3 py-1 text-sm transition-all duration-200`}
onClick={() => setInputMode('text')}
style={getAccentStyle(false, inputMode === 'text')}
>
Text
</button>
<button
className={`px-3 py-1 text-sm transition-all duration-200`}
onClick={() => setInputMode('drawing')}
style={getAccentStyle(false, inputMode === 'drawing')}
>
Zeichnung
</button>
</div>
</div>
{inputMode === 'text' ? (
<textarea
className="w-full p-3 rounded-lg mb-3 transition-all duration-200"
rows={4}
placeholder="Beschreibe deinen Traum..."
style={{
...getBackgroundStyle('normal'),
...getTextStyle(),
border: '1px solid var(--accent-soft)'
}}
></textarea>
) : (
<div
className="w-full h-40 rounded-lg mb-3 flex items-center justify-center border-2 border-dashed transition-all duration-200"
style={{
...getBackgroundStyle('normal'),
borderColor: 'var(--accent-soft)'
}}>
<p style={getTextStyle('muted')}>Zeichne deinen Traum hier (Canvas-Platzhalter)</p>
</div>
)}
<div className="flex justify-between">
<div className="flex space-x-2">
<button className="p-2 rounded-full transition-all duration-200 hover:transform hover:scale-110"
style={getAccentStyle(true)}>
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24"
stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
d="M19 11a7 7 0 01-7 7m0 0a7 7 0 01-7-7m7 7v4m0 0H8m4 0h4m-4-8a3 3 0 01-3-3V5a3 3 0 116 0v6a3 3 0 01-3 3z"/>
</svg>
</button>
<button className="p-2 rounded-full transition-all duration-200 hover:transform hover:scale-110"
style={getAccentStyle(true)}>
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24"
stroke="currentColor">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2}
d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13"/>
</svg>
</button>
</div>
<button className="px-4 py-2 rounded-lg transition-all duration-200 hover:transform hover:scale-105"
style={getBackgroundStyle('accent-gradient')}>
Senden
</button>
</div>
</div>
);
}