Add Drupal headless stack with Next.js frontend
- Add Next.js frontend service (nextjs) with Dockerfile and source - Update docker-compose.yml: image names, Drupal 11.3.3, nextjs service - Add docker-compose.override.yml.disabled for dev hot-reload - Add install-headless-modules.sh for OAuth/JSON:API module setup - Add README.md with full setup and configuration guide - Update nginx/Dockerfile and nginx.conf.template for cms. subdomain - Update drupal/Dockerfile PHP-FPM build args - Gitignore **/.vscode/ to prevent IDE workspace files from being tracked
This commit is contained in:
parent
71a8dac389
commit
f8b8f53d54
85 changed files with 7802 additions and 17 deletions
88
drupal/nextjs/components/home-projects.tsx
Normal file
88
drupal/nextjs/components/home-projects.tsx
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
import Link from "next/link"
|
||||
import Image from "next/image"
|
||||
import { ArrowUpRight } from "lucide-react"
|
||||
import { ScrollRevealCard } from "@/components/scroll-reveal-card"
|
||||
|
||||
const projects = [
|
||||
{
|
||||
title: "Böhler re:search",
|
||||
description:
|
||||
"Digital edition of the Munich art dealer Julius Böhler's object card system, photo folders and customer index (1903–1948). Research data on traded artworks, transactions and actors.",
|
||||
href: "https://boehler.zikg.eu/",
|
||||
icon: "/assets/icons/boehler-research.png",
|
||||
},
|
||||
{
|
||||
title: "Objektsprache und Ästhetik",
|
||||
description:
|
||||
"Shell collections at Leopoldina, Goldfuß-Museum Bonn, and Central Institute for Natural Collections MLU. Historical object references and synonym networks for conchylia.",
|
||||
href: "https://konchylien.leopoldina.org/sammlungen",
|
||||
icon: "/assets/logos/lzfw_logo.png",
|
||||
},
|
||||
{
|
||||
title: "SCS Manager",
|
||||
description:
|
||||
"Semantic Co-Working Space for academic university collections. Model, transform, analyse and publish data with JupyterLab, OpenRefine, WissKI and more.",
|
||||
href: "https://manager.scs.sammlungen.io/",
|
||||
icon: "/assets/icons/scs-manager.png",
|
||||
},
|
||||
{
|
||||
title: "WissKI",
|
||||
description:
|
||||
"Semantic data management system for GLAM institutions. Virtual research environment extending Drupal with CIDOC CRM, Pathbuilder and linked open data.",
|
||||
href: "https://wiss-ki.eu/",
|
||||
icon: "/assets/icons/wisski.svg",
|
||||
},
|
||||
]
|
||||
|
||||
export function HomeProjects() {
|
||||
return (
|
||||
<section className="home-projects py-10" aria-labelledby="projects-heading">
|
||||
<div className="home-projects-header mb-6 text-center">
|
||||
<h2
|
||||
id="projects-heading"
|
||||
className="home-projects-title mb-3 font-bold tracking-tight text-slate-900"
|
||||
style={{ fontSize: "var(--fluid-section-title)" }}
|
||||
>
|
||||
Projects
|
||||
</h2>
|
||||
<p
|
||||
className="home-projects-description mx-auto max-w-3xl text-slate-600"
|
||||
style={{ fontSize: "var(--fluid-hero-desc)" }}
|
||||
>
|
||||
Data- and information-focused websites and applications.
|
||||
</p>
|
||||
</div>
|
||||
<div className="home-projects-grid grid gap-8 sm:grid-cols-2">
|
||||
{projects.map((project) => (
|
||||
<ScrollRevealCard key={project.href}>
|
||||
<Link
|
||||
href={project.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="home-projects-card group block rounded-xl border border-slate-200 bg-white p-8 outline-none transition-all duration-200 ease-out hover:border-emerald-500/40 hover:shadow-lg focus-visible:ring-2 focus-visible:ring-emerald-600 focus-visible:ring-offset-2"
|
||||
>
|
||||
<h3 className="home-projects-card-title mb-2 flex items-center gap-3 text-xl font-semibold text-slate-900">
|
||||
<Image
|
||||
src={project.icon}
|
||||
alt=""
|
||||
width={24}
|
||||
height={24}
|
||||
className="size-6 shrink-0 object-contain"
|
||||
unoptimized
|
||||
/>
|
||||
{project.title}
|
||||
</h3>
|
||||
<p className="home-projects-card-description mb-4 text-slate-600">
|
||||
{project.description}
|
||||
</p>
|
||||
<span className="home-projects-card-link inline-flex items-center gap-2 text-sm font-medium text-emerald-600 transition-colors duration-200 ease-out group-hover:text-emerald-500">
|
||||
Visit project
|
||||
<ArrowUpRight className="size-4 transition-transform duration-200 ease-out group-hover:translate-x-0.5 group-hover:-translate-y-0.5" aria-hidden />
|
||||
</span>
|
||||
</Link>
|
||||
</ScrollRevealCard>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue