feat(publications,standardization,ui): harmonize typography, active category border, and 5 representative highlights
- Refine Publications overview & category detail pages with clean typography and spacing - Add active border line (border-2 border-cobalt-dark) on active CategoryNav card - Replace 10 highlights with 5 designated representative publications - Add Patent subtitle '(IoT Architecture & Protocols, etc ...)' - Update Footer link label from 'College of IT Engineering' to 'CITE' - Clean up Standardization & Lectures page header kickers and spacing
This commit is contained in:
@@ -1,100 +1,52 @@
|
||||
import Link from "next/link";
|
||||
import { CategoryNav } from "./_components/CategoryNav";
|
||||
import { PUB_CATEGORIES } from "../../content/categories";
|
||||
import { publications, patents } from "../../content/publications";
|
||||
import { publications } from "../../content/publications";
|
||||
|
||||
export const metadata = {
|
||||
title: "Publications Overview | ANL",
|
||||
description: "AI 에이전트 네트워크 연구실(ANL) 연구 실적 개요 및 카테고리별 집계",
|
||||
title: "Publications | ANL",
|
||||
description: "AI Agent Networking Lab (ANL) research publications and patents overview",
|
||||
};
|
||||
|
||||
const REPRESENTATIVE_HIGHLIGHT_TITLES = [
|
||||
"Globally Integrated Trust Authority (GITA) for Resource-Constrained Edge Devices in IoT and 6G",
|
||||
"Application Level Trust Authority (APPLETA) for Resource-Constrained Edge Devices in IoT and 6G",
|
||||
"mQUIC: Use of QUIC for Handover Support with Connection Migration in Wireless/Mobile Networks",
|
||||
"Use of QUIC for CoAP Transport in IoT Networks",
|
||||
"Use of QUIC for Mobile-Oriented Future Internet (Q-MOFI)",
|
||||
];
|
||||
|
||||
export default function PublicationsIndexPage() {
|
||||
const totalPubCount = publications.length + patents.length;
|
||||
|
||||
// Sort publication records by publishedAt descending to select top 10 highlights
|
||||
const top10Highlights = [...publications]
|
||||
.sort((a, b) => (b.publishedAt || "").localeCompare(a.publishedAt || ""))
|
||||
.slice(0, 10);
|
||||
|
||||
const getCount = (slug: string) => {
|
||||
if (slug === "patent") return patents.length;
|
||||
return publications.filter((p) => p.category === slug).length;
|
||||
};
|
||||
// Selected 5 representative publications
|
||||
const highlights = REPRESENTATIVE_HIGHLIGHT_TITLES.map((title) =>
|
||||
publications.find(
|
||||
(p) => p.title.trim().toLowerCase() === title.trim().toLowerCase()
|
||||
)
|
||||
).filter((p): p is (typeof publications)[0] => Boolean(p));
|
||||
|
||||
return (
|
||||
<main className="container-content space-y-8 md:space-y-12 pt-10 md:pt-16 pb-16 md:pb-24">
|
||||
{/* Header section */}
|
||||
<section className="space-y-4">
|
||||
<div className="flex items-center gap-3">
|
||||
<span className="h-px w-8 bg-cobalt-dark" />
|
||||
<span className="font-mono text-xs font-bold uppercase tracking-widest text-cobalt-dark">
|
||||
BIBLIOGRAPHY & INTELLECTUAL PROPERTY
|
||||
</span>
|
||||
</div>
|
||||
<h1 className="headline-ko text-3xl sm:text-4xl text-ink font-bold">
|
||||
연구 실적 개요
|
||||
<main className="container-content py-8 sm:py-12 space-y-10 sm:space-y-14">
|
||||
{/* Page Header */}
|
||||
<section>
|
||||
<h1 className="font-serif text-4xl sm:text-5xl font-normal text-ink tracking-tight">
|
||||
PUBLICATIONS
|
||||
</h1>
|
||||
<p className="text-sm sm:text-base text-ink-mute max-w-3xl leading-relaxed">
|
||||
AI 에이전트 네트워크 연구실(ANL)의 학술 논문({publications.length}건)과 특허({patents.length}건)를 포함한 총 {totalPubCount}건의 연구 성과 집계 및 대표 실적 목록입니다.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
{/* Category Navigation */}
|
||||
<CategoryNav />
|
||||
|
||||
{/* Category Summary Cards */}
|
||||
<section className="grid gap-6 md:grid-cols-3">
|
||||
{PUB_CATEGORIES.map((cat) => {
|
||||
const count = getCount(cat.slug);
|
||||
return (
|
||||
<div
|
||||
key={cat.slug}
|
||||
className="flex flex-col justify-between border border-line bg-paper p-6 rounded-lg transition-colors hover:border-cobalt-dark group"
|
||||
>
|
||||
<div className="space-y-3">
|
||||
<span className="font-mono text-xs text-ink-mute uppercase tracking-wider">
|
||||
Category
|
||||
</span>
|
||||
<h2 className="headline-ko text-xl text-ink font-bold group-hover:text-cobalt-dark transition-colors">
|
||||
{cat.label}
|
||||
</h2>
|
||||
<p className="text-xs text-ink-mute leading-relaxed">
|
||||
{cat.desc}
|
||||
</p>
|
||||
</div>
|
||||
<div className="mt-6 pt-4 border-t border-line flex items-baseline justify-between">
|
||||
<span className="font-display text-3xl font-bold text-ink">
|
||||
{count}
|
||||
<span className="text-xs font-sans text-ink-mute ml-1 font-normal">건</span>
|
||||
</span>
|
||||
<Link
|
||||
href={`/publications/${cat.slug}`}
|
||||
className="inline-flex items-center text-xs font-bold text-vermillion-dark hover:underline"
|
||||
>
|
||||
전체 보기 →
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
<section className="pt-6 md:pt-8 border-t border-line">
|
||||
<CategoryNav />
|
||||
</section>
|
||||
|
||||
{/* Top 10 Highlights Section */}
|
||||
<section className="space-y-6 pt-6 border-t border-line">
|
||||
<div className="flex items-center justify-between">
|
||||
<h2 className="headline-ko text-2xl font-bold text-ink">
|
||||
최신 대표 실적 (Top 10 Highlights)
|
||||
</h2>
|
||||
<span className="font-mono text-xs text-ink-mute">
|
||||
RECENT HIGHLIGHTS
|
||||
</span>
|
||||
</div>
|
||||
{/* Highlights Section */}
|
||||
<section className="space-y-6 pt-6 md:pt-8 border-t border-line">
|
||||
<h2 className="font-serif text-2xl sm:text-3xl font-normal text-cobalt-dark">
|
||||
Highlights
|
||||
</h2>
|
||||
|
||||
<div className="divide-y divide-line border border-line bg-ivory rounded-lg overflow-hidden">
|
||||
{top10Highlights.map((pub, idx) => (
|
||||
<article key={`${pub.category}-${idx}`} className="p-5 hover:bg-paper/50 transition-colors space-y-2">
|
||||
<div className="divide-y divide-line border border-line bg-paper rounded-lg overflow-hidden shadow-sm">
|
||||
{highlights.map((pub, idx) => (
|
||||
<article key={`${pub.category}-${idx}`} className="p-5 hover:bg-ivory/60 transition-colors space-y-2">
|
||||
<div className="flex flex-wrap items-center gap-2 text-xs font-mono text-ink-mute">
|
||||
<span className="px-2 py-0.5 rounded bg-paper border border-line text-ink font-bold">
|
||||
<span className="px-2 py-0.5 rounded bg-ivory border border-line text-ink font-bold">
|
||||
{pub.publishedAt?.substring(0, 7) || "Recent"}
|
||||
</span>
|
||||
<span>·</span>
|
||||
@@ -102,11 +54,11 @@ export default function PublicationsIndexPage() {
|
||||
{pub.doi && (
|
||||
<>
|
||||
<span>·</span>
|
||||
<span className="text-vermillion">DOI: {pub.doi}</span>
|
||||
<span className="text-vermillion-dark">DOI: {pub.doi}</span>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
<h3 className="font-semibold text-base text-ink leading-snug">
|
||||
<h3 className="font-serif text-base font-normal text-ink leading-snug">
|
||||
{pub.title}
|
||||
</h3>
|
||||
{pub.authors && (
|
||||
@@ -115,7 +67,7 @@ export default function PublicationsIndexPage() {
|
||||
</p>
|
||||
)}
|
||||
{pub.venue && (
|
||||
<p className="text-xs italic text-ink-soft">
|
||||
<p className="text-xs italic text-ink-mute">
|
||||
{pub.venue}
|
||||
</p>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user