style(테이블타입): 탭 스타일 Chrome 식 outline 으로 변경 (v5-tab 톤 매칭) #33

2026-05-22T09:49:52Z

johngreen commented

2026-05-22 09:49:52 +00:00

Summary

underline 스타일이 너무 평면 → 페이지 상단의 v5-tab 처럼 Chrome 식 outline 카드 스타일로 변경.

위 모서리만 둥글게 + 1px border + -mb-px 로 카드처럼 떠 보임
활성 탭: bg-card + primary 색 + 위쪽 2px primary 강조선
페이지 탭과 톤 일치

## Summary underline 스타일이 너무 평면 → 페이지 상단의 v5-tab 처럼 Chrome 식 outline 카드 스타일로 변경. - 위 모서리만 둥글게 + 1px border + -mb-px 로 카드처럼 떠 보임 - 활성 탭: bg-card + primary 색 + 위쪽 2px primary 강조선 - 페이지 탭과 톤 일치

johngreen added 1 commit 2026-05-22 09:49:52 +00:00

style(테이블타입): 탭 스타일 Chrome 식 outline 으로 변경 — 페이지 탭(v5-tab)과 톤 일치 eeb130e3a8

밑줄(underline) 스타일이 너무 평면이라 사용자가 페이지 상단 v5-tab(브라우저 탭처럼
border 두른 outline 카드 스타일) 과 톤을 맞추길 원함.

- TabsList: 좌측 정렬 + 하단 1px 구분선 + 좌우 padding
- TabsTrigger: 위 모서리만 둥글게 (rounded-t-md), 1px border 둘러, -mb-px 로
  컨테이너 하단선과 겹쳐 카드처럼 떠 보임
- 활성 탭: bg-card + primary 색 텍스트 + 굵게 + 위쪽 2px primary 강조선 (inset shadow)
  + 하단 border 를 카드색으로 덮어 본문과 seamless

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

johngreen merged commit 387a1ae611 into main

2026-05-22 09:49:54 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: gbpark/invyone#33