yunchan/designpaca
1
0
Fork 0
Code Issues Pull requests Projects Releases 5 Packages Wiki Activity Actions

feat: strengthen design skill and refresh all showcases
Some checks failed
ci / build (push) Has been cancelled
Details

Browse source
This commit is contained in:
Yun Chan 2026-09-12 18:16:33 +09:00
parent 69e5cc1efd
commit e09d4efb1c
257 changed files with 8196 additions and 2374 deletions
Download patch file Download diff file Expand all files Collapse all files

57
apps/site/public/work/cask-archive/docent/index.html
View file

@ -9,10 +9,7 @@
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/webfontworld/naver/MaruBuri.css"
/>
<link rel="stylesheet" href="../styles/fonts.css?v=20260912all" />
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css"
@ -21,8 +18,9 @@
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap"
/>
<link rel="stylesheet" href="../styles/tokens.css" />
<link rel="stylesheet" href="../styles/main.css" />
<link rel="stylesheet" href="../styles/tokens.css?v=20260912all" />
<link rel="stylesheet" href="../styles/main.css?v=20260912all" />
<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='8' fill='%230B0B0D'/%3E%3Ccircle cx='16' cy='16' r='10' stroke='%23D99B38' stroke-width='2' fill='none'/%3E%3Cpath d='M16 8v16M8 16h16' stroke='%23D99B38' stroke-width='1.5'/%3E%3C/svg%3E" />
<style>
.breadcrumb-bar {
padding-top: var(--space-4);
@ -82,7 +80,7 @@
.course-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr));
gap: var(--space-5);
margin-top: var(--space-5);
}
@ -136,6 +134,7 @@
</style>
</head>
<body>
<a class="skip-link" href="#main-content">본문으로 건너뛰기</a>
<!-- Header (GNB SSOT) -->
<header class="site-head">
<div class="wrap head-inner">
@ -150,7 +149,7 @@
<a href="../index.html#subscribe">뉴스레터</a>
</nav>
<div class="head-actions">
<a href="#reservation-section" class="btn">도슨트 예약</a>
<a href="#reservation-section" class="btn">도슨트 세션</a>
</div>
</div>
</header>
@ -209,7 +208,7 @@
<!-- Sensory Wheel & Flavor Science -->
<section class="wrap" style="padding-bottom: var(--space-8);">
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: var(--space-8); align-items: center;">
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: var(--space-8); align-items: center;">
<div class="frame">
<img
src="../assets/aroma-wheel.webp"
@ -266,9 +265,9 @@
<table class="lineup-table">
<thead>
<tr>
<th>순서</th>
<th>라인업 구성</th>
<th>ABV</th>
<th scope="col">순서</th>
<th scope="col">라인업 구성</th>
<th scope="col">ABV</th>
</tr>
</thead>
<tbody>
@ -313,9 +312,9 @@
<table class="lineup-table">
<thead>
<tr>
<th>순서</th>
<th>라인업 구성</th>
<th>ABV</th>
<th scope="col">순서</th>
<th scope="col">라인업 구성</th>
<th scope="col">ABV</th>
</tr>
</thead>
<tbody>
@ -368,7 +367,7 @@
<!-- Gastronomy Pairing Atelier -->
<section class="wrap" style="padding-bottom: var(--space-8);">
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: var(--space-8); align-items: center;">
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); gap: var(--space-8); align-items: center;">
<div style="display: flex; flex-direction: column; gap: var(--space-4);">
<div class="eyebrow">미식 페어링</div>
<h2 style="font-size: var(--step-2); font-weight: 800; line-height: 1.25;">
@ -393,14 +392,15 @@
<!-- Live Reservation Form Section -->
<section class="wrap" style="padding-bottom: var(--space-8);" id="reservation-section">
<div class="card" style="max-width: 720px; margin: 0 auto;">
<div class="eyebrow" style="color: var(--accent); margin-bottom: 4px;">예약 신청</div>
<div class="eyebrow" style="color: var(--accent); margin-bottom: 4px;">세션 항목</div>
<h2 style="font-size: var(--step-2); font-weight: 800; margin-bottom: var(--space-4);">
도슨트 테이스팅 세션 실시간 예약
도슨트 테이스팅 세션 선택
</h2>
<form onsubmit="event.preventDefault(); alert('도슨트 예약 신청이 완료되었습니다! 24시간 이내에 전담 마스터가 유선 안내를 드립니다.');" style="display: flex; flex-direction: column; gap: var(--space-4);">
<p class="demo-notice" role="note">안내: 아래 예약 항목과 가격은 예시입니다. 입력 정보는 저장·전송되지 않으며 실제 예약으로 이어지지 않습니다.</p>
<form onsubmit="event.preventDefault(); alert('선택한 도슨트 세션을 확인했습니다. 실제 예약은 접수되지 않았으며 입력 정보는 저장하거나 전송하지 않습니다.');" style="display: flex; flex-direction: column; gap: var(--space-4);">
<div class="form-group">
<label class="form-label" for="courseSelect">선택 코스</label>
<select class="form-input" id="courseSelect" required>
<select class="form-input" id="courseSelect" name="courseSelect" required>
<option value="courseB">코스 B. 캐스크 스트렝스 & 빈티지 마스터 플라이트 (120,000원)</option>
<option value="courseA">코스 A. 독립병입자 입문 탐색 플라이트 (65,000원)</option>
</select>
@ -409,11 +409,11 @@
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3);">
<div class="form-group">
<label class="form-label" for="resDate">예약 일자</label>
<input type="date" class="form-input" id="resDate" value="2026-08-28" required />
<input type="date" class="form-input" id="resDate" name="reservationDate" autocomplete="off" required />
</div>
<div class="form-group">
<label class="form-label" for="resTime">예약 시간대</label>
<select class="form-input" id="resTime" required>
<select class="form-input" id="resTime" name="reservationTime" required>
<option>19:00 (1부)</option>
<option selected>20:30 (2부)</option>
<option>22:00 (3부 - 심야 세션)</option>
@ -424,21 +424,21 @@
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3);">
<div class="form-group">
<label class="form-label" for="userName">예약자 성함</label>
<input type="text" class="form-input" id="userName" value="정재훈" required />
<input type="text" class="form-input" id="userName" name="userName" autocomplete="name" required />
</div>
<div class="form-group">
<label class="form-label" for="userPhone">연락처</label>
<input type="tel" class="form-input" id="userPhone" value="010-8831-2094" required />
<input type="tel" class="form-input" id="userPhone" name="userPhone" autocomplete="tel" required />
</div>
</div>
<div class="form-group">
<label class="form-label" for="flavorNote">평소 선호하시는 위스키 취향 (선택)</label>
<input type="text" class="form-input" id="flavorNote" placeholder="예: 아일라 피트 위스키, 셰리 버트 숙성 선호" value="셰리 버트 숙성 & 80ppm 이상 헤비 피트 선호" />
<input type="text" class="form-input" id="flavorNote" name="flavorNote" autocomplete="off" placeholder="예: 아일라 피트 위스키, 셰리 버트 숙성 선호" />
</div>
<button type="submit" class="btn-primary" style="margin-top: var(--space-2); padding: 14px; font-size: var(--step-0);">
위스키 도슨트 세션 예약 확정 →
선택한 세션 내용 확인 →
</button>
</form>
</div>
@ -448,9 +448,8 @@
<!-- 푸터 (.site-foot SSOT) -->
<footer class="site-foot">
<div class="wrap foot-inner">
<p>캐스크 아카이브 · 서울 용산구 한남대로 27길 19 지하 1층</p>
<p class="muted">매일 18:00 – 02:00 (사전 예약제)</p>
<p class="muted">bottling@caskarchive.kr</p>
<p>캐스크 아카이브 · 독립병입 위스키 안내</p>
<p class="muted">이 페이지의 코스·가격·신청 흐름은 예시이며 입력 정보는 저장·전송되지 않습니다.</p>
</div>
</footer>
</body>