Components

Top Navigation

이 문서는 정리 중이에요. 문의 내용은 #_design_core 채널을 찾아주세요.

개요

옵션 테이블

속성	값	기본값
tone	layer, transparent
title	string

링크

React

Top Navigation 컴포넌트를 React로 사용하는 방법을 설명합니다.

스펙

theme=cupertino

상태	슬롯	속성	값
enabled	root	minHeight	44px
		paddingX	$dimension.x4
	icon	size	24px
		targetSize	44px

theme=android

상태	슬롯	속성	값
enabled	root	minHeight	56px
		paddingX	$dimension.x4
	icon	size	24px
		targetSize	44px

tone=layer

상태	슬롯	속성	값
enabled	root	color	$color.bg.layer-default
	title	color	$color.fg.neutral
	subtitle	color	$color.fg.neutral-muted
	icon	color	$color.fg.neutral

tone=transparent

상태	슬롯	속성	값
enabled	root	color	#00000000
	title	color	$color.palette.static-white
	subtitle	color	$color.palette.static-white
	icon	color	$color.palette.static-white

divider=true

상태	슬롯	속성	값
enabled	root	strokeColor	$color.stroke.neutral-muted
		strokeWidth	1px

titleLayout=titleOnly

상태	슬롯	속성	값
enabled	title	fontSize	$font-size.t6-static
		fontWeight	$font-weight.bold

titleLayout=withSubtitle

상태	슬롯	속성	값
enabled	title	fontSize	$font-size.t5-static
		fontWeight	$font-weight.bold
	subtitle	fontSize	$font-size.t2-static
		fontWeight	$font-weight.regular

Toggle Button

이 문서는 정리 중이에요. 문의 내용은 #_design_core 채널을 찾아주세요.

Loading

로딩을 관리하는 데 필요한 요소, 시간에 따른 적합한 선택지와 단계별로 사용자 경험을 최적화하는 방법에 대해 소개합니다.