Mina Choi
64ce467f21
도메인별 스키마(company·place·fact·local·site·job)를 걷어내고 public 한 벌로 폈다.
스키마 한정자가 붙은 순간부터 ORM·raw SQL·테스트 픽스처가 각자 그 이름을 들고 다녀야 했다.
- 공용 콘텐츠를 한 테이블로 되돌린다. spots·region_stories 를 따로 파 놓고 보니
같은 성격이 세 곳으로 갈라져 있었다 — `area_contents` 가 처음부터 content_type 으로
종류를 가르는 설계였고 그걸 쓰면 됐다. 관계(거리·숨김)만 `place_area_refs` 로 남긴다.
- migrations/ + scripts/migrate.py: `init.sql` 은 **DB 를 처음 만들 때만** 돈다. 파일에
컬럼을 더해도 이미 데이터가 든 DB 에는 반영되지 않는다 — 실제로 TourAPI 가 주변 정보를
받아 와도 저장할 곳이 없어 축제·맛집이 0건이었고, 화면에는 "그냥 안 나오는 것" 으로만 보였다.
DECISIONS.md 가 예고한 그대로다("운영 DB 가 생기는 순간 다시 필요해진다").
Alembic 을 쓰지 않는 이유는 스키마 정의가 이미 두 곳(ORM·init.sql)이라 세 번째를
더하면 어긋날 자리가 하나 더 생기기 때문이다.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
111 lines
4.9 KiB
CSS
111 lines
4.9 KiB
CSS
@import "tailwindcss";
|
|
@import "@o2o/shared/styles/base.css";
|
|
/* 시안 토큰·유틸(타이포·.shell·.h2·.panel·슬라이더)은 캔버스와 한 파일을 쓴다.
|
|
★ 값을 두 곳에 적으면 한쪽만 고쳐지고 에디터와 발행본이 다시 갈라진다. */
|
|
@import "@o2o/shared/styles/site.css";
|
|
|
|
/*
|
|
* 발행 사이트의 디자인 토큰.
|
|
*
|
|
* 색·서체·모서리·테두리·여백은 전부 사장님이 고른 템플릿에서 온다. 프리렌더가 <head> 에
|
|
* `--tpl-*` 를 심고(`seo/head.ts` themeStyle) 여기서 Tailwind 토큰으로 연결한다.
|
|
* 관리자 토큰(tokens.css)은 이 앱에 들어오지 않는다 — 두 색 체계를 섞지 않는다.
|
|
*
|
|
* ★ 이 파일에 하드코딩된 색을 두지 않는다. 아래 :root 값은 <head> 주입이 없는
|
|
* 개발 서버(`npm run dev:site`)용 폴백이다.
|
|
*/
|
|
:root {
|
|
--tpl-primary: #18181b;
|
|
--tpl-secondary: #52525b;
|
|
--tpl-bg: #ffffff;
|
|
--tpl-card: #fafafa;
|
|
--tpl-text: #09090b;
|
|
--tpl-accent: #2563eb;
|
|
--tpl-surface: #ffffff;
|
|
--tpl-surface-alt: #f5f5f4;
|
|
--tpl-inverse: #1c1917;
|
|
--tpl-border: #e7e5e4;
|
|
|
|
/*
|
|
* 생김새 폴백 = '심플' 템플릿(admin `industryData.ts` 의 LOOK.simple).
|
|
* ★ 예전엔 서체 폴백이 명조였다. 발행 잡은 이제 항상 look 을 실어 보내지만
|
|
* (backend `_DEFAULT_LOOK`), 개발 서버에는 <head> 주입이 없어 이 값이 곧 화면이 된다 —
|
|
* 폴백이 제품 기본값과 다르면 개발자가 보는 것과 손님이 보는 것이 갈린다.
|
|
*/
|
|
--tpl-font-heading: 'Pretendard Variable', 'Noto Sans KR', system-ui, sans-serif;
|
|
--tpl-font-body: 'Pretendard Variable', 'Noto Sans KR', system-ui, sans-serif;
|
|
--tpl-radius: 0.75rem;
|
|
--tpl-border-width: 1px;
|
|
--tpl-shadow: 0 1px 2px rgb(0 0 0 / 0.06);
|
|
--tpl-heading-tracking: -0.02em;
|
|
--tpl-heading-weight: 700;
|
|
--tpl-section-space: 4rem;
|
|
}
|
|
|
|
@theme inline {
|
|
--color-brand: var(--tpl-primary);
|
|
--color-brand-soft: var(--tpl-secondary);
|
|
--color-surface: var(--tpl-bg);
|
|
--color-surface-alt: var(--tpl-card);
|
|
--color-ink: var(--tpl-text);
|
|
--color-accent: var(--tpl-accent);
|
|
|
|
--font-sans: 'Pretendard Variable', 'Noto Sans KR', system-ui, sans-serif;
|
|
--font-serif: 'Noto Serif KR', 'Batang', 'Times New Roman', serif;
|
|
|
|
/*
|
|
* 선 색은 **둘레 글자색에서 뽑는다.**
|
|
* 예전에는 전 섹션이 `border-black/8` 이었다 — 어두운 바탕(푸터·필름·플립보드)에서
|
|
* 검은 선은 그냥 안 보인다. currentColor 를 섞으면 밝은 면에서는 진해지고
|
|
* 어두운 면에서는 밝아져, 어떤 팔레트에서도 선이 남는다.
|
|
*
|
|
* ★ 여기(@theme inline)에 있어야 하는 이유 — Tailwind 가 이 이름으로
|
|
* `text-muted` · `border-line` · `divide-line` 유틸을 **만들어 준다.**
|
|
* 공유 파일(shared/styles/site.css)로 옮겼더니 유틸 생성이 끊겨, 마크업이 188곳에서
|
|
* 쓰는 `text-muted` 와 101곳의 `border-line` 이 통째로 죽었다(실측 2026-09-09).
|
|
* 공유 파일에는 캔버스용 같은 값의 명시 정의가 따로 있다 — 값이 같으니 어느 쪽이 이겨도 된다.
|
|
*/
|
|
--color-line: color-mix(in oklab, currentColor 14%, transparent);
|
|
--color-line-soft: color-mix(in oklab, currentColor 8%, transparent);
|
|
/* 본문 보조 글자. opacity-60 을 반복해 쓰던 자리를 색 하나로 모은다. */
|
|
--color-muted: color-mix(in oklab, currentColor 62%, transparent);
|
|
|
|
/*
|
|
* 모서리는 템플릿이 정한 값 하나에서 **비율로** 펼친다.
|
|
* 하나로 통일하면 칩과 카드가 같은 곡률이라 층이 안 보이고,
|
|
* 따로 박으면 레트로(0px)를 골라도 카드만 둥글게 남는다.
|
|
*/
|
|
--radius-sm: calc(var(--tpl-radius, 0.75rem) * 0.4);
|
|
--radius-md: calc(var(--tpl-radius, 0.75rem) * 0.7);
|
|
--radius-lg: var(--tpl-radius, 0.75rem);
|
|
--radius-xl: calc(var(--tpl-radius, 0.75rem) * 1.35);
|
|
--radius-2xl: calc(var(--tpl-radius, 0.75rem) * 1.7);
|
|
--radius-3xl: calc(var(--tpl-radius, 0.75rem) * 2.2);
|
|
}
|
|
|
|
html {
|
|
scroll-behavior: smooth;
|
|
/* 고정 헤더에 앵커가 가리지 않게. 헤더 높이(4rem)+여유. */
|
|
scroll-padding-top: 5.5rem;
|
|
}
|
|
|
|
body {
|
|
background-color: var(--color-surface);
|
|
background-image: var(--tpl-texture, none);
|
|
color: var(--color-ink);
|
|
/* ★ 본문 서체도 템플릿이 정한다(theme.look → seo/head.ts). 토큰이 없는 옛 payload 에서는
|
|
지금까지와 똑같이 Pretendard/Noto Sans KR 로 떨어진다. */
|
|
font-family: var(--tpl-font-body, var(--font-sans));
|
|
font-size: var(--fs-body);
|
|
line-height: 1.7;
|
|
font-feature-settings: "tnum" 1;
|
|
/* 하단 고정 탭(모바일)에 마지막 섹션이 가리지 않게. */
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
}
|
|
|
|
/* 키보드 사용자에게만 보이는 초점 테두리. 마우스 클릭에는 안 뜬다. */
|
|
:focus-visible {
|
|
outline: 2px solid var(--color-accent);
|
|
outline-offset: 2px;
|
|
}
|