Match gallery layout to achievements spacing
This commit is contained in:
@@ -315,12 +315,8 @@ export default function GalleryPage() {
|
||||
releaseLabel={t('common.releaseToRefresh')}
|
||||
refreshingLabel={t('common.refreshing')}
|
||||
>
|
||||
<motion.section
|
||||
className="mx-0.5 space-y-2 rounded-3xl border border-pink-200/40 bg-white/90 p-2 shadow-sm backdrop-blur dark:border-white/10 dark:bg-slate-950/80"
|
||||
style={bodyFont ? { fontFamily: bodyFont, borderRadius: radius } : { borderRadius: radius }}
|
||||
{...containerMotion}
|
||||
>
|
||||
<motion.div {...fadeUpMotion}>
|
||||
<motion.div className="space-y-4 px-2 pb-14" {...containerMotion}>
|
||||
<motion.div className="space-y-2" style={bodyFont ? { fontFamily: bodyFont } : undefined} {...fadeUpMotion}>
|
||||
<div className="flex flex-wrap items-center justify-between gap-2">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="flex h-10 w-10 items-center justify-center rounded-full bg-pink-500/10 text-pink-500" style={{ borderRadius: radius }}>
|
||||
@@ -351,7 +347,7 @@ export default function GalleryPage() {
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
<div className="mt-2">
|
||||
|
||||
<FiltersBar
|
||||
value={filter}
|
||||
onChange={setFilter}
|
||||
@@ -359,14 +355,15 @@ export default function GalleryPage() {
|
||||
showPhotobooth={showPhotoboothFilter}
|
||||
styleOverride={{ borderRadius: radius, fontFamily: headingFont }}
|
||||
/>
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
{loading && (
|
||||
<motion.p className="px-1" {...fadeUpMotion}>
|
||||
{t('galleryPage.loading', 'Lade…')}
|
||||
</motion.p>
|
||||
)}
|
||||
<motion.div className="grid grid-cols-2 gap-3 pb-6 sm:grid-cols-3 lg:grid-cols-4" {...gridMotion}>
|
||||
|
||||
<motion.div className="grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4" {...gridMotion}>
|
||||
{list.map((p: GalleryPhoto) => {
|
||||
const imageUrl = normalizeImageUrl(p.thumbnail_path || p.file_path);
|
||||
const createdLabel = p.created_at
|
||||
@@ -479,7 +476,7 @@ export default function GalleryPage() {
|
||||
</motion.div>
|
||||
))}
|
||||
</motion.div>
|
||||
</motion.section>
|
||||
</motion.div>
|
||||
</PullToRefresh>
|
||||
</div>
|
||||
{currentPhotoIndex !== null && list.length > 0 && (
|
||||
|
||||
Reference in New Issue
Block a user