공통 UI 0.5.10 라이트 모드 검증 기록

확정한 화면 원칙

공통 UI의 라이트 모드는 본문 흰색 표면과 분리되는 오피스 블루그레이 좌측 메뉴를 사용한다. 좌측 메뉴 배경은 #EEF3F8이며, 선택 메뉴는 옅은 코발트 표면과 코발트 계열 텍스트·아이콘으로 식별한다. 상단 헤더 하단 구분선은 #B8C7D7 토큰을 사용해 흰 캔버스에서도 경계가 식별되도록 했다.

영역	라이트 모드 적용 결과	검증 방식
공통 좌측 메뉴	오피스 블루그레이 배경과 코발트 선택 상태	UiPlatform 개발 화면 확인
공통 상단 바	강화된 헤더 하단 구분선	UiPlatform 개발 화면 확인
좌측 하단 환경 설정	라이트·다크 선택과 안내 히어로 표시 옵션	UiPlatform 개발 화면 확인
개인 설정 지속성	히어로 숨김 후 새로고침해도 상태 유지	브라우저 새로고침 확인
릴리스 카드·메트릭 카드	밝은 카드 표면, 블루그레이 구분선, 짙은 본문 텍스트	UiPlatform 개발 화면 확인
배포 표·검증 이력·알림	흰 표면, 옅은 표 테두리, 명확한 보조 텍스트와 안내 배경	UiPlatform 개발 화면 확인
아키텍처 문서	강조 패널과 책임 카드의 다크 잔여 색상 제거	UiPlatform 개발 화면 확인

사용자 설정 계약

좌측 하단의 화면 설정은 사용자 브라우저의 로컬 저장소에 저장된다. 테마 모드와 안내 히어로 표시 값은 포털 화면을 벗어나거나 새로고침해도 유지된다. 이 설정은 사용자 정보나 세션 상태를 상단 바에 표시하지 않으며, 공통 프레임의 개인 환경 옵션으로만 제공된다.

검증 결과

@hohyun94/portal-foundation 0.5.10의 UI 패키지 타입 검사·단위 테스트·빌드가 통과했다. UiPlatform와 ARISAM·Process Center·Guide Center는 0.5.10 의존성으로 타입 검사와 프로덕션 빌드를 통과했다. UiPlatform는 라이트 모드 표면 계약 회귀 테스트를 포함해 서버 단위 테스트와 프로덕션 빌드를 통과했다.

2026-08-25 재검수 기록

이번 UiPlatform 재검수에서는 PortalConsole와의 시각적 일관성을 우선해 라이트 모드의 캔버스·레일·패널 표면을 베이지 계열로 정렬하고, 본문은 짙은 네이비 잉크, 액션은 테라코타 액센트로 통일했다. 활성 좌측 메뉴 아이콘은 라이트 모드에서 흰색으로 강제되지 않고 액센트 색상으로 표시되며, 하단 관리자 정보와 환경 설정 컨트롤도 짙은 잉크 색으로 읽힌다.

브라우저 미리보기에서 릴리스 패널, 패키지 메타데이터 패널, 메트릭 카드, 포털 적용 상태, 검증 요청 및 테마 미리보기의 밝은 표면·저채도 경계선·보조 텍스트 대비를 확인했다. 다크 모드에서는 기존의 짙은 네이비 계층과 테라코타 액센트, 밝은 본문 텍스트 대비를 유지하는 것을 확인했다.

pnpm check, pnpm vitest run server/lightThemeContract.test.ts, pnpm build, git diff --check를 통과했다. 테스트는 3개 모두 성공했으며 프로덕션 번들도 정상 생성되었다. 빌드 과정에서 VITE_ANALYTICS_ENDPOINT와 VITE_ANALYTICS_WEBSITE_ID가 정의되지 않았다는 기존 환경 경고가 있었지만 빌드 실패로 이어지지는 않았다.