refined DreamCardCompact
layout by restructuring user display, simplifying spacing, and improving alignment for better visual balance
Signed-off-by: Matthias Puchstein <matthias@puchstein.bayern>
This commit is contained in:
@@ -22,9 +22,9 @@ export const DreamCardCompact = ({dream, index, showUser = false, user}: DreamCa
|
||||
boxShadow: '0 8px 20px var(--shadow), inset 0 0 10px rgba(166, 77, 255, 0.2)',
|
||||
border: '1px solid rgba(166, 77, 255, 0.1)'
|
||||
}}>
|
||||
<div className="flex items-center justify-between mb-1">
|
||||
<div className="flex flex-col mb-1">
|
||||
{showUser && user && (
|
||||
<div className="pl-2" style={{width: '120px', minWidth: '120px'}}>
|
||||
<div className="flex justify-center mb-2">
|
||||
<div className="flex items-center">
|
||||
<div
|
||||
className="w-8 h-8 rounded-full mr-2 flex items-center justify-center overflow-hidden border-2"
|
||||
@@ -46,14 +46,12 @@ export const DreamCardCompact = ({dream, index, showUser = false, user}: DreamCa
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex-1 text-center">
|
||||
<div className="text-center">
|
||||
<h4 className="font-medium dream-title text-xs leading-tight">{dream.title}</h4>
|
||||
<p className="text-xs text-[var(--text-muted)] mt-0.5 opacity-80">
|
||||
{formatDateSimple(dream.date)}
|
||||
</p>
|
||||
</div>
|
||||
{/* Add an empty div to balance the layout when user is shown */}
|
||||
{showUser && user && <div className="invisible" style={{width: '120px', minWidth: '120px'}}></div>}
|
||||
</div>
|
||||
</div>
|
||||
</NavLink>
|
||||
|
Reference in New Issue
Block a user