daarion-admin/microdao-daarion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add logo display in MicroDAO cards and hero section, add banner background support

Browse Source
This commit is contained in:
Apple
2025-12-01 04:34:26 -08:00
parent 0f32630733
commit 53f31adbf0
2 changed files with 42 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
apps/web/src/app/microdao/[slug]/page.tsx
View File

@@ -90,9 +90,18 @@ export default function MicrodaoDetailPage() {
</Link>
{/* Hero Section (TASK 037B) */}
<section className="rounded-3xl border border-white/10 bg-gradient-to-br from-sky-950/50 via-slate-900 to-black p-6 md:p-8 space-y-6 relative overflow-hidden shadow-2xl shadow-sky-900/10">
<section
className="rounded-3xl border border-white/10 bg-gradient-to-br from-sky-950/50 via-slate-900 to-black p-6 md:p-8 space-y-6 relative overflow-hidden shadow-2xl shadow-sky-900/10"
style={microdao.banner_url ? {
backgroundImage: `linear-gradient(to bottom, rgba(15, 23, 42, 0.85), rgba(15, 23, 42, 0.95)), url(${microdao.banner_url.startsWith('/') ? `/api/static${microdao.banner_url}` : microdao.banner_url.replace('/static/', '/api/static/')})`,
backgroundSize: 'cover',
backgroundPosition: 'center',
} : undefined}
>
{/* Background pattern */}
<div className="absolute inset-0 bg-[linear-gradient(to_right,#80808012_1px,transparent_1px),linear-gradient(to_bottom,#80808012_1px,transparent_1px)] bg-[size:24px_24px] opacity-20" />
{!microdao.banner_url && (
<div className="absolute inset-0 bg-[linear-gradient(to_right,#80808012_1px,transparent_1px),linear-gradient(to_bottom,#80808012_1px,transparent_1px)] bg-[size:24px_24px] opacity-20" />
)}
<div className="relative z-10 flex flex-col gap-6 md:flex-row md:items-start md:justify-between">
<div className="space-y-5 max-w-3xl">
@@ -132,11 +141,21 @@ export default function MicrodaoDetailPage() {
</span>
</div>
{/* Title & Description */}
{/* Title & Description with Logo */}
<div className="space-y-3">
<h1 className="text-3xl md:text-5xl font-bold text-white tracking-tight leading-tight">
{microdao.name}
</h1>
<div className="flex items-center gap-4">
{/* Logo */}
{microdao.logo_url && (
<img
src={microdao.logo_url.startsWith('/') ? `/api/static${microdao.logo_url}` : microdao.logo_url.replace('/static/', '/api/static/')}
alt={microdao.name}
className="w-16 h-16 md:w-20 md:h-20 rounded-2xl object-cover bg-slate-700/50 border border-white/10 shadow-lg"
/>
)}
<h1 className="text-3xl md:text-5xl font-bold text-white tracking-tight leading-tight">
{microdao.name}
</h1>
</div>
{microdao.description && (
<p className="text-base md:text-lg text-slate-300 leading-relaxed max-w-2xl">
{microdao.description}

17
apps/web/src/app/microdao/page.tsx
View File

@@ -91,6 +91,23 @@ export default function MicrodaoListPage() {
<div className="relative space-y-3">
{/* Title + Badges */}
<div className="flex items-start justify-between gap-3">
{/* Logo */}
<div className="shrink-0">
{m.logo_url ? (
<img
src={m.logo_url.startsWith('/') ? `/api/static${m.logo_url}` : m.logo_url.replace('/static/', '/api/static/')}
alt={m.name}
className="w-12 h-12 rounded-xl object-cover bg-slate-700/50"
onError={(e) => {
e.currentTarget.style.display = 'none';
e.currentTarget.nextElementSibling?.classList.remove('hidden');
}}
/>
) : null}
<div className={`w-12 h-12 rounded-xl bg-gradient-to-br from-violet-500/20 to-purple-500/20 flex items-center justify-center ${m.logo_url ? 'hidden' : ''}`}>
<Building2 className="w-6 h-6 text-violet-400" />
</div>
</div>
<div className="space-y-1 flex-1">
<div className="flex items-center gap-2">
<h2 className="font-semibold text-slate-100 group-hover:text-cyan-400 transition-colors">