Trafix Brand — 컴포넌트 시트

Trafix Brand — 데스크톱 컴포넌트 Stage 1 · Tangerine Signal 언어 확장 (탠저린 프라이머리 + 스카이 + 버터, 머니 그린) · html.to.design 임포트용 시트

앱 셸 (Sidebar / Topbar)

.sidebar / .sidebar__logo / .sidebar__nav / .nav-item(--active) / .sidebar__account

.main-topbar / .cash-pill / .avatar-chip

스탯 타일

활성 캠페인 3 ▲ +1

이번 주 검증 조회수 128.4K ▲ +18.2%

광고캐시 잔액 ₩2,450,000 ▼ 소진 중

.stat-tile-row / .stat-tile / .stat-tile__label / .stat-tile__value / .stat-tile__delta(--up/--down)

데이터 테이블 · 상태 칩 · 예산 소진율

캠페인	상태	예산 소진율
버블리 신제품 런칭	진행중	64% 소진
여름 컬렉션 챌린지	검수 대기	85% 소진
겨울 시즌 프로모션	종료	100% 소진
일시중단 예시 캠페인	일시중단	30% 소진

.table-card / .table / .status--active,paused,ended,review / .budget-gauge / .spark(--peak)

위저드 스테퍼

✓

제품 정보

플레이북

보상 구조

.wizard-stepper / .wizard-stepper__step(--active/--done) / .wizard-stepper__connector

검수 큐 행

hara_films Gold 검증 조회수 24,800 적립 예정 ₩49,600

taeho_clip Silver 검증 조회수 9,400 적립 예정 ₩18,800

.review-row / .review-row__thumb / .review-row__creator / .review-row__meta / .btn--approve / .btn--reject

모달

.modal.modal--desktop / .modal__header / .modal__close / .modal__footer

와이드 콜아웃

신뢰 안내 조회수만큼만 · 예산 초과 청구 절대 없음 · 참여 크리에이터가 0명이면 0원 · 검증된 조회수만 차감돼요, 안 쓴 예산은 환급

.callout.callout--wide (info/warning/danger 조합 가능)

폼 2열 그리드

CPM 단가

₩

참여 최소 등급 설정 시 참여 가능 크리에이터 수가 줄어들 수 있어요

.form-grid / .field--span2 (기존 .field, .input-amount, .select 재사용)

세그먼트 컨트롤

fixed_term evergreen_daily

.segmented / .segmented__item(--active)

버튼 (재사용)

.btn--primary

.btn--secondary

.btn--ghost

.btn--danger

.btn--danger-solid

.btn--approve.btn--sm

.btn--reject.btn--sm

등급 배지 (재사용)

Copper Silver Gold Platinum Diamond

.badge-tier--copper/silver/gold/platinum/diamond

콜아웃 · 인풋 (재사용)

정보정산은 payable 기준으로만 진행돼요.

주의잔액 80% 소진 시 알림이 발송돼요.

경고스트라이크 인정 시 적립 전액이 무효화돼요.

.callout--info/warning/danger · .input · .select