Redesign upload archive page

2026-05-10 20:46:12 +09:00
parent 00e0fe60b4
commit f88ff4579e
3 changed files with 228 additions and 102 deletions
@@ -8,23 +8,30 @@
 </head>
 <body>
  <main class="upload-page">
-    <section class="hero">
-      <div class="hero__media" aria-hidden="true"></div>
-      <div class="hero__content">
-        <p class="eyebrow">Photo Request</p>
-        <h1>{{title}}</h1>
-        <p class="summary">이 링크 전체에서 총 {{maxMb}} MB까지 업로드할 수 있어.</p>
-      </div>
-    </section>
+    <section class="archive-card" aria-labelledby="archive-title">
+      <div class="archive-card__glow" aria-hidden="true"></div>
+      <img class="archive-card__art" src="/assets/hero.svg" alt="">

-    <section class="upload-panel">
-      <form method="post" action="/r/{{slug}}" enctype="multipart/form-data">
-        <label class="dropzone">
-          <span class="dropzone__title">사진이나 영상을 선택해줘</span>
-          <span class="dropzone__meta">허용 형식: {{allowedExts}}</span>
+      <div class="archive-card__copy">
+        <h1 id="archive-title">{{title}}</h1>
+        <p class="archive-card__subtitle">WEDDING ARCHIVE</p>
+      </div>
+
+      <form class="upload-panel" method="post" action="/r/{{slug}}" enctype="multipart/form-data">
+        <p class="upload-panel__today">당신이 본 오늘</p>
+
+        <label class="file-picker">
+          <span class="file-picker__label">사진 선택</span>
+          <span class="file-picker__meta">사진과 영상을 함께 올릴 수 있어</span>
          <input type="file" name="files" accept="{{accept}}" multiple required>
        </label>
-        <button type="submit">업로드</button>
+
+        <button class="upload-button" type="submit" aria-label="업로드">
+          <span>축하 사진</span>
+          <span>올리기</span>
+        </button>
+
+        <p class="upload-panel__note">총 {{maxMb}} MB까지 · {{allowedExts}}</p>
      </form>
    </section>
  </main>