feat(ui): modernize footer layout, reorder metrics, and finalize English localization
- Modernize Footer with animated favicon logo symbol and pill-badge links - Reorder Footer contact block: Prof. Seok-Joo Koh -> email -> English address - Reorder home metrics: International Journals -> Standardization -> Patent - Add (IoT Architecture & Protocols) subtitle to Patent metric - Translate Header desktop masthead location to Daegu / South Korea - Clean up redundant flex classes and font colophon text
This commit is contained in:
@@ -68,26 +68,29 @@ export default function HomePage() {
|
||||
<div className="font-serif text-3xl text-cobalt-dark font-normal">
|
||||
{intlPubsCount}
|
||||
</div>
|
||||
<div className="font-mono text-xs text-ink-mute uppercase tracking-wider mt-1">
|
||||
<div className="font-mono text-xs text-ink-mute uppercase tracking-wider mt-1 leading-tight">
|
||||
International Journals & Conference
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="font-serif text-3xl text-cobalt-dark font-normal">
|
||||
{patentCount}
|
||||
</div>
|
||||
<div className="font-mono text-xs text-ink-mute uppercase tracking-wider mt-1">
|
||||
Patent
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="font-serif text-3xl text-cobalt-dark font-normal">
|
||||
{stdDocsCount}
|
||||
</div>
|
||||
<div className="font-mono text-xs text-ink-mute uppercase tracking-wider mt-1">
|
||||
<div className="font-mono text-xs text-ink-mute uppercase tracking-wider mt-1 leading-tight">
|
||||
Standardization Contributions
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="font-serif text-3xl text-cobalt-dark font-normal">
|
||||
{patentCount}
|
||||
</div>
|
||||
<div className="font-mono text-xs text-ink-mute uppercase tracking-wider mt-1 leading-tight">
|
||||
Patent<br />
|
||||
<span className="text-[0.68rem] tracking-normal font-sans normal-case text-ink-mute/80">
|
||||
(IoT Architecture & Protocols)
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -25,75 +25,136 @@ export default function Footer() {
|
||||
className="border-b border-line py-4 font-display text-lg tracking-wide text-ink/90"
|
||||
/>
|
||||
|
||||
<div className="container-content grid gap-12 py-16 lg:grid-cols-12">
|
||||
{/* Masthead title */}
|
||||
<div className="lg:col-span-5">
|
||||
<p className="kicker text-ink-mute">Colophon</p>
|
||||
<h3 className="font-display mt-3 text-2xl leading-snug text-ink">
|
||||
ANL
|
||||
</h3>
|
||||
<p className="font-display mt-1 text-xl italic text-ink-soft">
|
||||
AI Agent Networking Lab
|
||||
<div className="container-content grid gap-10 py-16 lg:grid-cols-12">
|
||||
{/* Brand Block */}
|
||||
<div className="lg:col-span-5 space-y-4">
|
||||
<Link
|
||||
href="/"
|
||||
className="group inline-flex items-center gap-3.5 shrink-0"
|
||||
>
|
||||
<div className="relative flex items-center justify-center w-10 h-10 rounded-xl overflow-hidden shadow-sm ring-1 ring-ink/10 group-hover:ring-cobalt/40 group-hover:shadow-md group-hover:scale-105 transition-all duration-300 shrink-0">
|
||||
<svg viewBox="0 0 32 32" className="w-full h-full" aria-hidden="true">
|
||||
<defs>
|
||||
<linearGradient id="footerLogoGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
||||
<stop offset="0%" stopColor="#4E77FF" />
|
||||
<stop offset="100%" stopColor="#2B4CDE" />
|
||||
</linearGradient>
|
||||
<radialGradient id="footerNodeGlow" cx="50%" cy="50%" r="50%">
|
||||
<stop offset="0%" stopColor="#FFD666" stopOpacity="1" />
|
||||
<stop offset="100%" stopColor="#FF9C1A" stopOpacity="0.8" />
|
||||
</radialGradient>
|
||||
</defs>
|
||||
<rect width="32" height="32" rx="7" fill="url(#footerLogoGrad)" />
|
||||
{/* Network Graph Edges */}
|
||||
<path
|
||||
d="M16 9 L9 22 M16 9 L23 22 M9 22 L23 22 M16 9 L16 17 M9 22 L16 17 M23 22 L16 17"
|
||||
stroke="#FFFFFF"
|
||||
strokeWidth="1.2"
|
||||
strokeOpacity="0.85"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
{/* Network Agent Outer Nodes */}
|
||||
<circle cx="16" cy="9" r="2.5" fill="#FFFFFF" />
|
||||
<circle cx="9" cy="22" r="2.5" fill="#FFFFFF" />
|
||||
<circle cx="23" cy="22" r="2.5" fill="#FFFFFF" />
|
||||
{/* Central Coordinating Hub Node */}
|
||||
<circle cx="16" cy="17" r="2.2" fill="url(#footerNodeGlow)" className="animate-pulse" />
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col leading-none">
|
||||
<span className="headline-ko text-xl font-bold tracking-tight text-ink group-hover:text-cobalt-dark transition-colors">
|
||||
ANL
|
||||
</span>
|
||||
<span className="kicker mt-1 transition-colors group-hover:text-cobalt-dark">
|
||||
AI Agent Networking LAB
|
||||
</span>
|
||||
</div>
|
||||
</Link>
|
||||
|
||||
<p className="text-xs sm:text-sm text-ink-mute leading-relaxed max-w-sm">
|
||||
Research on agent networking technologies and standard framework technologies for multi-AI agent orchestration.
|
||||
</p>
|
||||
<div className="mt-5 flex flex-wrap gap-x-4 gap-y-1 text-xs font-mono text-cobalt-dark">
|
||||
|
||||
<div className="pt-2 flex flex-wrap gap-2 text-xs font-mono">
|
||||
<a
|
||||
href="https://www.knu.ac.kr/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline"
|
||||
className="inline-flex items-center gap-1 px-2.5 py-1 rounded bg-ivory border border-line text-ink-soft hover:text-cobalt-dark hover:border-cobalt/40 transition-colors"
|
||||
>
|
||||
KNU ↗
|
||||
<span>KNU</span>
|
||||
<span className="text-[0.65rem] text-ink-mute">↗</span>
|
||||
</a>
|
||||
<a
|
||||
href="https://cse.knu.ac.kr/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline"
|
||||
className="inline-flex items-center gap-1 px-2.5 py-1 rounded bg-ivory border border-line text-ink-soft hover:text-cobalt-dark hover:border-cobalt/40 transition-colors"
|
||||
>
|
||||
CSE ↗
|
||||
<span>CSE</span>
|
||||
<span className="text-[0.65rem] text-ink-mute">↗</span>
|
||||
</a>
|
||||
<a
|
||||
href="https://it.knu.ac.kr/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="hover:underline"
|
||||
className="inline-flex items-center gap-1 px-2.5 py-1 rounded bg-ivory border border-line text-ink-soft hover:text-cobalt-dark hover:border-cobalt/40 transition-colors"
|
||||
>
|
||||
College of IT Engineering ↗
|
||||
<span>College of IT Engineering</span>
|
||||
<span className="text-[0.65rem] text-ink-mute">↗</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Contact */}
|
||||
<div className="lg:col-span-4">
|
||||
<p className="kicker text-ink-mute">Contact</p>
|
||||
<address className="mt-3 not-italic text-sm leading-relaxed text-ink-soft">
|
||||
Prof. Seok-Joo Koh<br />
|
||||
Room 527, Bldg. 415 (IT-5), College of IT Engineering<br />
|
||||
Kyungpook National University<br />
|
||||
80 Daehak-ro, Buk-gu, Daegu 41566, Republic of Korea<br />
|
||||
<a
|
||||
href="mailto:sjkoh@knu.ac.kr"
|
||||
className="draw-underline mt-2 inline-block text-ink hover:text-vermillion-dark font-medium"
|
||||
>
|
||||
sjkoh@knu.ac.kr
|
||||
</a>
|
||||
<div className="lg:col-span-4 space-y-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="h-px w-6 bg-cobalt-dark"></span>
|
||||
<p className="font-mono text-xs font-bold uppercase tracking-wider text-cobalt-dark">
|
||||
Contact
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<address className="not-italic text-sm leading-relaxed text-ink-soft space-y-2">
|
||||
<div>
|
||||
<div className="font-semibold text-ink">Prof. Seok-Joo Koh</div>
|
||||
<a
|
||||
href="mailto:sjkoh@knu.ac.kr"
|
||||
className="inline-block text-xs font-mono text-cobalt-dark hover:underline mt-0.5"
|
||||
>
|
||||
sjkoh@knu.ac.kr
|
||||
</a>
|
||||
</div>
|
||||
<div className="text-xs text-ink-mute leading-normal pt-1.5 border-t border-line/50">
|
||||
Room 527, Bldg. 415 (IT-5), College of IT Engineering<br />
|
||||
Kyungpook National University<br />
|
||||
80 Daehak-ro, Buk-gu, Daegu 41566, Republic of Korea
|
||||
</div>
|
||||
</address>
|
||||
</div>
|
||||
|
||||
{/* Index */}
|
||||
<div className="lg:col-span-3">
|
||||
<p className="kicker text-ink-mute">Index</p>
|
||||
<ul className="mt-3 space-y-2">
|
||||
{/* Navigation Index */}
|
||||
<div className="lg:col-span-3 space-y-3">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="h-px w-6 bg-cobalt-dark"></span>
|
||||
<p className="font-mono text-xs font-bold uppercase tracking-wider text-cobalt-dark">
|
||||
Index
|
||||
</p>
|
||||
</div>
|
||||
<ul className="space-y-1.5">
|
||||
{links.map((l, i) => (
|
||||
<li key={l.href} className="flex items-baseline gap-3">
|
||||
<span className="font-display text-xs text-ink-mute">
|
||||
{String(i + 1).padStart(2, "0")}
|
||||
</span>
|
||||
<li key={l.href}>
|
||||
<Link
|
||||
href={l.href}
|
||||
className="text-sm text-ink-soft transition hover:text-vermillion-dark"
|
||||
className="group flex items-center justify-between text-xs font-mono text-ink-soft hover:text-cobalt-dark transition-colors py-1 border-b border-line/40 hover:border-cobalt/40"
|
||||
>
|
||||
{l.en}
|
||||
<span className="font-sans text-sm text-ink-soft group-hover:text-cobalt-dark">
|
||||
{l.en}
|
||||
</span>
|
||||
<span className="text-[0.7rem] text-ink-mute group-hover:text-cobalt-dark">
|
||||
{String(i + 1).padStart(2, "0")} →
|
||||
</span>
|
||||
</Link>
|
||||
</li>
|
||||
))}
|
||||
@@ -106,7 +167,6 @@ export default function Footer() {
|
||||
<p className="text-xs text-ink-mute">
|
||||
© {new Date().getFullYear()} AI Agent Networking Lab (ANL) · School of Computer Science and Engineering, KNU. All rights reserved.
|
||||
</p>
|
||||
<p className="kicker text-ink-mute">Set in Fraunces · Noto Serif KR · Pretendard</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@@ -122,7 +122,7 @@ export default function Header() {
|
||||
<span className="kicker text-ink-mute">
|
||||
Kyungpook National University · School of Computer Science & Engineering
|
||||
</span>
|
||||
<span className="kicker">대구 · Daegu</span>
|
||||
<span className="kicker">Daegu / South Korea</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user