wow

2026-09-09 14:45:26 +09:00 · 2026-09-09 14:45:26 +09:00 · 7676e7f7dc
commit 7676e7f7dc
parent 5403448f63
6 changed files with 109 additions and 40 deletions
--- a/src/pages/Carrer.astro
+++ b/src/pages/Carrer.astro
@ -0,0 +1,64 @@
+---
+import Header from "@/components/Header.astro";
+import "@/globals.css";
+---
+
+<html lang="ko">
+    <head>
+        <meta charset="utf-8" />
+        <link rel="icon" href="/favicon.ico" />
+        <meta name="viewport" content="width=device-width" />
+        <meta name="color-scheme" content="light dark" />
+        <meta name="theme-color" content="#fcf8f9" />
+        <title>Carrer | 남현석</title>
+        <meta name="description" content="남현석의 경력 및 활동 기록" />
+    </head>
+    <body class="m-0 min-w-[320px] bg-background font-sans text-foreground">
+        <Header />
+
+        <main class="min-h-svh px-6 pb-12 pt-[104px] sm:px-10 lg:px-16">
+            <div class="mx-auto flex max-w-6xl flex-col gap-8">
+                <div class="flex items-end justify-between gap-6">
+                    <div>
+                        <p class="mb-3 text-sm font-semibold tracking-[0.18em] text-foreground/45 uppercase">
+                            Portfolio
+                        </p>
+                        <h1 class="m-0 text-4xl font-bold tracking-tight sm:text-6xl">
+                            Carrer<span class="text-foreground/30">.</span>
+                        </h1>
+                    </div>
+                    <a
+                        href="/Carrer.pdf"
+                        target="_blank"
+                        rel="noreferrer"
+                        class="shrink-0 rounded-full border border-border px-4 py-2 text-sm font-semibold text-foreground no-underline transition-colors hover:bg-foreground hover:text-background"
+                    >
+                        새 창에서 열기
+                    </a>
+                </div>
+
+                <div class="overflow-hidden rounded-3xl border border-border bg-muted p-2 shadow-[0_24px_80px_rgba(44,20,35,0.12)] sm:p-4">
+                    <object
+                        data="/Carrer.pdf#view=FitH"
+                        type="application/pdf"
+                        class="h-[calc(100svh-220px)] min-h-[560px] w-full rounded-2xl bg-white"
+                    >
+                        <div class="flex min-h-[560px] flex-col items-center justify-center gap-4 rounded-2xl bg-background p-8 text-center">
+                            <p class="m-0 text-foreground/70">
+                                이 브라우저에서는 PDF 미리보기를 지원하지
+                                않습니다.
+                            </p>
+                            <a
+                                href="/Carrer.pdf"
+                                download
+                                class="rounded-full bg-foreground px-5 py-3 text-sm font-semibold text-background no-underline"
+                            >
+                                PDF 다운로드
+                            </a>
+                        </div>
+                    </object>
+                </div>
+            </div>
+        </main>
+    </body>
+</html>