Bileşenler

MoneyText

Kuruş cinsinden bir tutarı Provider dilinde, kayan nokta kullanmadan yazan metin.

Storybook: Storybook
Kaynak kod: Kaynak kod

Durumlar

Ton	Renk	`data-sign`
`default`	`color-text-default`	—
`subtle`	`color-text-subtle`	—
`sign`, artı	`color-text-success`, “+” ile	`positive`
`sign`, eksi	`color-text-danger`, “-” ile	`negative`
`sign`, sıfır	`color-text-default`	`zero`

Ölçüler

Boyut	Yazı stili
`sm`	`type-body-sm`
`md`	`type-body-md`
`lg`	`type-heading-sm`
`xl`	`type-heading-xl`
`fraction="subtle"`	0,7 em

Token’lar

Değerler seçili markaya göre gösterilir; markayı üst çubuktan değiştirebilirsiniz.

Token	Örnek	Açık mod	Koyu mod
`--bigbang-color-text-default`		`#171717#171717#171717`	`#fafafa#fafafa#fafafa`
`--bigbang-color-text-subtle`		`#404040#404040#404040`	`#d4d4d4#d4d4d4#d4d4d4`
`--bigbang-color-text-success`		`#0e7644#0e7644#0e7644`	`#a5e2b9#a5e2b9#a5e2b9`
`--bigbang-color-text-danger`		`#a6383c#a6383c#a6383c`	`#ffbebb#ffbebb#ffbebb`
`--bigbang-motion-value-duration`		`0.11s0.11s0.11s`	`0.11s0.11s0.11s`
`--bigbang-motion-list-distance`		`4px4px4px`	`4px4px4px`

Hareket ve etkileşim

Etkileşim	Özellik	Süre token’ı	Easing token’ı	Hareketi azaltma
Tutar değişimi	Yeni değer 4 px aşağıdan yükselir ve belirir	`motion-value-duration`	`easing-spring-productive-fast`	Yalnızca solar.