style(frontend): PwC 로고 제거, 기본 라이트 모드, 삼성 팔레트 포인트 Samsung Blue

- LogoMark 는 null 렌더(호출부 6곳 그대로), logo.png·logo-dark.png 삭제, 파비콘 투명
- themeStore·index.html 기본 light. 예전 dark 저장값은 첫 실행 때 한 번만 초기화
- samsung 팔레트 primary/ring/link = #1428A0(브랜드 파랑). 바탕·글씨·면은 실측값 유지
- Message 테스트: 기본 라이트 기준으로 코드블럭 흰 배경 기대

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
This commit is contained in:
lee-hyeon-cheol
2026-09-21 10:40:32 +09:00
co-authored by Claude Fable 5.1
parent efb9fb46de
commit 72a06d6c07
9 changed files with 22 additions and 28 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 38 KiB

@@ -23,8 +23,8 @@ describe("Message 코드펜스 렌더", () => {
// 스크롤 컨테이너 있는 CodeBlock 으로 감싸져야 함
const block = container.querySelector("[data-code-block]")
expect(block).not.toBeNull()
// 코드 상자 색은 앱 테마를 따름 — 기본(다크)에선 어두운 코드 상자, 라이트 모드면 흰 에디터 룩
expect(block?.className).toContain("bg-[#0d1117]")
// 코드 상자 색은 앱 테마를 따름 — 기본이 라이트(2026-09-21)라 언어 없는 블럭은 흰 에디터 룩, 다크면 bg-[#0d1117]
expect(block?.className).toContain("bg-white")
// 인라인 code 스타일(bg-black/10)로 새지 않아야 함
expect(container.querySelector("code.rounded")).toBeNull()
})
+3 -13
View File
@@ -1,19 +1,9 @@
import logo from "@/assets/logo.png"
import logoDark from "@/assets/logo-dark.png"
import { cn } from "@/lib/utils/cn"
interface LogoMarkProps {
/** 로고 가로 폭(px) — 원본 비율(약 2.06:1) 유지 */
width?: number
className?: string
}
/** 브랜드 마크 — ABAP_OPENCODE 와 같은 PwC 로고. 다크에선 밝은 글자 변형. */
export function LogoMark({ width = 38, className }: LogoMarkProps) {
return (
<span className={cn("inline-flex shrink-0", className)} style={{ width }}>
<img src={logo} alt="PwC" className="block h-auto w-full dark:hidden" />
<img src={logoDark} alt="PwC" className="hidden h-auto w-full dark:block" />
</span>
)
/** 브랜드 마크 자리 — 지금은 아무것도 안 그림(PwC 로고 제거, 2026-09-21). 호출부 6곳은 그대로 두고 여기서만 끔. */
export function LogoMark(_props: LogoMarkProps) {
return null
}
+2 -2
View File
@@ -35,8 +35,8 @@ const ORDER: Theme[] = ["light", "dark", "system"]
export const useThemeStore = create<ThemeState>()(
persist(
(set, get) => ({
theme: "dark", // ABAP_OPENCODE 와 같이 다크가 기본
resolved: resolve("dark"),
theme: "light", // 삼성향 팔레트가 라이트라 라이트 기본(2026-09-21)
resolved: resolve("light"),
setTheme: (theme) => {
const resolved = resolve(theme)
applyToDocument(resolved)
+7 -7
View File
@@ -83,8 +83,8 @@ export type DerivedTokens = {
// 의미색 — 모든 테마 공통
const DESTRUCTIVE = "oklch(0.577 0.245 27.325)"
// 삼성향 — 삼성닷컴(sec) 공개 웹 2026-07 실측값. 검정 주색·흰 바탕·회색 면, 그림자 없음, 알약 버튼(20px).
// One UI 파랑(#0381fe)은 폰 앱용이라 안 씀. 링크만 #007aff. 폰트는 재배포 근거 없어 안 넣음.
// 삼성향 — 삼성닷컴(sec) 공개 웹 2026-07 실측값(흰 바탕·검정 글씨·회색 면, 그림자 없음, 알약 20px)
// 포인트로 Samsung Blue #1428A0(브랜드 로고 색) — 버튼·링·활성 표시. One UI 파랑(#0381fe)은 폰 앱용이라 안 씀.
const SAMSUNG_TOKENS: DerivedTokens = {
background: "#FFFFFF", // canvas
foreground: "#000000",
@@ -92,7 +92,7 @@ const SAMSUNG_TOKENS: DerivedTokens = {
cardForeground: "#000000",
popover: "#FFFFFF",
popoverForeground: "#000000",
primary: "#000000", // contained CTA
primary: "#1428A0", // Samsung Blue — 포인트
primaryForeground: "#FFFFFF",
secondary: "#F7F7F7", // surface
secondaryForeground: "#000000",
@@ -103,15 +103,15 @@ const SAMSUNG_TOKENS: DerivedTokens = {
destructive: DESTRUCTIVE,
border: "#DDDDDD",
input: "#DDDDDD",
ring: "#000000",
ring: "#1428A0",
sidebar: "#F7F7F7",
sidebarForeground: "#000000",
sidebarPrimary: "#000000",
sidebarPrimary: "#1428A0",
sidebarPrimaryForeground: "#FFFFFF",
sidebarAccent: "#EDEDED",
sidebarAccentForeground: "#000000",
sidebarBorder: "#DDDDDD",
sidebarRing: "#000000",
sidebarRing: "#1428A0",
}
// 기본 팔레트(id 는 하위호환으로 clean-blue 유지) — ABAP_OPENCODE DESIGN_SYSTEM.md §7 라이트 값.
@@ -152,7 +152,7 @@ const FIXED_TOKENS: Record<string, DerivedTokens> = {
}
// 팔레트별 추가 CSS — samsung 은 알약 radius(실측 20px) + 링크색
const EXTRA_CSS: Record<string, string> = {
samsung: `[data-theme="samsung"]:not(.dark){--radius:20px;--link:#007aff}`,
samsung: `[data-theme="samsung"]:not(.dark){--radius:20px;--link:#1428A0}`,
}
export function derivePaletteTokens(
+1 -1
View File
@@ -12,7 +12,7 @@ export const PALETTES: RawPalette[] = [
{
id: "samsung", // 고정 토큰(derive.ts SAMSUNG_TOKENS) — 삼성닷컴 공개 웹 실측값. 라이트 전용, 다크는 공통
name: "Samsung",
swatch: ["#FFFFFF", "#F7F7F7", "#000000", "#707070"],
swatch: ["#FFFFFF", "#F7F7F7", "#1428A0", "#000000"],
},
{
id: "clean-blue", // id 는 저장된 값 호환 위해 유지 — 실제 토큰은 derive.ts 워크스페이스(ABAP_OPENCODE) 값