UNPKG

react-native-ui-lib

Version:

<p align="center"> <img src="https://user-images.githubusercontent.com/1780255/105469025-56759000-5ca0-11eb-993d-3568c1fd54f4.png" height="250px" style="display:block"/> </p> <p align="center">UI Toolset & Components Library for React Native</p> <p a

github.com/wix/react-native-ui-lib

wix/react-native-ui-lib

64 lines • 2.49 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
import { colorsPalette } from "./colorsPalette"; export const designTokens = { // BACKGROUND backgroundDefault: colorsPalette.white, backgroundNeutralHeavy: colorsPalette.grey20, backgroundNeutralIdle: colorsPalette.grey40, backgroundNeutralMedium: colorsPalette.grey60, backgroundNeutral: colorsPalette.grey70, backgroundNeutralLight: colorsPalette.grey80, backgroundPrimaryHeavy: colorsPalette.violet30, backgroundPrimaryLight: colorsPalette.violet70, backgroundPrimary: colorsPalette.violet80, backgroundGeneralHeavy: colorsPalette.blue30, backgroundGeneralLight: colorsPalette.blue70, backgroundGeneral: colorsPalette.blue80, backgroundSuccessHeavy: colorsPalette.green30, backgroundSuccess: colorsPalette.green80, backgroundWarningHeavy: colorsPalette.yellow30, backgroundWarning: colorsPalette.yellow80, backgroundMajor: colorsPalette.orange80, backgroundDangerHeavy: colorsPalette.red30, backgroundDanger: colorsPalette.red80, backgroundDisabled: colorsPalette.grey50, backgroundDark: colorsPalette.grey10, // TEXT textDisabled: colorsPalette.grey50, textDefault: colorsPalette.grey10, textNeutralHeavy: colorsPalette.grey20, textNeutral: colorsPalette.grey30, textNeutralLight: colorsPalette.grey40, textDefaultLight: colorsPalette.white, textPrimary: colorsPalette.violet30, textGeneral: colorsPalette.blue30, textSuccess: colorsPalette.green10, textMajor: colorsPalette.orange10, textDanger: colorsPalette.red10, textDangerLight: colorsPalette.red30, // ICON iconDefault: colorsPalette.grey10, iconNeutral: colorsPalette.grey20, iconDefaultLight: colorsPalette.white, iconPrimary: colorsPalette.violet30, iconPrimaryLight: colorsPalette.violet50, iconGeneral: colorsPalette.blue30, iconGeneralLight: colorsPalette.blue50, iconSuccess: colorsPalette.green10, iconSuccessLight: colorsPalette.green40, iconMajor: colorsPalette.orange10, iconDanger: colorsPalette.red10, iconDangerLight: colorsPalette.red40, iconDisabled: colorsPalette.grey50, // OUTLINE outlineLight: colorsPalette.white, outlineNeutral: colorsPalette.grey60, outlineNeutralMedium: colorsPalette.grey50, outlineDisabled: colorsPalette.grey50, outlineDisabledHeavy: colorsPalette.grey30, outlinePrimary: colorsPalette.violet30, outlineGeneral: colorsPalette.blue30, outlineWarning: colorsPalette.yellow30, outlineDanger: colorsPalette.red30, // DIVIDER dividerDefault: colorsPalette.grey60 };