@box/blueprint-web-assets 4.56.8 → 4.57.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/icons/Medium/ChevronDown.d.ts +3 -0
- package/dist/icons/Medium/ChevronDown.js +5 -0
- package/dist/icons/Medium/ChevronLeft.d.ts +3 -0
- package/dist/icons/Medium/ChevronLeft.js +5 -0
- package/dist/icons/Medium/ChevronRight.d.ts +3 -0
- package/dist/icons/Medium/ChevronRight.js +5 -0
- package/dist/icons/Medium/ChevronUp.d.ts +3 -0
- package/dist/icons/Medium/ChevronUp.js +5 -0
- package/dist/icons/Medium/index.d.ts +4 -0
- package/dist/icons/Medium/index.js +4 -0
- package/dist/tokens/BP2/dark_mode_value/px-tokens.d.ts +187 -114
- package/dist/tokens/BP2/dark_mode_value/px-tokens.js +199 -126
- package/dist/tokens/BP2/dark_mode_value/tokens.css +195 -122
- package/dist/tokens/BP2/dark_mode_value/tokens.d.ts +187 -114
- package/dist/tokens/BP2/dark_mode_value/tokens.js +199 -126
- package/dist/tokens/BP2/dark_mode_value/tokens.json +199 -126
- package/dist/tokens/BP2/light_mode_value/px-tokens.d.ts +187 -114
- package/dist/tokens/BP2/light_mode_value/px-tokens.js +199 -126
- package/dist/tokens/BP2/light_mode_value/tokens.css +194 -121
- package/dist/tokens/BP2/light_mode_value/tokens.d.ts +187 -114
- package/dist/tokens/BP2/light_mode_value/tokens.js +199 -126
- package/dist/tokens/BP2/light_mode_value/tokens.json +199 -126
- package/dist/tokens/px-tokens.js +199 -126
- package/dist/tokens/tokens-css-vars.scss +194 -121
- package/dist/tokens/tokens.js +199 -126
- package/dist/tokens/tokens.json +199 -126
- package/package.json +2 -2
|
@@ -10,8 +10,9 @@ export const bpBorderCheckboxBorder = '#6f6f6f';
|
|
|
10
10
|
export const bpBorderCheckboxBorderHover = '#4e4e4e';
|
|
11
11
|
export const bpBorderCheckboxBorderSelected = '#0061d5';
|
|
12
12
|
export const bpBorderCheckboxBorderSelectedHover = '#2079e3';
|
|
13
|
-
export const
|
|
14
|
-
export const
|
|
13
|
+
export const bpBorderCollapsibleSectionBorder = '#d3d3d3';
|
|
14
|
+
export const bpBorderContentButtonBorderHoverActive = '#909090';
|
|
15
|
+
export const bpBorderContentButtonBorderSelected = '#909090';
|
|
15
16
|
export const bpBorderCtaBorderOutline = '#000000';
|
|
16
17
|
export const bpBorderCtaBorderOutlineDisabled = '#646464';
|
|
17
18
|
export const bpBorderCtaBorderOutlineHover = '#000000';
|
|
@@ -20,47 +21,66 @@ export const bpBorderCtaBorderSecondary = '#bcbcbc';
|
|
|
20
21
|
export const bpBorderCtaBorderSecondaryDisabled = '#e8e8e8';
|
|
21
22
|
export const bpBorderCtaBorderSecondaryHover = '#bcbcbc';
|
|
22
23
|
export const bpBorderCtaBorderSecondaryPressed = '#bcbcbc';
|
|
24
|
+
export const bpBorderDatePickerDayBorderFocus = '#2486fc';
|
|
25
|
+
export const bpBorderDatePickerDayBorderSelectedFocus = '#2486fc';
|
|
26
|
+
export const bpBorderDatePickerBorderActive = '#2486fc';
|
|
27
|
+
export const bpBorderDatePickerBorderComplete = '#909090';
|
|
28
|
+
export const bpBorderDatePickerBorderDefault = '#909090';
|
|
29
|
+
export const bpBorderDatePickerBorderDisabled = '#909090';
|
|
30
|
+
export const bpBorderDatePickerBorderError = '#ed3757';
|
|
31
|
+
export const bpBorderDatePickerBorderFocus = '#2486fc';
|
|
32
|
+
export const bpBorderDatePickerBorderHover = '#6f6f6f';
|
|
23
33
|
export const bpBorderDividerBorder = '#e8e8e8';
|
|
24
34
|
export const bpBorderDividerBorderBrand = 'rgba(232, 232, 232, 0.1)';
|
|
35
|
+
export const bpBorderDropdownSecondaryBorder = '#bcbcbc';
|
|
25
36
|
export const bpBorderDropdownBorder = '#bcbcbc';
|
|
26
37
|
export const bpBorderDropdownBorderError = '#ed3757';
|
|
27
38
|
export const bpBorderDropdownBorderErrorFocus = '#ed3757';
|
|
28
39
|
export const bpBorderDropdownBorderErrorHover = '#ed3757';
|
|
29
40
|
export const bpBorderDropdownBorderFocus = '#0061d5';
|
|
30
41
|
export const bpBorderDropdownBorderHover = '#6f6f6f';
|
|
31
|
-
export const
|
|
32
|
-
export const
|
|
33
|
-
export const
|
|
42
|
+
export const bpBorderFilterChipBorderMultiOn = '#99c0ee';
|
|
43
|
+
export const bpBorderFilterChipBorderMultiOnHover = '#99c0ee';
|
|
44
|
+
export const bpBorderGridThumbnailBorder = '#e8e8e8';
|
|
34
45
|
export const bpBorderInputBorder = '#909090';
|
|
35
46
|
export const bpBorderInputBorderError = '#ed3757';
|
|
36
47
|
export const bpBorderInputBorderErrorFocus = '#ed3757';
|
|
37
48
|
export const bpBorderInputBorderErrorHover = '#ed3757';
|
|
38
49
|
export const bpBorderInputBorderFocus = '#2486fc';
|
|
39
50
|
export const bpBorderInputBorderHover = '#6f6f6f';
|
|
40
|
-
export const
|
|
51
|
+
export const bpBorderInputChipBorderError = '#ed3757';
|
|
52
|
+
export const bpBorderItemSmallBorderSelected = '#0061d5';
|
|
41
53
|
export const bpBorderItemBorderHover = '#e8e8e8';
|
|
42
54
|
export const bpBorderItemBorderSelected = '#0061d5';
|
|
43
|
-
export const
|
|
55
|
+
export const bpBorderListItemBorder = '#e8e8e8';
|
|
56
|
+
export const bpBorderListItemBorderSelected = '#0061d5';
|
|
57
|
+
export const bpBorderMenuBorder = '#e8e8e8';
|
|
44
58
|
export const bpBorderMessageBorderError = '#ed3757';
|
|
45
|
-
export const bpBorderMessageBorderErrorSecondary = '
|
|
59
|
+
export const bpBorderMessageBorderErrorSecondary = 'rgba(237, 55, 87, 0.3)';
|
|
46
60
|
export const bpBorderMessageBorderGeneric = '#222222';
|
|
47
|
-
export const bpBorderMessageBorderGenericSecondary = '
|
|
61
|
+
export const bpBorderMessageBorderGenericSecondary = 'rgba(0, 0, 0, 0.3)';
|
|
48
62
|
export const bpBorderMessageBorderInfo = '#0061d5';
|
|
49
|
-
export const bpBorderMessageBorderInfoSecondary = '
|
|
63
|
+
export const bpBorderMessageBorderInfoSecondary = 'rgba(36, 134, 252, 0.3)';
|
|
50
64
|
export const bpBorderMessageBorderSuccess = '#26c281';
|
|
51
|
-
export const bpBorderMessageBorderSuccessSecondary = '
|
|
65
|
+
export const bpBorderMessageBorderSuccessSecondary = 'rgba(38, 194, 129, 0.3)';
|
|
52
66
|
export const bpBorderMessageBorderWarning = '#f5b31b';
|
|
53
|
-
export const bpBorderMessageBorderWarningSecondary = '
|
|
67
|
+
export const bpBorderMessageBorderWarningSecondary = 'rgba(245, 179, 27, 0.3)';
|
|
54
68
|
export const bpBorderRadioBorder = '#6f6f6f';
|
|
55
69
|
export const bpBorderRadioBorderHover = '#4e4e4e';
|
|
56
70
|
export const bpBorderRadioBorderSelected = '#0061d5';
|
|
57
71
|
export const bpBorderRadioBorderSelectedHover = '#2079e3';
|
|
58
|
-
export const
|
|
59
|
-
export const
|
|
60
|
-
export const
|
|
72
|
+
export const bpBorderRadioTileBorder = '#bcbcbc';
|
|
73
|
+
export const bpBorderRadioTileBorderHover = '#bcbcbc';
|
|
74
|
+
export const bpBorderRadioTileBorderSelected = '#0061d5';
|
|
75
|
+
export const bpBorderSearchGlobalBorderHover = '#e8e8e8';
|
|
61
76
|
export const bpBorderSearchBorder = '#f4f4f4';
|
|
62
77
|
export const bpBorderSearchBorderHover = '#6f6f6f';
|
|
63
|
-
export const
|
|
78
|
+
export const bpBorderSelectBorderActive = '#2486fc';
|
|
79
|
+
export const bpBorderSelectBorderDefault = '#bcbcbc';
|
|
80
|
+
export const bpBorderSelectBorderDisabled = '#bcbcbc';
|
|
81
|
+
export const bpBorderSelectBorderError = '#d5324e';
|
|
82
|
+
export const bpBorderSelectBorderHover = '#6f6f6f';
|
|
83
|
+
export const bpBorderSelectBorderReadOnly = '#d3d3d3';
|
|
64
84
|
export const bpBorderStatusBorderHover = 'rgba(0, 0, 0, 0.04)';
|
|
65
85
|
export const bpBorderSwitchBorder = '#bcbcbc';
|
|
66
86
|
export const bpBorderSwitchBorderHover = '#bcbcbc';
|
|
@@ -70,14 +90,15 @@ export const bpBorderTabBorderSelected = '#0061d5';
|
|
|
70
90
|
export const bpBorderTabBorderSelectedFocus = '#0061d5';
|
|
71
91
|
export const bpBorderTabBorderSelectedHover = '#0061d5';
|
|
72
92
|
export const bpBorderToggleBorder = '#bcbcbc';
|
|
93
|
+
export const bpBorderToggleBorderOff = '#ffffff';
|
|
73
94
|
export const bpBorderToggleBorderOn = '#99c0ee';
|
|
74
|
-
export const
|
|
75
|
-
export const
|
|
76
|
-
export const
|
|
77
|
-
export const
|
|
78
|
-
export const
|
|
79
|
-
export const
|
|
80
|
-
export const
|
|
95
|
+
export const bpBorderToggleTextBorderOff = '#ffffff';
|
|
96
|
+
export const bpBorderToggleTextBorderOffAi = '#bcbcbc';
|
|
97
|
+
export const bpBorderToggleTextBorderOffHover = '#f4f4f4';
|
|
98
|
+
export const bpBorderToggleTextBorderOffPressed = '#e8e8e8';
|
|
99
|
+
export const bpBorderToggleTextBorderOn = '#99c0ee';
|
|
100
|
+
export const bpBorderToggleTextBorderOnHover = '#99c0ee';
|
|
101
|
+
export const bpBorderToggleTextBorderOnPressed = '#99c0ee';
|
|
81
102
|
export const bpBorderTooltipBorderError = '#f69bab';
|
|
82
103
|
export const bpBorder00 = '0';
|
|
83
104
|
export const bpBorder01 = '0.0625rem';
|
|
@@ -97,14 +118,6 @@ export const bpIconCtaIconPressed = '#222222';
|
|
|
97
118
|
export const bpIconCtaIconUtility = '#4e4e4e';
|
|
98
119
|
export const bpIconCtaIconUtilityHover = '#000000';
|
|
99
120
|
export const bpIconCtaIconUtilityPressed = '#000000';
|
|
100
|
-
export const bpIconIconBlue = '#0061d5';
|
|
101
|
-
export const bpIconIconDestructiveOnLight = '#d5324e';
|
|
102
|
-
export const bpIconIconErrorOnLight = '#d5324e';
|
|
103
|
-
export const bpIconIconOnDark = '#ffffff';
|
|
104
|
-
export const bpIconIconOnLight = '#222222';
|
|
105
|
-
export const bpIconIconOnLightSecondary = '#6f6f6f';
|
|
106
|
-
export const bpIconIconOnLightTertiary = '#909090';
|
|
107
|
-
export const bpIconIconRequiredOnLight = '#d5324e';
|
|
108
121
|
export const bpIconNavIconOnDark = '#ffffff';
|
|
109
122
|
export const bpIconNavIconOnDarkFocus = '#ffffff';
|
|
110
123
|
export const bpIconNavIconOnDarkHover = '#ffffff';
|
|
@@ -113,41 +126,74 @@ export const bpIconNavIconOnLight = '#222222';
|
|
|
113
126
|
export const bpIconNavIconOnLightFocus = '#222222';
|
|
114
127
|
export const bpIconNavIconOnLightHover = '#222222';
|
|
115
128
|
export const bpIconNavIconOnLightSelected = '#222222';
|
|
129
|
+
export const bpIconIconBlue = '#0061d5';
|
|
130
|
+
export const bpIconIconDestructiveOnLight = '#d5324e';
|
|
131
|
+
export const bpIconIconErrorOnLight = '#d5324e';
|
|
132
|
+
export const bpIconIconIllustrator = '#ff9400';
|
|
133
|
+
export const bpIconIconIndesign = '#ff57a1';
|
|
134
|
+
export const bpIconIconOnDark = '#ffffff';
|
|
135
|
+
export const bpIconIconOnLight = '#222222';
|
|
136
|
+
export const bpIconIconOnLightSecondary = '#6f6f6f';
|
|
137
|
+
export const bpIconIconOnLightTertiary = '#909090';
|
|
138
|
+
export const bpIconIconPhotoshop = '#26c9ff';
|
|
139
|
+
export const bpIconIconRequiredOnLight = '#d5324e';
|
|
116
140
|
export const bpOutlineFocusOnDark = '#ffffff';
|
|
117
141
|
export const bpOutlineFocusOnLight = '#2486fc';
|
|
118
142
|
export const bpOverlayModalOverlay = 'rgba(0, 0, 0, 0.5)';
|
|
119
|
-
export const
|
|
143
|
+
export const bpOverlaySidePanelOverlay = 'rgba(0, 0, 0, 0.5)';
|
|
120
144
|
export const bpSurfaceAccordionSurface = '#ffffff';
|
|
121
145
|
export const bpSurfaceAccordionSurfaceHover = '#f4f4f4';
|
|
122
|
-
export const
|
|
123
|
-
export const
|
|
124
|
-
export const
|
|
125
|
-
export const
|
|
126
|
-
export const
|
|
127
|
-
export const
|
|
128
|
-
export const
|
|
129
|
-
export const
|
|
130
|
-
export const
|
|
131
|
-
export const
|
|
132
|
-
export const
|
|
133
|
-
export const
|
|
134
|
-
export const
|
|
135
|
-
export const
|
|
136
|
-
export const
|
|
137
|
-
export const
|
|
138
|
-
export const
|
|
139
|
-
export const
|
|
140
|
-
export const
|
|
141
|
-
export const
|
|
142
|
-
export const
|
|
143
|
-
export const
|
|
144
|
-
export const
|
|
145
|
-
export const
|
|
146
|
-
export const
|
|
147
|
-
export const
|
|
148
|
-
export const
|
|
149
|
-
export const
|
|
150
|
-
export const
|
|
146
|
+
export const bpSurfaceBadgeIllustratorSurface = '#051e25';
|
|
147
|
+
export const bpSurfaceBadgeIndesignSurface = '#131415';
|
|
148
|
+
export const bpSurfaceBadgeNumbersSurface = '#00a650';
|
|
149
|
+
export const bpSurfaceBadgePhotoshopSurface = '#131415';
|
|
150
|
+
export const bpSurfaceBadgePowerpointSurface = '#c43e1c';
|
|
151
|
+
export const bpSurfaceBadgePresentationSurface = '#d97417';
|
|
152
|
+
export const bpSurfaceBadgeSpreadsheetSurface = '#3fb87f';
|
|
153
|
+
export const bpSurfaceBadgeSurfaceAdmin = '#003c84';
|
|
154
|
+
export const bpSurfaceBadgeSurfaceAnnotation = '#f5b31b';
|
|
155
|
+
export const bpSurfaceBadgeSurfaceAudio = '#9f3fed';
|
|
156
|
+
export const bpSurfaceBadgeSurfaceBookmark = '#0061d5';
|
|
157
|
+
export const bpSurfaceBadgeSurfaceBoxapps = '#0061d5';
|
|
158
|
+
export const bpSurfaceBadgeSurfaceBoxnote = '#e8e8e8';
|
|
159
|
+
export const bpSurfaceBadgeSurfaceCanvas = '#d97417';
|
|
160
|
+
export const bpSurfaceBadgeSurfaceCoadmin = '#9f3fed';
|
|
161
|
+
export const bpSurfaceBadgeSurfaceCode = '#ed3757';
|
|
162
|
+
export const bpSurfaceBadgeSurfaceCollection = '#e8e8e8';
|
|
163
|
+
export const bpSurfaceBadgeSurfaceCompleted = '#1e9b67';
|
|
164
|
+
export const bpSurfaceBadgeSurfaceDefault = '#6f6f6f';
|
|
165
|
+
export const bpSurfaceBadgeSurfaceDocs = '#4083f7';
|
|
166
|
+
export const bpSurfaceBadgeSurfaceDrawing = '#009aed';
|
|
167
|
+
export const bpSurfaceBadgeSurfaceError = '#d5324e';
|
|
168
|
+
export const bpSurfaceBadgeSurfaceExcel = '#107c41';
|
|
169
|
+
export const bpSurfaceBadgeSurfaceExternal = '#909090';
|
|
170
|
+
export const bpSurfaceBadgeSurfaceFolderexternal = '#6f6f6f';
|
|
171
|
+
export const bpSurfaceBadgeSurfaceFoldershared = '#2486fc';
|
|
172
|
+
export const bpSurfaceBadgeSurfaceHubs = '#0061d5';
|
|
173
|
+
export const bpSurfaceBadgeSurfaceImage = '#1e9b67';
|
|
174
|
+
export const bpSurfaceBadgeSurfaceKeynote = '#0a84ff';
|
|
175
|
+
export const bpSurfaceBadgeSurfaceMention = '#1d6bca';
|
|
176
|
+
export const bpSurfaceBadgeSurfaceNotification = '#d5324e';
|
|
177
|
+
export const bpSurfaceBadgeSurfaceOffline = '#26c281';
|
|
178
|
+
export const bpSurfaceBadgeSurfaceOnline = '#1e9b67';
|
|
179
|
+
export const bpSurfaceBadgeSurfacePages = '#ff9500';
|
|
180
|
+
export const bpSurfaceBadgeSurfacePdf = '#d0021b';
|
|
181
|
+
export const bpSurfaceBadgeSurfacePin = '#e8e8e8';
|
|
182
|
+
export const bpSurfaceBadgeSurfaceProgress = '#f5b31b';
|
|
183
|
+
export const bpSurfaceBadgeSurfaceRejected = '#d5324e';
|
|
184
|
+
export const bpSurfaceBadgeSurfaceRelay = '#1d6bca';
|
|
185
|
+
export const bpSurfaceBadgeSurfaceSheets = '#21a464';
|
|
186
|
+
export const bpSurfaceBadgeSurfaceSlides = '#f7ba00';
|
|
187
|
+
export const bpSurfaceBadgeSurfaceTask = '#2486fc';
|
|
188
|
+
export const bpSurfaceBadgeSurfaceTaskapproval = '#1d6bca';
|
|
189
|
+
export const bpSurfaceBadgeSurfaceVideo = '#009aed';
|
|
190
|
+
export const bpSurfaceBadgeTextSurface = '#0061d5';
|
|
191
|
+
export const bpSurfaceBadgeThreeDSurface = '#d97417';
|
|
192
|
+
export const bpSurfaceBadgeVectorSurface = '#d97417';
|
|
193
|
+
export const bpSurfaceBadgeWordSurface = '#185abd';
|
|
194
|
+
export const bpSurfaceBadgeZipSurface = '#6f6f6f';
|
|
195
|
+
export const bpSurfaceCalendarSurface = '#ffffff';
|
|
196
|
+
export const bpSurfaceCardSurface = 'rgba(255, 255, 255, 0.7)';
|
|
151
197
|
export const bpSurfaceCardSurfaceFocus = '#f2f7fd';
|
|
152
198
|
export const bpSurfaceCardSurfaceHover = '#ffffff';
|
|
153
199
|
export const bpSurfaceCardSurfacePressed = '#fbfbfb';
|
|
@@ -157,9 +203,16 @@ export const bpSurfaceCheckboxSurfaceSelected = '#0061d5';
|
|
|
157
203
|
export const bpSurfaceCheckboxSurfaceSelectedHover = '#2079e3';
|
|
158
204
|
export const bpSurfaceChipButtonSurface = 'rgba(0, 0, 0, 0.04)';
|
|
159
205
|
export const bpSurfaceChipButtonSurfaceHover = 'rgba(0, 0, 0, 0.08)';
|
|
160
|
-
export const
|
|
161
|
-
export const
|
|
162
|
-
export const
|
|
206
|
+
export const bpSurfaceComboboxSurface = '#ffffff';
|
|
207
|
+
export const bpSurfaceContentButtonSurfaceFocus = '#ffffff';
|
|
208
|
+
export const bpSurfaceContentButtonSurfaceFocusDefault = '#ffffff';
|
|
209
|
+
export const bpSurfaceContentButtonSurfaceHoverActive = '#f4f4f4';
|
|
210
|
+
export const bpSurfaceContentButtonSurfaceHoverDefault = '#f4f4f4';
|
|
211
|
+
export const bpSurfaceContentButtonSurfaceSelected = '#ffffff';
|
|
212
|
+
export const bpSurfaceContentSwitcherSurface = '#e8e8e8';
|
|
213
|
+
export const bpSurfaceCtaDestructiveSurfaceTeratiaryHover = '#fef5f6';
|
|
214
|
+
export const bpSurfaceCtaDestructiveSurfaceTeratiaryPressed = '#fdebee';
|
|
215
|
+
export const bpSurfaceCtaDestructiveSurfaceTertiary = 'rgba(237, 55, 87, 0)';
|
|
163
216
|
export const bpSurfaceCtaSurfaceIcon = 'rgba(0, 0, 0, 0)';
|
|
164
217
|
export const bpSurfaceCtaSurfaceIconDisabled = 'rgba(0, 0, 0, 0)';
|
|
165
218
|
export const bpSurfaceCtaSurfaceIconHover = 'rgba(0, 0, 0, 0.04)';
|
|
@@ -168,7 +221,6 @@ export const bpSurfaceCtaSurfaceIconUtility = '#e8e8e8';
|
|
|
168
221
|
export const bpSurfaceCtaSurfaceIconUtilityHover = '#d3d3d3';
|
|
169
222
|
export const bpSurfaceCtaSurfaceIconUtilityPressed = '#bcbcbc';
|
|
170
223
|
export const bpSurfaceCtaSurfaceOutline = 'rgba(0, 0, 0, 0)';
|
|
171
|
-
export const bpSurfaceCtaSurfaceOutline2 = 'rgba(0, 0, 0, 0)';
|
|
172
224
|
export const bpSurfaceCtaSurfaceOutlineHover = 'rgba(0, 0, 0, 0.04)';
|
|
173
225
|
export const bpSurfaceCtaSurfaceOutlinePressed = 'rgba(0, 0, 0, 0.08)';
|
|
174
226
|
export const bpSurfaceCtaSurfacePromo = '#4122af';
|
|
@@ -191,18 +243,27 @@ export const bpSurfaceCtaSurfaceTertiaryPromoFocus = '#f6f4fc';
|
|
|
191
243
|
export const bpSurfaceCtaSurfaceTertiaryPromoFocusPressed = '#dad4f3';
|
|
192
244
|
export const bpSurfaceCtaSurfaceTertiaryPromoHover = '#f6f4fc';
|
|
193
245
|
export const bpSurfaceCtaSurfaceTertiaryPromoPressed = '#dad4f3';
|
|
194
|
-
export const
|
|
195
|
-
export const
|
|
196
|
-
export const
|
|
197
|
-
export const
|
|
198
|
-
export const
|
|
199
|
-
export const
|
|
200
|
-
export const
|
|
246
|
+
export const bpSurfaceDatePickerDaySurfaceDefault = '#ffffff';
|
|
247
|
+
export const bpSurfaceDatePickerDaySurfaceDisabled = '#ffffff';
|
|
248
|
+
export const bpSurfaceDatePickerDaySurfaceFocus = '#f4f4f4';
|
|
249
|
+
export const bpSurfaceDatePickerDaySurfaceHover = '#f4f4f4';
|
|
250
|
+
export const bpSurfaceDatePickerDaySurfaceSelected = '#0061d5';
|
|
251
|
+
export const bpSurfaceDatePickerDaySurfaceSelectedFocus = '#003c84';
|
|
252
|
+
export const bpSurfaceDatePickerDaySurfaceSelectedHover = '#003c84';
|
|
253
|
+
export const bpSurfaceDatePickerSurfaceActive = '#ffffff';
|
|
254
|
+
export const bpSurfaceDatePickerSurfaceComplete = '#ffffff';
|
|
255
|
+
export const bpSurfaceDatePickerSurfaceDefault = '#ffffff';
|
|
256
|
+
export const bpSurfaceDatePickerSurfaceDisabled = '#ffffff';
|
|
257
|
+
export const bpSurfaceDatePickerSurfaceError = '#ffffff';
|
|
258
|
+
export const bpSurfaceDatePickerSurfaceFocus = '#ffffff';
|
|
259
|
+
export const bpSurfaceDatePickerSurfaceHover = '#ffffff';
|
|
201
260
|
export const bpSurfaceDropdownPrimarySurfaceHover = '#f4f4f4';
|
|
202
261
|
export const bpSurfaceDropdownPrimarySurfacePressed = '#e8e8e8';
|
|
203
262
|
export const bpSurfaceDropdownSecondarySurface = '#ffffff';
|
|
204
263
|
export const bpSurfaceDropdownSecondarySurfaceHover = '#f4f4f4';
|
|
205
264
|
export const bpSurfaceDropdownSecondarySurfacePressed = '#e8e8e8';
|
|
265
|
+
export const bpSurfaceDropdownTertiarySurfaceHover = '#f4f4f4';
|
|
266
|
+
export const bpSurfaceDropdownTertiarySurfacePressed = '#e8e8e8';
|
|
206
267
|
export const bpSurfaceDropdownSurface = '#ffffff';
|
|
207
268
|
export const bpSurfaceDropdownSurfaceError = '#ffffff';
|
|
208
269
|
export const bpSurfaceDropdownSurfaceErrorFocus = '#ffffff';
|
|
@@ -214,43 +275,47 @@ export const bpSurfaceFilterSurfaceFocus = '#0061d5';
|
|
|
214
275
|
export const bpSurfaceFilterSurfaceHover = '#0061d5';
|
|
215
276
|
export const bpSurfaceFilterSurfaceSelected = '#0061d5';
|
|
216
277
|
export const bpSurfaceFilterSurfaceSelectedFocus = '#0061d5';
|
|
217
|
-
export const
|
|
218
|
-
export const
|
|
219
|
-
export const
|
|
220
|
-
export const
|
|
221
|
-
export const
|
|
222
|
-
export const
|
|
223
|
-
export const
|
|
224
|
-
export const
|
|
278
|
+
export const bpSurfaceFilterChipSurfaceMulti = 'rgba(0, 0, 0, 0.04)';
|
|
279
|
+
export const bpSurfaceFilterChipSurfaceMultiHover = 'rgba(0, 0, 0, 0.08)';
|
|
280
|
+
export const bpSurfaceFilterChipSurfaceMultiOn = '#e5effa';
|
|
281
|
+
export const bpSurfaceFilterChipSurfaceMultiOnHover = '#ccdff7';
|
|
282
|
+
export const bpSurfaceFilterChipSurfaceSingle = 'rgba(0, 0, 0, 0.04)';
|
|
283
|
+
export const bpSurfaceFilterChipSurfaceSingleHover = 'rgba(0, 0, 0, 0.08)';
|
|
284
|
+
export const bpSurfaceFilterChipSurfaceSingleOn = '#0061d5';
|
|
285
|
+
export const bpSurfaceFilterChipSurfaceSingleOnHover = '#0061d5';
|
|
225
286
|
export const bpSurfaceGhostSurface = '#fbfbfb';
|
|
226
287
|
export const bpSurfaceGhostSurfaceSecondary = '#f4f4f4';
|
|
227
288
|
export const bpSurfaceIllustrationSurfaceBox = '#0061d5';
|
|
228
289
|
export const bpSurfaceIllustrationSurfaceBoxNeutral = '#0061d5';
|
|
290
|
+
export const bpSurfaceInlineNoticeSurfaceError = '#fdebee';
|
|
291
|
+
export const bpSurfaceInlineNoticeSurfaceInfo = '#e9f2fe';
|
|
292
|
+
export const bpSurfaceInlineNoticeSurfaceSuccess = '#e9f8f2';
|
|
293
|
+
export const bpSurfaceInlineNoticeSurfaceWarning = '#fffbe5';
|
|
294
|
+
export const bpSurfaceInputSearchSurface = '#f4f4f4';
|
|
295
|
+
export const bpSurfaceInputSearchSurfaceFocus = '#ffffff';
|
|
296
|
+
export const bpSurfaceInputSearchSurfaceFocusPressed = '#ffffff';
|
|
297
|
+
export const bpSurfaceInputSearchSurfaceHover = '#fbfbfb';
|
|
229
298
|
export const bpSurfaceInputSurface = '#ffffff';
|
|
230
299
|
export const bpSurfaceInputSurfaceError = '#ffffff';
|
|
231
300
|
export const bpSurfaceInputSurfaceErrorFocus = '#ffffff';
|
|
232
301
|
export const bpSurfaceInputSurfaceErrorHover = '#ffffff';
|
|
233
302
|
export const bpSurfaceInputSurfaceFocus = '#ffffff';
|
|
234
303
|
export const bpSurfaceInputSurfaceHover = '#ffffff';
|
|
235
|
-
export const
|
|
236
|
-
export const
|
|
237
|
-
export const
|
|
304
|
+
export const bpSurfaceInputChipSurface = '#e8e8e8';
|
|
305
|
+
export const bpSurfaceInputChipSurfaceError = '#fdebee';
|
|
306
|
+
export const bpSurfaceInputChipSurfaceHover = '#e8e8e8';
|
|
238
307
|
export const bpSurfaceItemSmallSurface = '#ffffff';
|
|
239
308
|
export const bpSurfaceItemSmallSurfaceHover = '#f4f4f4';
|
|
240
309
|
export const bpSurfaceItemSmallSurfaceSelected = '#f2f7fd';
|
|
241
310
|
export const bpSurfaceItemSurfaceHover = '#ffffff';
|
|
242
311
|
export const bpSurfaceItemSurfaceSelected = '#f2f7fd';
|
|
312
|
+
export const bpSurfaceListItemSurface = '#ffffff';
|
|
313
|
+
export const bpSurfaceListItemSurfaceSelected = '#f2f7fd';
|
|
243
314
|
export const bpSurfaceMenuSurface = '#ffffff';
|
|
244
|
-
export const
|
|
245
|
-
export const
|
|
246
|
-
export const
|
|
247
|
-
export const
|
|
248
|
-
export const bpSurfaceMessageSurfaceGeneric = '#e8e8e8';
|
|
249
|
-
export const bpSurfaceMessageSurfaceGenericSecondary = '#e8e8e8';
|
|
250
|
-
export const bpSurfaceMessageSurfaceInfoSecondary = '#e9f2fe';
|
|
251
|
-
export const bpSurfaceMessageSurfacePromoSecondary = '#ece9f8';
|
|
252
|
-
export const bpSurfaceMessageSurfaceSuccessSecondary = '#e9f8f2';
|
|
253
|
-
export const bpSurfaceMessageSurfaceWarningSecondary = '#fef7e8';
|
|
315
|
+
export const bpSurfaceMenuItemSurfaceDefault = '#ffffff';
|
|
316
|
+
export const bpSurfaceMenuItemSurfaceHover = '#f4f4f4';
|
|
317
|
+
export const bpSurfaceMenuItemSurfaceLoading = '#ffffff';
|
|
318
|
+
export const bpSurfaceMenuItemSurfacePressed = '#f4f4f4';
|
|
254
319
|
export const bpSurfaceNavSurfaceBrand = '#0061d5';
|
|
255
320
|
export const bpSurfaceOptionGridSurfaceHover = 'rgba(0, 0, 0, 0.04)';
|
|
256
321
|
export const bpSurfaceOptionGridSurfaceSelected = 'rgba(0, 0, 0, 0.08)';
|
|
@@ -258,22 +323,28 @@ export const bpSurfacePageSurface = '#ffffff';
|
|
|
258
323
|
export const bpSurfacePillSurface = '#e8e8e8';
|
|
259
324
|
export const bpSurfacePillSurfaceFocus = '#e8e8e8';
|
|
260
325
|
export const bpSurfacePillSurfaceHover = '#e8e8e8';
|
|
261
|
-
export const
|
|
326
|
+
export const bpSurfaceProgressBarSurfaceBrand = '#0061d5';
|
|
262
327
|
export const bpSurfaceRadioSurface = '#ffffff';
|
|
263
328
|
export const bpSurfaceRadioSurfaceHover = '#ffffff';
|
|
264
329
|
export const bpSurfaceRadioSurfaceSelected = '#0061d5';
|
|
265
330
|
export const bpSurfaceRadioSurfaceSelectedHover = '#2079e3';
|
|
266
|
-
export const
|
|
267
|
-
export const
|
|
268
|
-
export const
|
|
331
|
+
export const bpSurfaceRadioTileSurface = '#ffffff';
|
|
332
|
+
export const bpSurfaceRadioTileSurfaceHover = '#f4f4f4';
|
|
333
|
+
export const bpSurfaceRadioTileSurfaceSelected = '#f2f7fd';
|
|
269
334
|
export const bpSurfaceScrollbarSurface = 'rgba(0, 0, 0, 0.5)';
|
|
270
335
|
export const bpSurfaceSearchGlobalSurface = '#f4f4f4';
|
|
271
336
|
export const bpSurfaceSearchSurface = '#f4f4f4';
|
|
272
337
|
export const bpSurfaceSearchSurfaceFocused = '#ffffff';
|
|
273
338
|
export const bpSurfaceSearchSurfaceHover = '#fbfbfb';
|
|
274
|
-
export const
|
|
275
|
-
export const
|
|
276
|
-
export const
|
|
339
|
+
export const bpSurfaceSelectSurfaceActive = '#ffffff';
|
|
340
|
+
export const bpSurfaceSelectSurfaceDefault = '#ffffff';
|
|
341
|
+
export const bpSurfaceSelectSurfaceDisabled = '#ffffff';
|
|
342
|
+
export const bpSurfaceSelectSurfaceError = '#ffffff';
|
|
343
|
+
export const bpSurfaceSelectSurfaceHover = '#ffffff';
|
|
344
|
+
export const bpSurfaceSelectSurfaceReadOnly = '#fbfbfb';
|
|
345
|
+
export const bpSurfaceSliderThumbSurface = '#0061d5';
|
|
346
|
+
export const bpSurfaceSliderThumbSurfaceHover = '#2486fc';
|
|
347
|
+
export const bpSurfaceSliderTrackSurface = '#6f6f6f';
|
|
277
348
|
export const bpSurfaceStatusSurfaceBoxblue = '#0061d5';
|
|
278
349
|
export const bpSurfaceStatusSurfaceBoxblueFocus = '#0061d5';
|
|
279
350
|
export const bpSurfaceStatusSurfaceBoxblueHover = '#0061d5';
|
|
@@ -308,19 +379,6 @@ export const bpSurfaceStatusSurfaceUploading = '#0061d5';
|
|
|
308
379
|
export const bpSurfaceStatusSurfaceYellow = '#ffeb7f';
|
|
309
380
|
export const bpSurfaceStatusSurfaceYellowFocus = '#ffeb7f';
|
|
310
381
|
export const bpSurfaceStatusSurfaceYellowHover = '#ffeb7f';
|
|
311
|
-
export const bpSurfaceSurface = '#ffffff';
|
|
312
|
-
export const bpSurfaceSurfaceBrand = '#0061d5';
|
|
313
|
-
export const bpSurfaceSurfaceBrandBusy = '#0061d5';
|
|
314
|
-
export const bpSurfaceSurfaceBrandDisabled = '#0061d5';
|
|
315
|
-
export const bpSurfaceSurfaceBrandHover = '#006ae9';
|
|
316
|
-
export const bpSurfaceSurfaceBrandPressed = '#004eac';
|
|
317
|
-
export const bpSurfaceSurfaceBrandSecondary = '#e5effa';
|
|
318
|
-
export const bpSurfaceSurfaceHover = '#f4f4f4';
|
|
319
|
-
export const bpSurfaceSurfaceQuaternary = '#d3d3d3';
|
|
320
|
-
export const bpSurfaceSurfaceSecondary = '#fbfbfb';
|
|
321
|
-
export const bpSurfaceSurfaceSecondaryFocus = '#fbfbfb';
|
|
322
|
-
export const bpSurfaceSurfaceSecondaryHover = '#f4f4f4';
|
|
323
|
-
export const bpSurfaceSurfaceTertiary = '#e8e8e8';
|
|
324
382
|
export const bpSurfaceSwitchSurface = '#ffffff';
|
|
325
383
|
export const bpSurfaceSwitchSurfaceHover = '#ffffff';
|
|
326
384
|
export const bpSurfaceSwitchSurfaceOff = '#d3d3d3';
|
|
@@ -339,16 +397,29 @@ export const bpSurfaceToggleSurfaceOnHover = '#ccdff7';
|
|
|
339
397
|
export const bpSurfaceToggleSurfaceOnPressed = '#b2cff2';
|
|
340
398
|
export const bpSurfaceToggleSurfacePressed = '#0061d5';
|
|
341
399
|
export const bpSurfaceToggleSurfacePressedHover = '#3381dd';
|
|
342
|
-
export const
|
|
343
|
-
export const
|
|
344
|
-
export const
|
|
345
|
-
export const
|
|
346
|
-
export const
|
|
347
|
-
export const
|
|
400
|
+
export const bpSurfaceToggleTextSurfaceOff = '#ffffff';
|
|
401
|
+
export const bpSurfaceToggleTextSurfaceOffHover = '#f4f4f4';
|
|
402
|
+
export const bpSurfaceToggleTextSurfaceOffPressed = '#e8e8e8';
|
|
403
|
+
export const bpSurfaceToggleTextSurfaceOn = '#e5effa';
|
|
404
|
+
export const bpSurfaceToggleTextSurfaceOnHover = '#ccdff7';
|
|
405
|
+
export const bpSurfaceToggleTextSurfaceOnPressed = '#b2cff2';
|
|
348
406
|
export const bpSurfaceToolbarSurface = '#222222';
|
|
349
|
-
export const bpSurfaceTooltipSurface = '
|
|
350
|
-
export const bpSurfaceTooltipSurfaceError = '
|
|
407
|
+
export const bpSurfaceTooltipSurface = 'rgba(0, 0, 0, 0.9)';
|
|
408
|
+
export const bpSurfaceTooltipSurfaceError = 'rgba(237, 55, 87, 0.2)';
|
|
351
409
|
export const bpSurfaceUploadSurfaceBrandNeutral = '#0061d5';
|
|
410
|
+
export const bpSurfaceSurface = '#ffffff';
|
|
411
|
+
export const bpSurfaceSurfaceBrand = '#0061d5';
|
|
412
|
+
export const bpSurfaceSurfaceBrandBusy = '#0061d5';
|
|
413
|
+
export const bpSurfaceSurfaceBrandDisabled = '#0061d5';
|
|
414
|
+
export const bpSurfaceSurfaceBrandHover = '#006ae9';
|
|
415
|
+
export const bpSurfaceSurfaceBrandPressed = '#004eac';
|
|
416
|
+
export const bpSurfaceSurfaceBrandSecondary = '#e5effa';
|
|
417
|
+
export const bpSurfaceSurfaceHover = '#f4f4f4';
|
|
418
|
+
export const bpSurfaceSurfaceQuaternary = '#d3d3d3';
|
|
419
|
+
export const bpSurfaceSurfaceSecondary = '#fbfbfb';
|
|
420
|
+
export const bpSurfaceSurfaceSecondaryFocus = '#fbfbfb';
|
|
421
|
+
export const bpSurfaceSurfaceSecondaryHover = '#f4f4f4';
|
|
422
|
+
export const bpSurfaceSurfaceTertiary = '#e8e8e8';
|
|
352
423
|
export const bpTextCtaLink = '#0061d5';
|
|
353
424
|
export const bpTextCtaLinkDisabled = '#b2cff2';
|
|
354
425
|
export const bpTextCtaLinkHover = '#1d6bca';
|
|
@@ -365,6 +436,7 @@ export const bpTextNavTextOnLight = '#ffffff';
|
|
|
365
436
|
export const bpTextNavTextOnLightFocus = '#ffffff';
|
|
366
437
|
export const bpTextNavTextOnLightHover = '#ffffff';
|
|
367
438
|
export const bpTextNavTextOnLightSelected = '#ffffff';
|
|
439
|
+
export const bpTextToggleTextText = '#004eaa';
|
|
368
440
|
export const bpTextTextBrandOnColor = '#ffffff';
|
|
369
441
|
export const bpTextTextDestructiveOnLight = '#d5324e';
|
|
370
442
|
export const bpTextTextErrorOnLight = '#d5324e';
|
|
@@ -374,7 +446,6 @@ export const bpTextTextOnLightDisabled = '#bcbcbc';
|
|
|
374
446
|
export const bpTextTextOnLightSecondary = '#6f6f6f';
|
|
375
447
|
export const bpTextTextOnLightSecondaryHover = '#4e4e4e';
|
|
376
448
|
export const bpTextTextOnLightTertiary = '#909090';
|
|
377
|
-
export const bpTextToggletextText = '#004eaa';
|
|
378
449
|
export const bpBoxBlue10 = '#e5effa';
|
|
379
450
|
export const bpBoxBlue20 = '#ccdff7';
|
|
380
451
|
export const bpBoxBlue30 = '#b2cff2';
|
|
@@ -672,15 +743,17 @@ export const bpFontLineHeight04 = '1.25rem';
|
|
|
672
743
|
export const bpFontLineHeight05 = '1.5rem';
|
|
673
744
|
export const bpFontLineHeight06 = '2rem';
|
|
674
745
|
export const bpFontLineHeight07 = '2.75rem';
|
|
746
|
+
export const bpFontSize10 = '1.3125rem';
|
|
747
|
+
export const bpFontSize11 = '2.25rem';
|
|
675
748
|
export const bpFontSize01 = '0.5625rem';
|
|
676
749
|
export const bpFontSize02 = '0.625rem';
|
|
677
750
|
export const bpFontSize03 = '0.75rem';
|
|
678
|
-
export const bpFontSize04 = '0.
|
|
751
|
+
export const bpFontSize04 = '0.8125rem';
|
|
679
752
|
export const bpFontSize05 = '0.9375rem';
|
|
680
753
|
export const bpFontSize06 = '1rem';
|
|
681
|
-
export const bpFontSize07 = '1.
|
|
682
|
-
export const bpFontSize08 = '1.
|
|
683
|
-
export const bpFontSize09 = '
|
|
754
|
+
export const bpFontSize07 = '1.0625rem';
|
|
755
|
+
export const bpFontSize08 = '1.125rem';
|
|
756
|
+
export const bpFontSize09 = '1.1875rem';
|
|
684
757
|
export const bpFontWeightBlack = 900;
|
|
685
758
|
export const bpFontWeightBold = 700;
|
|
686
759
|
export const bpFontWeightRegular = 400;
|