refactor: resolve all 2nd round review feedback (C1-C9 & 3+2 magazine grid) for ANL lab transformation
This commit is contained in:
@@ -45,9 +45,9 @@
|
||||
| `ivory` | `#F5F1E8` | `--ivory` | 페이지 기본 배경(따뜻한 종이) |
|
||||
| `paper` | `#ECE6D6` | `--paper` | 인셋/호버용 어두운 종이 |
|
||||
| `line` | `#D8D1C0` | `--line` | 헤어라인 그리드 간격(`gap-px bg-line`) |
|
||||
| `vermillion` (DEFAULT) | `#D9342B` | `--vermillion` | **MCM 강조(Hot)** · 메타버스 · 저널 · 홀수 항목 |
|
||||
| `vermillion` (DEFAULT) | `#D9342B` | `--vermillion` | **Agent Eng / Orchestration 강조(Hot)** · 홀수 항목 |
|
||||
| `vermillion-dark` | `#A8231C` | — | vermillion 의 호버/심도(dim) 변형 |
|
||||
| `cobalt` (DEFAULT) | `#1B3A8A` | `--cobalt` | **QUIC 강조(Cool)** · 전송 · 학회 · 짝수 항목 |
|
||||
| `cobalt` (DEFAULT) | `#1B3A8A` | `--cobalt` | **MCP / A2A Protocol 강조(Cool)** · 짝수 항목 |
|
||||
| `cobalt-dark` | `#122863` | — | cobalt 의 호버/심도(dim) 변형 |
|
||||
| `brand`, `accent` | (별칭) | — | **레거시 호환 전용.** 신규 코드에서 사용 금지 |
|
||||
|
||||
@@ -62,9 +62,9 @@
|
||||
accent.ink → ink (주 잉크/텍스트)
|
||||
종이(paper) 계열 → ivory, paper, line
|
||||
accent.ko (국문) → headline-ko 클래스가 font-serif-ko 로 처리(색은 ink)
|
||||
accent.ko-warm(강조) → vermillion (Hot, MCM/저널)
|
||||
accent.ko-warm(강조) → vermillion (Hot, Agent Eng / Orchestration)
|
||||
accent.glow / dim → vermillion-dark / cobalt-dark (각 강조색의 dark 변형)
|
||||
QUIC 강조 → cobalt (Cool, 전송/학회)
|
||||
Protocol/A2A 강조 → cobalt (Cool, MCP / A2A Protocol)
|
||||
```
|
||||
|
||||
> 별도의 `accent.glow`(발광)나 중립 회색 팔레트는 현재 정의돼 있지 않습니다. 강조가
|
||||
@@ -246,7 +246,7 @@ Marquee(props: {
|
||||
|
||||
### `HeroComposition` — 추상 편집 히어로 (인트로 전용)
|
||||
|
||||
인라인 SVG 일러스트(에셋 없음). **MCM = 상호연결 노드 성좌(vermillion, `node-pulse`)**,
|
||||
인라인 SVG 일러스트(에셋 없음). **A2A = 에이전트 메시 노드 성좌(vermillion, `node-pulse`)**,
|
||||
**QUIC = 다중화 스트림 흐름(cobalt, `stream-dash`)**. 색은 CSS 변수 상속, 기하만 내부 정의.
|
||||
|
||||
```tsx
|
||||
@@ -269,7 +269,7 @@ HeroComposition(props: { className?: string })
|
||||
|
||||
| 라우트 | index | 잡지에서의 역할 | 특징 |
|
||||
| --- | --- | --- | --- |
|
||||
| `/intro` | 1 | **커버 스프레드** | 거대 한/영 히어로 + `HeroComposition` 아트, 키워드 `Marquee`, 통계, 풀쿼트, 두 Thrust 비교 스프레드 |
|
||||
| `/intro` | 1 | **커버 스프레드** | 거대 한/영 히어로 + `HeroComposition` 아트, 키워드 `Marquee`, 통계, 풀쿼트, 5대 연구 기둥 3+2 매거진 조판 그리드 |
|
||||
| `/members` | 2 | **기고자 페이지(Contributors)** | 인원 통계 카운터, PI 피처 스프레드, 박/석/학부 그룹을 헤어라인 그리드 + 교차 강조색으로 |
|
||||
| `/publications` | 3 | **목차/서지(Index & Bibliography)** | 서지 `Marquee`, 파생 통계, 번호 매긴 편집 목록(저널=vermillion, 학회=cobalt) |
|
||||
| `/lectures` | 4 | **강의 카탈로그(Course catalog)** | 3개 강의 카드(테두리·강조색 호버 면), 코드·KO/EN 제목·레벨 칩 |
|
||||
@@ -304,7 +304,7 @@ A. 강조색 2개(`vermillion`, `cobalt`)와 그 `-dark` 변형만 교체하면
|
||||
`tailwind.config.ts` 의 `theme.extend.colors` **와** `app/globals.css` 의 `:root`
|
||||
CSS 변수(`--vermillion`, `--cobalt`)를 **함께** 바꾸세요(그레인/그라디언트/SVG가 변수를
|
||||
참조). 종이 톤을 바꾸려면 `ivory`/`paper`/`line` 을 같은 방식으로 조정합니다. 의미
|
||||
페어링(vermillion=MCM, cobalt=QUIC)을 유지하면 페이지 전반의 강조색 배정 로직을
|
||||
페어링(vermillion=Agent Eng / Orchestration, cobalt=MCP / A2A Protocol)을 유지하면 페이지 전반의 강조색 배정 로직을
|
||||
건드리지 않아도 됩니다.
|
||||
|
||||
**Q. 모션 줄이기(prefers-reduced-motion) 대응은 되어 있나요?**
|
||||
|
||||
Reference in New Issue
Block a user