Skip to content

Commit f3500bf

Browse files
brian033claude
brian033
and
claude
committed
content: use real research text, add track images, clean up UI
- Replace hallucinated research text with real content from old site - Add research track images for immunogenomics and multi-omics - Update MediaFrame to show real images with gradient fallback - Make details always visible (remove open/close toggle) - Move details below the grid so they span full width - Remove hallucinated research hero section - Remove Utility/Galaxy card from footer Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent 741917b commit f3500bf

10 files changed

Lines changed: 129 additions & 121 deletions

File tree

‎public/images/research-immunogenomics.png‎

88.2 KB
Loading

‎public/images/research-outcome.png‎

324 KB
Loading

‎src/components/layout/Footer.tsx‎

Lines changed: 19 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,27 @@
1-
import { siteContact, utilityNav } from "../../data/mock/site";
1+
import { siteContact } from "../../data/mock/site";
22

33
export function Footer() {
44
return (
55
<footer className="mt-16 border-t border-slate-200 bg-white/70" role="contentinfo">
6-
<div className="page-grid grid gap-10 py-10 lg:grid-cols-[1fr_auto]">
7-
<div>
8-
<p className="text-xs font-bold uppercase tracking-[0.25em] text-primary">Contact Us</p>
9-
<dl className="mt-6 space-y-4 text-sm text-slate-600">
10-
<div>
11-
<dt className="font-semibold text-slate-800">Tel</dt>
12-
<dd><a href={`tel:${siteContact.phone}`}>{siteContact.phone}</a></dd>
13-
</div>
14-
<div>
15-
<dt className="font-semibold text-slate-800">E-mail</dt>
16-
<dd>
17-
<a href={`mailto:${siteContact.email}`}>{siteContact.email}</a>
18-
<span className="ml-1 text-slate-500">({siteContact.contactPerson})</span>
19-
</dd>
20-
</div>
21-
<div>
22-
<dt className="font-semibold text-slate-800">Address</dt>
23-
<dd>{siteContact.addressLines.join(", ")}</dd>
24-
</div>
25-
</dl>
26-
</div>
27-
{utilityNav.length > 0 && (
28-
<div className="rounded-[1.75rem] border border-slate-200 bg-paper p-6">
29-
<p className="text-xs font-bold uppercase tracking-[0.25em] text-slate-500">Utility</p>
30-
<div className="mt-4 space-y-3">
31-
{utilityNav.map((item) => (
32-
<a key={item.to} href={item.to} className="block font-semibold text-navy hover:text-primary">
33-
{item.label}
34-
</a>
35-
))}
36-
</div>
6+
<div className="page-grid py-10">
7+
<p className="text-xs font-bold uppercase tracking-[0.25em] text-primary">Contact Us</p>
8+
<dl className="mt-6 space-y-4 text-sm text-slate-600">
9+
<div>
10+
<dt className="font-semibold text-slate-800">Tel</dt>
11+
<dd><a href={`tel:${siteContact.phone}`}>{siteContact.phone}</a></dd>
3712
</div>
38-
)}
13+
<div>
14+
<dt className="font-semibold text-slate-800">E-mail</dt>
15+
<dd>
16+
<a href={`mailto:${siteContact.email}`}>{siteContact.email}</a>
17+
<span className="ml-1 text-slate-500">({siteContact.contactPerson})</span>
18+
</dd>
19+
</div>
20+
<div>
21+
<dt className="font-semibold text-slate-800">Address</dt>
22+
<dd>{siteContact.addressLines.join(", ")}</dd>
23+
</div>
24+
</dl>
3925
</div>
4026
</footer>
4127
);

‎src/components/sections/BlogCardGrid.tsx‎

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,23 @@ export function BlogCardGrid() {
88
<SectionShell className="pt-10">
99
<div className="grid gap-5 md:grid-cols-2 xl:grid-cols-3">
1010
{blogPosts.map((post) => (
11-
<Card key={post.id} className="flex h-full flex-col rounded-[1.75rem] p-6">
12-
<p className="text-xs font-bold uppercase tracking-[0.22em] text-slate-500">{post.sourceHost}</p>
13-
<h2 className="mt-4 text-2xl">{post.title}</h2>
14-
<p className="mt-2 text-sm font-semibold text-primary">{post.author}</p>
15-
<p className="mt-4 flex-1 text-sm leading-7 text-slate-600">{post.summary}</p>
16-
<div className="mt-6">
17-
<ExternalLink href={post.href}>{post.ctaLabel}</ExternalLink>
11+
<Card key={post.id} className="flex h-full flex-col overflow-hidden rounded-[1.75rem]">
12+
{post.imageUrl && (
13+
<img
14+
src={post.imageUrl}
15+
alt={post.title}
16+
className="h-40 w-full object-cover"
17+
loading="lazy"
18+
/>
19+
)}
20+
<div className="flex flex-1 flex-col p-6">
21+
<p className="text-xs font-bold uppercase tracking-[0.22em] text-slate-500">{post.sourceHost}</p>
22+
<h2 className="mt-4 text-2xl">{post.title}</h2>
23+
<p className="mt-2 text-sm font-semibold text-primary">{post.author}</p>
24+
<p className="mt-4 flex-1 text-sm leading-7 text-slate-600">{post.summary}</p>
25+
<div className="mt-6">
26+
<ExternalLink href={post.href}>{post.ctaLabel}</ExternalLink>
27+
</div>
1828
</div>
1929
</Card>
2030
))}

‎src/components/sections/ResearchTrackSection.tsx‎

Lines changed: 10 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,4 @@
1-
import { useId, useState } from "react";
21
import type { ResearchTrack } from "../../types/content";
3-
import { ButtonLink } from "../ui/ButtonLink";
42
import { MediaFrame } from "../ui/MediaFrame";
53
import { SectionShell } from "../ui/SectionShell";
64
import { Tag } from "../ui/Tag";
@@ -10,12 +8,9 @@ type ResearchTrackSectionProps = {
108
};
119

1210
export function ResearchTrackSection({ track }: ResearchTrackSectionProps) {
13-
const [open, setOpen] = useState(false);
14-
const panelId = useId();
15-
1611
return (
1712
<SectionShell className="py-10 first:pt-8">
18-
<div className="grid gap-8 lg:grid-cols-[1fr_0.9fr] lg:items-start">
13+
<div className={`grid gap-8 ${track.image ? "lg:grid-cols-[1fr_0.9fr]" : ""} lg:items-start`}>
1914
<div>
2015
<Tag>{track.period}</Tag>
2116
<h2 className="mt-4 text-3xl sm:text-4xl">{track.title}</h2>
@@ -30,32 +25,16 @@ export function ResearchTrackSection({ track }: ResearchTrackSectionProps) {
3025
</span>
3126
))}
3227
</div>
33-
<button
34-
type="button"
35-
onClick={() => setOpen((value) => !value)}
36-
aria-expanded={open}
37-
aria-controls={panelId}
38-
className="mt-8 rounded-full border border-primary/20 bg-primary/5 px-5 py-3 text-sm font-semibold text-primary"
39-
>
40-
{open ? `Close research content for ${track.title}` : `Open research content for ${track.title}`}
41-
</button>
42-
{open ? (
43-
<div id={panelId} className="mt-6 space-y-4">
44-
{track.details.map((detail) => (
45-
<div key={detail.id} className="rounded-[1.5rem] border border-slate-200 bg-white p-5">
46-
<h3 className="text-xl">{detail.title}</h3>
47-
<p className="mt-3 text-sm leading-7 text-slate-600">{detail.copy}</p>
48-
</div>
49-
))}
50-
<div className="pt-2">
51-
<ButtonLink to="/publication" variant="secondary">
52-
Browse related publications
53-
</ButtonLink>
54-
</div>
55-
</div>
56-
) : null}
5728
</div>
58-
<MediaFrame label={track.mediaLabel} />
29+
{track.image ? <MediaFrame label={track.mediaLabel} image={track.image} /> : null}
30+
</div>
31+
<div className="mt-8 space-y-4">
32+
{track.details.map((detail) => (
33+
<div key={detail.id} className="rounded-[1.5rem] border border-slate-200 bg-white p-5">
34+
<h3 className="text-xl">{detail.title}</h3>
35+
<p className="mt-3 text-sm leading-7 text-slate-600">{detail.copy}</p>
36+
</div>
37+
))}
5938
</div>
6039
</SectionShell>
6140
);

‎src/components/ui/MediaFrame.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,18 @@
11
type MediaFrameProps = {
22
label: string;
3+
image?: string;
34
className?: string;
45
};
56

6-
export function MediaFrame({ label, className }: MediaFrameProps) {
7+
export function MediaFrame({ label, image, className }: MediaFrameProps) {
8+
if (image) {
9+
return (
10+
<div className={`overflow-hidden rounded-[2rem] border border-slate-200 shadow-soft ${className ?? ""}`}>
11+
<img src={image} alt={label} className="w-full" />
12+
</div>
13+
);
14+
}
15+
716
return (
817
<div
918
className={`relative overflow-hidden rounded-[2rem] border border-white/20 bg-gradient-to-br from-primary via-secondary to-navy p-8 shadow-soft ${className ?? ""}`}

0 commit comments

Comments
 (0)