You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
77 lines
2.3 KiB
CSS
77 lines
2.3 KiB
CSS
/* frontend/styles/tokens.css — 원본 dash.css :root 그대로 */
|
|
:root {
|
|
/* 배경 */
|
|
--bg-top: #f6efe7;
|
|
--bg-mid: #eef0f1;
|
|
--bg-bot: #e9ebed;
|
|
/* 카드 */
|
|
--card: #ffffff;
|
|
--card-2: #f4f5f6;
|
|
--card-3: #eef0f1;
|
|
/* 잉크/텍스트 */
|
|
--ink: #211f1c;
|
|
--ink-2: #514d47;
|
|
--muted: #8d8a85;
|
|
--faint: #b6b3ad;
|
|
/* 라인 */
|
|
--line: rgba(33, 31, 28, 0.07);
|
|
--line-2: rgba(33, 31, 28, 0.13);
|
|
/* 검정 채움(선택 상태) */
|
|
--fill: #29241f;
|
|
--fill-soft: #36302a;
|
|
--on-fill: #f4efe6;
|
|
/* CTA 라임 */
|
|
--lime: #c2f24a;
|
|
--lime-hi: #cdf85e;
|
|
--lime-ink: #233006;
|
|
/* 액센트 */
|
|
--blue: #4f72e0;
|
|
--coral: #df7256;
|
|
--green: #4e9b66;
|
|
--violet: #8b6fd4;
|
|
--amber: #e0a23c;
|
|
/* 라운드/그림자 */
|
|
--radius: 22px;
|
|
--radius-sm: 14px;
|
|
--shadow: 0 10px 30px -14px rgba(30, 26, 22, 0.22), 0 2px 6px -2px rgba(30, 26, 22, 0.06);
|
|
--shadow-sm: 0 4px 14px -8px rgba(30, 26, 22, 0.18);
|
|
/* 글래스 */
|
|
--glass: rgba(255, 255, 255, 0.4);
|
|
--glass-2: rgba(255, 255, 255, 0.26);
|
|
--glass-brd: rgba(255, 255, 255, 0.7);
|
|
--glass-ink: rgba(26, 22, 18, 0.46);
|
|
--blur: blur(26px) saturate(190%);
|
|
--glass-hi: inset 0 1px 0 rgba(255, 255, 255, 0.75);
|
|
/* 폰트 (next/font 변수 우선 + 패밀리 폴백; §3.3) */
|
|
--font-disp: var(--f-onest), "Onest", "Pretendard", system-ui, sans-serif;
|
|
--font-ui: "Pretendard", var(--f-onest), "Onest", system-ui, sans-serif;
|
|
--font-mono: var(--f-dmmono), "DM Mono", ui-monospace, monospace;
|
|
}
|
|
|
|
[data-theme="dark"] {
|
|
--bg-top: #201d1a;
|
|
--bg-mid: #1a1816;
|
|
--bg-bot: #161413;
|
|
--card: #2c2925;
|
|
--card-2: #353029;
|
|
--card-3: #3b352d;
|
|
--ink: #f3eee6;
|
|
--ink-2: #c3bdb4;
|
|
--muted: #948e85;
|
|
--faint: #6f6a62;
|
|
--line: rgba(244, 239, 230, 0.09);
|
|
--line-2: rgba(244, 239, 230, 0.16);
|
|
--fill: #f4efe6;
|
|
--fill-soft: #e7e0d4;
|
|
--on-fill: #211f1c;
|
|
--shadow: 0 14px 36px -16px rgba(0, 0, 0, 0.7), 0 2px 8px -3px rgba(0, 0, 0, 0.4);
|
|
--shadow-sm: 0 6px 16px -10px rgba(0, 0, 0, 0.6);
|
|
--glass: rgba(48, 43, 38, 0.4);
|
|
--glass-2: rgba(70, 63, 55, 0.28);
|
|
--glass-brd: rgba(255, 255, 255, 0.1);
|
|
--glass-ink: rgba(16, 13, 11, 0.42);
|
|
--glass-hi: inset 0 1px 0 rgba(255, 255, 255, 0.1);
|
|
/* --lime/--blue/--coral/--green/--violet/--amber/--fill-soft 미오버라이드:
|
|
원본 dash.css도 다크에서 액센트/라임은 그대로 둔다. */
|
|
}
|