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

refined ProfilePage UI by improving spacing, aligning component structure, and reintroducing project information card for enriched profile context and presentation

Browse Source 
Signed-off-by: Matthias Puchstein <matthias@puchstein.bayern>
This commit is contained in:
Matthias Puchstein
2025-07-17 02:45:12 +02:00
parent 75f516b408
commit bb714e6fa2
1 changed files with 91 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/pages/ProfilePage.tsx
View File

@@ -13,8 +13,9 @@ const ProfilePage: React.FC = () => {
return (
<div className="page p-4 pb-20">
{/* Profile Card */}
<div
className="dreamy-border rounded-xl p-6 max-w-md mx-auto overflow-hidden"
className="dreamy-border rounded-xl p-6 max-w-md mx-auto overflow-hidden mb-10"
style={{
background: 'linear-gradient(135deg, rgba(166, 77, 255, 0.25), rgba(213, 0, 249, 0.25))',
backdropFilter: 'blur(10px)',
@@ -63,7 +64,9 @@ const ProfilePage: React.FC = () => {
<p className="text-sm sm:text-base font-medium" style={{color: 'var(--text)'}}>Days Streak</p>
</div>
</div>
</div>
{/* Account Settings (moved back into profile card) */}
<div className="mt-10">
<h3 className="dreamy-text text-lg mb-4 font-bold">Account Settings</h3>
<div
@@ -101,6 +104,50 @@ const ProfilePage: React.FC = () => {
</div>
</div>
</div>
{/* Project Information Card */}
<div
className="dreamy-border rounded-xl p-6 max-w-md mx-auto overflow-hidden"
style={{
background: 'linear-gradient(135deg, rgba(166, 77, 255, 0.25), rgba(213, 0, 249, 0.25))',
backdropFilter: 'blur(10px)',
boxShadow: '0 10px 30px var(--shadow), inset 0 0 15px rgba(166, 77, 255, 0.2)'
}}>
<h3 className="dreamy-text text-lg mb-4 font-bold text-center">Project Information</h3>
<div
className="dreamy-border rounded-lg p-5 text-left"
style={{
background: 'linear-gradient(135deg, rgba(166, 77, 255, 0.35), rgba(213, 0, 249, 0.35))',
boxShadow: '0 0 15px var(--shadow)',
backdropFilter: 'blur(5px)'
}}
>
<div className="py-2 border-b border-purple-100/30">
<p className="font-medium mb-1" style={{color: 'var(--text)'}}>Gitea Link:</p>
<a
href="https://gitea.puchstein.bayern/mpuchstein/REMind"
target="_blank"
rel="noopener noreferrer"
className="text-sm break-words hover:underline"
style={{color: 'var(--accent)'}}
>
https://gitea.puchstein.bayern/mpuchstein/REMind
</a>
</div>
<div className="py-2 border-b border-purple-100/30">
<p className="font-medium mb-1" style={{color: 'var(--text)'}}>Gruppenmitglieder:</p>
<p className="text-sm">Kim Anhäuser, Matthias Puchstein, Anya Zell</p>
</div>
<div className="py-2 border-b border-purple-100/30">
<p className="font-medium mb-1" style={{color: 'var(--text)'}}>Modul:</p>
<p className="text-sm">Einführung in die Text und Medienanalyse bei Prof. Dr. Rettiner und Dr. phil.
Ripoll</p>
</div>
<div className="py-2">
<p className="font-medium mb-1" style={{color: 'var(--text)'}}>Genutzte AI:</p>
<p className="text-sm">Perplexity, Junie, Veo, Imgen, Suno</p>
</div>
</div>
</div>
</div>
);