@thryveai/theme-interfaces 2.7.115 → 2.7.117

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.
Files changed (62) hide show
  1. package/README.md +29 -29
  2. package/package.json +29 -29
  3. package/dist/index.d.ts +0 -38
  4. package/dist/index.js +0 -41
  5. package/dist/interfaces/admin-images-interfaces.d.ts +0 -11
  6. package/dist/interfaces/admin-images-interfaces.js +0 -2
  7. package/dist/interfaces/admin-settings-interfaces.d.ts +0 -73
  8. package/dist/interfaces/admin-settings-interfaces.js +0 -2
  9. package/dist/interfaces/default-settings.interfaces.d.ts +0 -92
  10. package/dist/interfaces/default-settings.interfaces.js +0 -3
  11. package/dist/interfaces/default-theme.interface.d.ts +0 -736
  12. package/dist/interfaces/default-theme.interface.js +0 -2
  13. package/dist/interfaces/icons.interfaces.d.ts +0 -7
  14. package/dist/interfaces/icons.interfaces.js +0 -2
  15. package/dist/interfaces/retailer-settings.interfaces.d.ts +0 -696
  16. package/dist/interfaces/retailer-settings.interfaces.js +0 -2
  17. package/dist/interfaces/shared-settings-interfaces.d.ts +0 -5
  18. package/dist/interfaces/shared-settings-interfaces.js +0 -2
  19. package/dist/interfaces/shared-settings.interfaces.d.ts +0 -31
  20. package/dist/interfaces/shared-settings.interfaces.js +0 -2
  21. package/dist/interfaces/sts-settings.interfaces.d.ts +0 -6
  22. package/dist/interfaces/sts-settings.interfaces.js +0 -2
  23. package/dist/interfaces/theme.interfaces.d.ts +0 -717
  24. package/dist/interfaces/theme.interfaces.js +0 -2
  25. package/dist/mobile/interfaces/mobile-admin-settings.interfaces.d.ts +0 -8
  26. package/dist/mobile/interfaces/mobile-admin-settings.interfaces.js +0 -2
  27. package/dist/mobile/interfaces/mobile-retailer-settings.interfaces.d.ts +0 -58
  28. package/dist/mobile/interfaces/mobile-retailer-settings.interfaces.js +0 -2
  29. package/dist/mobile/reactnative/MobileDefaultSettings.d.ts +0 -6
  30. package/dist/mobile/reactnative/MobileDefaultSettings.js +0 -21
  31. package/dist/mobile/reactnative/MobileSettingsTemplate.AdminUi.d.ts +0 -2
  32. package/dist/mobile/reactnative/MobileSettingsTemplate.AdminUi.js +0 -96
  33. package/dist/storefront/SFUIImagesTemplate.AdminUi.d.ts +0 -2
  34. package/dist/storefront/SFUIImagesTemplate.AdminUi.js +0 -112
  35. package/dist/storefront/SFUISettingsTemplate.AdminUi.d.ts +0 -16
  36. package/dist/storefront/SFUISettingsTemplate.AdminUi.js +0 -1110
  37. package/dist/storefront/SFUISharedSettingsTemplate.AdminUi.d.ts +0 -4
  38. package/dist/storefront/SFUISharedSettingsTemplate.AdminUi.js +0 -132
  39. package/dist/storefront/SFUIThemesTemplate.AdminUi.d.ts +0 -3
  40. package/dist/storefront/SFUIThemesTemplate.AdminUi.js +0 -113
  41. package/dist/storefront/contentEngineComponents.d.ts +0 -25
  42. package/dist/storefront/contentEngineComponents.js +0 -27
  43. package/dist/storefront/defaultIconsStorefront.d.ts +0 -3
  44. package/dist/storefront/defaultIconsStorefront.js +0 -160
  45. package/dist/storefront/defaultImagesStorefront.d.ts +0 -3
  46. package/dist/storefront/defaultImagesStorefront.js +0 -100
  47. package/dist/storefront/defaultSettingsStorefront.d.ts +0 -3
  48. package/dist/storefront/defaultSettingsStorefront.js +0 -395
  49. package/dist/storefront/defaultSharedSettings.d.ts +0 -3
  50. package/dist/storefront/defaultSharedSettings.js +0 -29
  51. package/dist/storefront/defaultThemeStorefront.d.ts +0 -5
  52. package/dist/storefront/defaultThemeStorefront.js +0 -1207
  53. package/dist/storefront/productBadgeAttributes.d.ts +0 -6
  54. package/dist/storefront/productBadgeAttributes.js +0 -31
  55. package/dist/sts/STSImagesTemplate.AdminUi.d.ts +0 -2
  56. package/dist/sts/STSImagesTemplate.AdminUi.js +0 -72
  57. package/dist/sts/STSSettingsTemplate.AdminUi.d.ts +0 -2
  58. package/dist/sts/STSSettingsTemplate.AdminUi.js +0 -30
  59. package/dist/sts/defaultSettingsSts.d.ts +0 -3
  60. package/dist/sts/defaultSettingsSts.js +0 -9
  61. package/dist/theme-templates/index.d.ts +0 -3
  62. package/dist/theme-templates/index.js +0 -8
package/dist/storefront/defaultThemeStorefront.js DELETED
@@ -1,1207 +0,0 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.DefaultThemeColors = exports.globalTheme = void 0;
4
- var DefaultThemeSFUI = function (colors) {
5
- if (colors === void 0) { colors = exports.DefaultThemeColors; }
6
- return ({
7
- colors: {
8
- brandColors: {
9
- primary1: colors.primary1,
10
- primary2: colors.primary2,
11
- primary3: colors.primary3,
12
- primary4: colors.primary4,
13
- primary5: colors.primary5,
14
- secondary1: colors.secondary1,
15
- secondary2: colors.secondary2,
16
- secondary3: colors.secondary3,
17
- secondary4: colors.secondary4,
18
- secondary5: colors.secondary5,
19
- tertiary1: colors.tertiary1,
20
- tertiary2: colors.tertiary2,
21
- tertiary3: colors.tertiary3,
22
- tertiary4: colors.tertiary4,
23
- tertiary5: colors.tertiary5,
24
- },
25
- uiColors: {
26
- success: colors.success,
27
- successDark: colors.successDark,
28
- successLight: colors.successLight,
29
- warn: colors.warn,
30
- warnDark: colors.warnDark,
31
- warnLight: colors.warnLight,
32
- alert: colors.alert,
33
- alertDark: colors.alertDark,
34
- alertLight: colors.alertLight,
35
- promotion1: colors.promotion1,
36
- promotion2: colors.promotion2,
37
- greyscale1: colors.greyscale1,
38
- greyscale2: colors.greyscale2,
39
- greyscale3: colors.greyscale3,
40
- greyscale4: colors.greyscale4,
41
- greyscale5: colors.greyscale5,
42
- greyscale6: colors.greyscale6,
43
- greyscale7: colors.greyscale7,
44
- },
45
- },
46
- header: {
47
- notifications: {
48
- counter: {
49
- backgroundColor: colors.alert,
50
- },
51
- text: {
52
- color: colors.greyscale1,
53
- hoverColor: colors.greyscale3,
54
- },
55
- seeAllNotifications: { color: colors.greyscale4 },
56
- },
57
- badge: {
58
- cart: {
59
- color: colors.secondary1,
60
- bgColor: colors.greyscale1,
61
- },
62
- cartCurrency: {
63
- color: colors.secondary1,
64
- bgColor: colors.greyscale1,
65
- },
66
- },
67
- topMenu: {
68
- color: colors.greyscale6,
69
- hoverColor: colors.greyscale6,
70
- backgroundColor: colors.greyscale2,
71
- links: {
72
- static: {
73
- color: colors.primary1,
74
- textDecoration: "none",
75
- },
76
- hover: {
77
- color: colors.primary1,
78
- textDecoration: "underline",
79
- },
80
- clicked: {
81
- color: colors.primary1,
82
- textDecoration: "underline",
83
- },
84
- visited: {
85
- color: colors.primary1,
86
- textDecoration: "none",
87
- },
88
- },
89
- },
90
- mainMenu: {
91
- color: colors.greyscale6,
92
- hoverColor: colors.greyscale6,
93
- backgroundColor: colors.greyscale1,
94
- links: {
95
- static: {
96
- color: colors.primary1,
97
- textDecoration: "none",
98
- },
99
- hover: {
100
- color: colors.primary1,
101
- textDecoration: "underline",
102
- },
103
- clicked: {
104
- color: colors.primary1,
105
- textDecoration: "underline",
106
- },
107
- visited: {
108
- color: colors.primary1,
109
- textDecoration: "none",
110
- },
111
- },
112
- },
113
- bottomMenu: {
114
- color: colors.greyscale6,
115
- hoverColor: colors.primary1,
116
- backgroundColor: colors.greyscale1,
117
- textTransform: "capitalize",
118
- fontWeight: exports.globalTheme.FontWeight,
119
- links: {
120
- static: {
121
- color: colors.primary1,
122
- textDecoration: "none",
123
- },
124
- hover: {
125
- color: colors.primary1,
126
- textDecoration: "underline",
127
- },
128
- clicked: {
129
- color: colors.primary1,
130
- textDecoration: "underline",
131
- },
132
- visited: {
133
- color: colors.primary1,
134
- textDecoration: "none",
135
- },
136
- },
137
- },
138
- mobileMenu: {
139
- color: colors.primary1,
140
- hoverColor: colors.primary1,
141
- backgroundColor: colors.greyscale1,
142
- links: {
143
- static: {
144
- color: colors.primary1,
145
- textDecoration: "none",
146
- },
147
- hover: {
148
- color: colors.primary1,
149
- textDecoration: "underline",
150
- },
151
- clicked: {
152
- color: colors.primary1,
153
- textDecoration: "underline",
154
- },
155
- visited: {
156
- color: colors.primary1,
157
- textDecoration: "none",
158
- },
159
- },
160
- },
161
- search: {
162
- borderColor: colors.greyscale3,
163
- borderRadius: "4px",
164
- clearBtnColor: colors.greyscale3,
165
- searchButton: {
166
- desktop: {
167
- static: { color: colors.primary1, backgroundColor: "transparent" },
168
- hover: { color: colors.primary1, backgroundColor: colors.greyscale2 },
169
- clicked: {
170
- color: colors.greyscale1,
171
- backgroundColor: colors.primary1,
172
- },
173
- },
174
- tablet: {
175
- static: { color: colors.primary1 },
176
- clicked: {
177
- color: colors.greyscale1,
178
- },
179
- },
180
- mobile: {
181
- static: { color: colors.primary1 },
182
- },
183
- },
184
- suggestions: {
185
- links: {
186
- color: {
187
- static: "inherit",
188
- hover: "inherit",
189
- visited: "inherit",
190
- },
191
- },
192
- },
193
- multisearchBtn: {
194
- static: {
195
- color: colors.greyscale5,
196
- backgroundColor: colors.primary5,
197
- },
198
- hover: {
199
- color: colors.primary1,
200
- backgroundColor: colors.primary5,
201
- },
202
- },
203
- },
204
- storePopover: {
205
- backgroundColor: colors.primary5,
206
- activeBackgroundColor: colors.secondary5,
207
- color: colors.greyscale5,
208
- activeColor: colors.greyscale5,
209
- borderColor: "transparent",
210
- borderRadius: "4px",
211
- reserveTimeIconPosition: "center",
212
- },
213
- accountPopover: {
214
- backgroundColor: colors.greyscale2,
215
- borderColor: "transparent",
216
- borderRadius: "4px",
217
- color: colors.greyscale5,
218
- links: {
219
- color: {
220
- static: colors.greyscale5,
221
- hover: "inherit",
222
- visited: colors.greyscale5,
223
- },
224
- },
225
- },
226
- headerActionLinks: {
227
- activeBackgroundColor: colors.greyscale2,
228
- activeColor: colors.primary1,
229
- backgroundColor: "none",
230
- borderRadius: exports.globalTheme.BorderRadius,
231
- color: colors.greyscale5,
232
- hoverColor: colors.greyscale5,
233
- fontFamily: exports.globalTheme.FontFamily,
234
- fontWeight: exports.globalTheme.FontWeightBold,
235
- links: {
236
- static: {
237
- color: colors.primary1,
238
- textDecoration: "none",
239
- },
240
- hover: {
241
- color: colors.primary1,
242
- textDecoration: "underline",
243
- },
244
- clicked: {
245
- color: colors.primary1,
246
- textDecoration: "underline",
247
- },
248
- visited: {
249
- color: colors.primary1,
250
- textDecoration: "none",
251
- },
252
- },
253
- },
254
- headerLinks: {
255
- color: colors.greyscale5,
256
- hoverColor: colors.greyscale5,
257
- backgroundColor: "none",
258
- activeColor: colors.greyscale5,
259
- activeBackgroundColor: colors.greyscale2,
260
- fontWeight: exports.globalTheme.FontWeightBold,
261
- borderRadius: exports.globalTheme.BorderRadius,
262
- links: {
263
- static: {
264
- color: colors.primary1,
265
- textDecoration: "none",
266
- },
267
- hover: {
268
- color: colors.primary1,
269
- textDecoration: "underline",
270
- },
271
- clicked: {
272
- color: colors.primary1,
273
- textDecoration: "underline",
274
- },
275
- visited: {
276
- color: colors.primary1,
277
- textDecoration: "none",
278
- },
279
- },
280
- },
281
- departments: {
282
- wrapCategoryTitle: false,
283
- backgroundColor: {
284
- active: "inherit",
285
- static: colors.greyscale2,
286
- },
287
- color: {
288
- static: colors.greyscale5,
289
- hover: colors.primary1,
290
- },
291
- iconColor: {
292
- static: colors.greyscale3,
293
- hover: colors.greyscale3,
294
- },
295
- },
296
- },
297
- body: {
298
- fontSize: exports.globalTheme.baseFontSize,
299
- color: exports.globalTheme.bodyFontColor,
300
- backgroundColor: exports.globalTheme.bodyBackgroundColor,
301
- },
302
- footer: {
303
- mainFooter: {
304
- color: colors.greyscale6,
305
- hoverColor: colors.greyscale6,
306
- backgroundColor: colors.greyscale2,
307
- links: {
308
- static: {
309
- color: colors.primary1,
310
- textDecoration: "none",
311
- },
312
- hover: {
313
- color: colors.primary1,
314
- textDecoration: "underline",
315
- },
316
- clicked: {
317
- color: colors.primary1,
318
- textDecoration: "underline",
319
- },
320
- visited: {
321
- color: colors.primary1,
322
- textDecoration: "none",
323
- },
324
- },
325
- },
326
- bottomFooter: {
327
- color: colors.greyscale1,
328
- hoverColor: colors.greyscale1,
329
- backgroundColor: colors.greyscale5,
330
- links: {
331
- static: {
332
- color: colors.primary1,
333
- textDecoration: "none",
334
- },
335
- hover: {
336
- color: colors.primary1,
337
- textDecoration: "underline",
338
- },
339
- clicked: {
340
- color: colors.primary1,
341
- textDecoration: "underline",
342
- },
343
- visited: {
344
- color: colors.primary1,
345
- textDecoration: "none",
346
- },
347
- },
348
- },
349
- bottomFooterNavHeaderLink: {
350
- color: colors.greyscale6,
351
- hoverColor: colors.greyscale6,
352
- backgroundColor: "transparent",
353
- links: {
354
- static: {
355
- color: colors.primary1,
356
- textDecoration: "none",
357
- },
358
- hover: {
359
- color: colors.primary1,
360
- textDecoration: "underline",
361
- },
362
- clicked: {
363
- color: colors.primary1,
364
- textDecoration: "underline",
365
- },
366
- visited: {
367
- color: colors.primary1,
368
- textDecoration: "none",
369
- },
370
- },
371
- },
372
- mediaIcons: {
373
- color: colors.greyscale5,
374
- },
375
- },
376
- orderConfirmation: {
377
- iconColor: colors.greyscale1,
378
- backgroundColor: colors.successLight,
379
- },
380
- minimalHeader: {
381
- desktop: {
382
- color: colors.secondary1,
383
- hoverColor: colors.secondary1,
384
- backgroundColor: colors.greyscale1,
385
- iconColor: colors.secondary1,
386
- links: {
387
- static: {
388
- color: colors.primary1,
389
- textDecoration: "none",
390
- },
391
- hover: {
392
- color: colors.primary1,
393
- textDecoration: "underline",
394
- },
395
- clicked: {
396
- color: colors.primary1,
397
- textDecoration: "underline",
398
- },
399
- visited: {
400
- color: colors.primary1,
401
- textDecoration: "none",
402
- },
403
- },
404
- },
405
- mobile: {
406
- color: colors.secondary1,
407
- hoverColor: colors.secondary1,
408
- backgroundColor: colors.greyscale1,
409
- iconColor: colors.secondary1,
410
- links: {
411
- static: {
412
- color: colors.primary1,
413
- textDecoration: "none",
414
- },
415
- hover: {
416
- color: colors.primary1,
417
- textDecoration: "underline",
418
- },
419
- clicked: {
420
- color: colors.primary1,
421
- textDecoration: "underline",
422
- },
423
- visited: {
424
- color: colors.primary1,
425
- textDecoration: "none",
426
- },
427
- },
428
- },
429
- },
430
- subHeaderBoxes: {
431
- backgroundColor: colors.greyscale2,
432
- color: colors.greyscale5,
433
- contentBorder: colors.greyscale2,
434
- },
435
- breadcrumb: {
436
- textTransform: "capitalize",
437
- backgroundColor: colors.greyscale2,
438
- color: colors.primary1,
439
- activeColor: colors.greyscale6,
440
- backIconColor: colors.greyscale4,
441
- },
442
- breadcrumbTitle: {
443
- textTransform: "capitalize",
444
- backgroundColor: colors.greyscale2,
445
- color: colors.primary1,
446
- activeColor: colors.greyscale6,
447
- backIconColor: colors.greyscale4,
448
- },
449
- payment: {
450
- selectedCardBackground: colors.primary5,
451
- selectedCardColor: colors.greyscale5,
452
- summary: {
453
- listItemBackground: colors.greyscale2,
454
- },
455
- checkoutCards: {
456
- borderRadius: "4px",
457
- },
458
- },
459
- productPage: {
460
- detailsBackgroundColor: colors.greyscale2,
461
- badges: {
462
- borderRadius: "4px",
463
- },
464
- priceReductionColor: colors.alert,
465
- previouslyPurchased: {
466
- color: colors.greyscale5,
467
- bgColor: colors.primary5,
468
- },
469
- },
470
- accountPage: {
471
- passwordRequirements: {
472
- backgroundColor: colors.primary5,
473
- },
474
- },
475
- favorites: {
476
- headerIconStyle: "FavSolid",
477
- productColors: {
478
- static: {
479
- color: colors.greyscale3,
480
- hoverColor: colors.alert,
481
- },
482
- active: {
483
- color: colors.alert,
484
- hoverColor: colors.alertDark,
485
- },
486
- },
487
- },
488
- promoBadges: {
489
- backgroundColor: {
490
- promotion: colors.promotion1,
491
- pointsBasedPromo: colors.promotion2,
492
- },
493
- fontWeight: exports.globalTheme.FontWeightBold,
494
- color: {
495
- promotion: colors.greyscale1,
496
- pointsBasedPromo: colors.greyscale1,
497
- },
498
- },
499
- loyaltyCard: {
500
- backgroundColor: colors.primary5,
501
- borderColor: colors.primary5,
502
- borderRadius: "16px",
503
- cardTextColor: colors.greyscale5,
504
- dimensions: {
505
- width: 325,
506
- height: 190,
507
- },
508
- input: {
509
- borderRadius: "4px",
510
- backgroundColor: colors.greyscale1,
511
- borderColor: colors.greyscale3,
512
- idFields: {
513
- staticBorder: colors.greyscale4,
514
- hoverBorder: colors.greyscale5,
515
- activeBorder: colors.primary1,
516
- errorBorder: colors.alert,
517
- },
518
- },
519
- infoList: {
520
- color: colors.greyscale4,
521
- borderColor: colors.greyscale2,
522
- },
523
- },
524
- typography: {
525
- webFonts: [
526
- "https://fonts.googleapis.com/css?family=Cabin:400,400i,700,700i&display=swap",
527
- ],
528
- embeddedFonts: [],
529
- weights: {
530
- normal: exports.globalTheme.FontWeight,
531
- bold: exports.globalTheme.FontWeightBold,
532
- },
533
- text: {
534
- body: {
535
- color: colors.greyscale6,
536
- fontFamily: exports.globalTheme.FontFamily,
537
- fontSize: "1rem",
538
- fontWeight: exports.globalTheme.FontWeight,
539
- capitalization: "none",
540
- lineHeight: "1.1875rem",
541
- letterSpacing: "normal",
542
- },
543
- fontXS: {
544
- fontFamily: exports.globalTheme.FontFamily,
545
- fontSize: "0.75rem",
546
- fontWeight: exports.globalTheme.FontWeight,
547
- capitalization: "none",
548
- lineHeight: "0.9375rem",
549
- letterSpacing: "normal",
550
- },
551
- fontSM: {
552
- fontFamily: exports.globalTheme.FontFamily,
553
- fontSize: "0.875rem",
554
- fontWeight: exports.globalTheme.FontWeightBold,
555
- capitalization: "none",
556
- lineHeight: "1rem",
557
- letterSpacing: "normal",
558
- },
559
- fontMD: {
560
- fontFamily: exports.globalTheme.FontFamily,
561
- fontSize: "1rem",
562
- fontWeight: exports.globalTheme.FontWeightBold,
563
- capitalization: "none",
564
- lineHeight: "1.1875rem",
565
- letterSpacing: "normal",
566
- },
567
- fontLG: {
568
- fontFamily: exports.globalTheme.HeadlineFontFamily,
569
- fontSize: "1.5rem",
570
- fontWeight: exports.globalTheme.HeadlineFontWeight,
571
- capitalization: "none",
572
- lineHeight: "1.8125rem",
573
- letterSpacing: "normal",
574
- },
575
- fontXL: {
576
- fontFamily: exports.globalTheme.HeadlineFontFamily,
577
- fontSize: "2rem",
578
- fontWeight: exports.globalTheme.HeadlineFontWeight,
579
- capitalization: "none",
580
- lineHeight: "2.4375rem",
581
- letterSpacing: "normal",
582
- },
583
- },
584
- links: {
585
- static: {
586
- color: colors.primary1,
587
- textDecoration: "none",
588
- },
589
- hover: {
590
- color: colors.primary1,
591
- textDecoration: "underline",
592
- },
593
- clicked: {
594
- color: colors.primary1,
595
- textDecoration: "underline",
596
- },
597
- visited: {
598
- color: colors.primary1,
599
- textDecoration: "none",
600
- },
601
- },
602
- },
603
- buttonLinks: { color: colors.primary1 },
604
- buttons: {
605
- globalThemeBorderRadius: exports.globalTheme.BorderRadius,
606
- globalThemeFontWeight: exports.globalTheme.FontWeightBold,
607
- globalThemeFontFamily: exports.globalTheme.FontFamily,
608
- iconPosition: "left",
609
- miniCart: {
610
- minicartContentPadding: {
611
- bottom: "",
612
- left: "",
613
- right: "",
614
- top: "",
615
- icon: "",
616
- },
617
- textTransform: "capitalize",
618
- backgroundColor: "none",
619
- borderRadius: exports.globalTheme.BorderRadius,
620
- activeBackgroundColor: colors.secondary1,
621
- hoverBackgroundColor: colors.secondary5,
622
- tabletSettings: {
623
- enabled: false,
624
- backgroundColor: "",
625
- backgroundColorHover: "",
626
- iconColor: "",
627
- iconColorHover: "",
628
- showText: false,
629
- textColor: "",
630
- textColorHover: "",
631
- },
632
- color: colors.secondary1,
633
- activeColor: colors.greyscale1,
634
- mobileColor: colors.secondary1,
635
- iconColor: colors.secondary1,
636
- activeIconColor: colors.greyscale1,
637
- mobileIconColor: colors.secondary1,
638
- tabletIconColor: "none",
639
- desktopIconSize: "16px",
640
- mobileIconSize: "24px",
641
- },
642
- primary: {
643
- borderRadius: exports.globalTheme.BorderRadius,
644
- fontWeight: exports.globalTheme.FontWeightBold,
645
- textTransform: "none",
646
- static: {
647
- bgColor: colors.primary1,
648
- borderColor: colors.primary1,
649
- color: colors.greyscale1,
650
- iconColor: colors.greyscale1,
651
- },
652
- hover: {
653
- bgColor: colors.primary2,
654
- borderColor: colors.primary2,
655
- color: colors.greyscale1,
656
- iconColor: colors.greyscale1,
657
- },
658
- clicked: {
659
- bgColor: colors.primary3,
660
- borderColor: colors.primary3,
661
- color: colors.greyscale1,
662
- iconColor: colors.greyscale1,
663
- },
664
- disabled: {
665
- bgColor: colors.primary4,
666
- borderColor: colors.primary4,
667
- color: colors.greyscale1,
668
- iconColor: colors.greyscale3,
669
- },
670
- },
671
- primaryLight: {
672
- borderRadius: exports.globalTheme.BorderRadius,
673
- fontWeight: exports.globalTheme.FontWeightBold,
674
- textTransform: "none",
675
- static: {
676
- bgColor: colors.greyscale1,
677
- borderColor: colors.greyscale1,
678
- color: colors.primary1,
679
- iconColor: colors.primary1,
680
- },
681
- hover: {
682
- bgColor: colors.greyscale1,
683
- borderColor: colors.greyscale1,
684
- color: colors.primary2,
685
- iconColor: colors.primary2,
686
- },
687
- clicked: {
688
- bgColor: colors.greyscale1,
689
- borderColor: colors.greyscale1,
690
- color: colors.primary3,
691
- iconColor: colors.primary3,
692
- },
693
- disabled: {
694
- bgColor: colors.greyscale1,
695
- borderColor: colors.greyscale1,
696
- color: colors.greyscale3,
697
- iconColor: colors.greyscale3,
698
- },
699
- },
700
- secondary: {
701
- borderRadius: exports.globalTheme.BorderRadius,
702
- fontWeight: exports.globalTheme.FontWeightBold,
703
- textTransform: "none",
704
- static: {
705
- bgColor: colors.greyscale1,
706
- borderColor: colors.primary1,
707
- color: colors.primary1,
708
- iconColor: colors.primary1,
709
- },
710
- hover: {
711
- bgColor: colors.primary1,
712
- borderColor: colors.primary1,
713
- color: colors.greyscale1,
714
- iconColor: colors.greyscale1,
715
- },
716
- clicked: {
717
- bgColor: colors.primary2,
718
- borderColor: colors.primary2,
719
- color: colors.greyscale1,
720
- iconColor: colors.greyscale1,
721
- },
722
- disabled: {
723
- bgColor: colors.greyscale1,
724
- borderColor: colors.greyscale3,
725
- color: colors.greyscale3,
726
- iconColor: colors.greyscale3,
727
- },
728
- },
729
- secondaryLight: {
730
- borderRadius: exports.globalTheme.BorderRadius,
731
- fontWeight: exports.globalTheme.FontWeightBold,
732
- textTransform: "none",
733
- static: {
734
- bgColor: "transparent",
735
- borderColor: colors.greyscale1,
736
- color: colors.greyscale1,
737
- iconColor: colors.greyscale1,
738
- },
739
- hover: {
740
- bgColor: colors.greyscale1,
741
- borderColor: colors.greyscale1,
742
- color: colors.primary1,
743
- iconColor: colors.primary1,
744
- },
745
- clicked: {
746
- bgColor: colors.primary2,
747
- borderColor: colors.greyscale1,
748
- color: colors.greyscale1,
749
- iconColor: colors.greyscale1,
750
- },
751
- disabled: {
752
- bgColor: "transparent",
753
- borderColor: colors.greyscale3,
754
- color: colors.greyscale3,
755
- iconColor: colors.greyscale3,
756
- },
757
- },
758
- tertiary: {
759
- borderRadius: exports.globalTheme.BorderRadius,
760
- fontWeight: exports.globalTheme.FontWeightBold,
761
- textTransform: "none",
762
- static: {
763
- bgColor: colors.tertiary1,
764
- borderColor: colors.tertiary1,
765
- color: colors.greyscale5,
766
- iconColor: colors.greyscale5,
767
- },
768
- hover: {
769
- bgColor: colors.tertiary1,
770
- borderColor: colors.tertiary1,
771
- color: colors.primary1,
772
- iconColor: colors.primary1,
773
- },
774
- clicked: {
775
- bgColor: colors.tertiary1,
776
- borderColor: colors.primary1,
777
- color: colors.primary1,
778
- iconColor: colors.primary1,
779
- },
780
- disabled: {
781
- bgColor: colors.greyscale2,
782
- borderColor: colors.greyscale2,
783
- color: colors.greyscale3,
784
- iconColor: colors.greyscale1,
785
- },
786
- },
787
- checkout: {
788
- borderRadius: exports.globalTheme.BorderRadius,
789
- fontWeight: exports.globalTheme.FontWeightBold,
790
- iconColor: colors.greyscale5,
791
- textTransform: "none",
792
- static: {
793
- bgColor: colors.secondary1,
794
- borderColor: colors.secondary1,
795
- color: colors.greyscale1,
796
- },
797
- hover: {
798
- bgColor: colors.secondary2,
799
- borderColor: colors.secondary2,
800
- color: colors.greyscale1,
801
- },
802
- clicked: {
803
- bgColor: colors.secondary3,
804
- borderColor: colors.secondary3,
805
- color: colors.greyscale1,
806
- },
807
- disabled: {
808
- bgColor: colors.secondary4,
809
- borderColor: colors.secondary4,
810
- color: colors.greyscale1,
811
- },
812
- },
813
- quantityStepper: {
814
- borderColor: colors.greyscale3,
815
- borderRadius: exports.globalTheme.BorderRadius,
816
- textTransform: "none",
817
- numericInput: {
818
- fontWeight: exports.globalTheme.FontWeightBold,
819
- fontSize: "0.875rem",
820
- letterSpacing: "normal",
821
- lineHeight: "1.1875rem",
822
- static: {
823
- bgColor: colors.greyscale1,
824
- color: colors.greyscale5,
825
- },
826
- focused: {
827
- bgColor: colors.primary5,
828
- color: colors.greyscale5,
829
- },
830
- },
831
- plusMinusButtons: {
832
- plusMinusIconBgColor: colors.greyscale1,
833
- plusMinusIconColor: colors.primary1,
834
- },
835
- },
836
- coupon: {
837
- borderRadius: exports.globalTheme.BorderRadius,
838
- borderStyle: "dashed",
839
- fontWeight: exports.globalTheme.FontWeightBold,
840
- static: {
841
- bgColor: colors.greyscale1,
842
- borderColor: colors.greyscale3,
843
- color: colors.greyscale5,
844
- couponIconColor: colors.primary1,
845
- },
846
- hover: {
847
- bgColor: colors.greyscale1,
848
- borderColor: colors.greyscale3,
849
- color: colors.greyscale5,
850
- couponIconColor: colors.primary1,
851
- },
852
- clicked: {
853
- bgColor: colors.greyscale1,
854
- borderColor: colors.greyscale3,
855
- color: colors.greyscale5,
856
- couponIconColor: colors.primary1,
857
- },
858
- clipped: {
859
- bgColor: colors.greyscale1,
860
- borderColor: colors.greyscale3,
861
- color: colors.greyscale5,
862
- clippedIconColor: colors.success,
863
- couponIconColor: colors.greyscale5,
864
- },
865
- },
866
- addToCart: {
867
- borderRadius: exports.globalTheme.BorderRadius,
868
- fontWeight: exports.globalTheme.FontWeightBold,
869
- textTransform: "none",
870
- static: {
871
- bgColor: colors.primary1,
872
- borderColor: colors.primary1,
873
- color: colors.greyscale1,
874
- iconColor: colors.secondary1,
875
- },
876
- hover: {
877
- bgColor: colors.primary2,
878
- borderColor: colors.primary1,
879
- color: colors.greyscale1,
880
- iconColor: colors.greyscale1,
881
- },
882
- clicked: {
883
- bgColor: colors.primary3,
884
- borderColor: colors.primary2,
885
- color: colors.greyscale1,
886
- iconColor: colors.greyscale1,
887
- },
888
- disabled: {
889
- bgColor: colors.primary4,
890
- borderColor: colors.primary4,
891
- color: colors.greyscale1,
892
- iconColor: colors.greyscale3,
893
- },
894
- },
895
- pills: {
896
- borderRadius: "500px",
897
- textTransform: "none",
898
- active: {
899
- fontWeight: exports.globalTheme.FontWeightBold,
900
- fontWeightHover: exports.globalTheme.FontWeightBold,
901
- color: colors.greyscale6,
902
- colorHover: colors.greyscale6,
903
- colorVisited: colors.greyscale6,
904
- backgroundColor: colors.primary5,
905
- borderColor: colors.primary1,
906
- borderColorSelected: colors.primary1,
907
- textDecoration: "none",
908
- textDecorationHover: "underline",
909
- padding: "4px 16px",
910
- },
911
- small: {
912
- fontWeight: exports.globalTheme.FontWeightBold,
913
- fontWeightHover: exports.globalTheme.FontWeight,
914
- color: colors.greyscale5,
915
- colorHover: colors.greyscale5,
916
- colorVisited: colors.greyscale5,
917
- backgroundColor: colors.primary5,
918
- borderColor: colors.primary5,
919
- borderColorSelected: colors.primary1,
920
- textDecoration: "none",
921
- textDecorationHover: "underline",
922
- padding: "2px 8px",
923
- },
924
- regular: {
925
- fontWeight: exports.globalTheme.FontWeight,
926
- fontWeightHover: exports.globalTheme.FontWeight,
927
- color: colors.primary1,
928
- colorHover: colors.primary1,
929
- colorVisited: colors.primary1,
930
- backgroundColor: colors.greyscale1,
931
- borderColor: colors.greyscale3,
932
- borderColorSelected: colors.primary1,
933
- textDecoration: "none",
934
- textDecorationHover: "underline",
935
- padding: "4px 16px",
936
- },
937
- },
938
- facets: {
939
- borderRadius: "500px",
940
- textTransform: "none",
941
- fontWeight: 400,
942
- active: {
943
- iconColor: colors.greyscale6,
944
- fontWeight: exports.globalTheme.FontWeightBold,
945
- fontWeightHover: exports.globalTheme.FontWeightBold,
946
- color: colors.greyscale6,
947
- colorHover: colors.greyscale6,
948
- colorVisited: colors.greyscale6,
949
- backgroundColor: colors.primary5,
950
- borderColor: colors.primary1,
951
- borderColorSelected: colors.primary1,
952
- textDecoration: "none",
953
- textDecorationHover: "underline",
954
- padding: "4px 16px",
955
- },
956
- small: {
957
- iconColor: colors.greyscale6,
958
- fontWeight: exports.globalTheme.FontWeightBold,
959
- fontWeightHover: exports.globalTheme.FontWeight,
960
- color: colors.greyscale5,
961
- colorHover: colors.greyscale5,
962
- colorVisited: colors.greyscale5,
963
- backgroundColor: colors.primary5,
964
- borderColor: colors.primary5,
965
- borderColorSelected: colors.primary1,
966
- textDecoration: "none",
967
- textDecorationHover: "underline",
968
- padding: "2px 8px",
969
- },
970
- regular: {
971
- iconColor: colors.greyscale6,
972
- fontWeight: exports.globalTheme.FontWeight,
973
- fontWeightHover: exports.globalTheme.FontWeight,
974
- color: colors.primary1,
975
- colorHover: colors.greyscale5,
976
- colorVisited: colors.primary1,
977
- backgroundColor: colors.greyscale1,
978
- borderColor: colors.greyscale3,
979
- borderColorSelected: colors.primary1,
980
- textDecoration: "none",
981
- textDecorationHover: "underline",
982
- padding: "4px 16px",
983
- },
984
- },
985
- sliderArrows: {
986
- backgroundColor: colors.greyscale2,
987
- sideBorderColor: colors.greyscale3,
988
- iconColor: colors.greyscale4,
989
- },
990
- filterSort: {
991
- color: colors.primary1,
992
- hoverColor: colors.primary2,
993
- borderRadius: exports.globalTheme.BorderRadius,
994
- },
995
- activeAddress: {
996
- backgroundColor: colors.primary3,
997
- borderColor: colors.primary3,
998
- },
999
- timeSlotPaginationDay: {
1000
- selected: {
1001
- backgroundColor: colors.tertiary1,
1002
- },
1003
- },
1004
- paginationNumber: {
1005
- static: {
1006
- color: colors.primary1,
1007
- backgroundColor: "none",
1008
- },
1009
- hover: {
1010
- color: colors.primary1,
1011
- backgroundColor: colors.primary5,
1012
- },
1013
- disabled: {
1014
- color: colors.greyscale1,
1015
- backgroundColor: colors.primary1,
1016
- },
1017
- visited: {
1018
- color: colors.primary1,
1019
- backgroundColor: "none",
1020
- },
1021
- },
1022
- },
1023
- carousel: {
1024
- bannerBackgroundColor: colors.greyscale5,
1025
- carouselPagination: {
1026
- dotBackground: colors.greyscale3,
1027
- activeDotBackground: colors.primary1,
1028
- wrapperBackground: "transparent",
1029
- wrapperHeight: "24px",
1030
- },
1031
- carouselArrows: {
1032
- borderRadius: "50%",
1033
- backgroundColor: "rgba(146, 146, 146, 0.5)",
1034
- activeBackgroundColor: colors.greyscale4,
1035
- iconColor: colors.greyscale1,
1036
- buttonDimension: 56,
1037
- },
1038
- },
1039
- modal: {
1040
- header: {
1041
- mobileBackgroundColor: colors.greyscale2,
1042
- },
1043
- storeIcon: {
1044
- bgColor: colors.tertiary1,
1045
- borderColor: colors.tertiary1,
1046
- color: colors.greyscale5,
1047
- hoverBGColor: colors.tertiary1,
1048
- hoverBorderColor: colors.tertiary1,
1049
- iconColor: colors.greyscale6,
1050
- },
1051
- },
1052
- selectedOption: {
1053
- bgColor: colors.successLight,
1054
- },
1055
- input: {
1056
- borderRadius: "4px",
1057
- static: {
1058
- bgColor: colors.greyscale1,
1059
- borderColor: colors.greyscale3,
1060
- color: colors.greyscale4,
1061
- placeholderColor: colors.greyscale4,
1062
- },
1063
- hover: {
1064
- bgColor: colors.greyscale1,
1065
- borderColor: colors.greyscale3,
1066
- color: colors.greyscale6,
1067
- placeholderColor: colors.greyscale4,
1068
- },
1069
- focus: {
1070
- bgColor: colors.tertiary1,
1071
- borderColor: colors.primary1,
1072
- color: colors.greyscale5,
1073
- placeholderColor: colors.greyscale5,
1074
- },
1075
- disabled: {
1076
- bgColor: colors.greyscale2,
1077
- borderColor: colors.greyscale3,
1078
- color: colors.greyscale4,
1079
- placeholderColor: colors.greyscale2,
1080
- },
1081
- },
1082
- dropdown: {
1083
- iconColor: colors.greyscale4,
1084
- static: {
1085
- bgColor: colors.greyscale1,
1086
- borderColor: colors.greyscale3,
1087
- color: colors.greyscale4,
1088
- },
1089
- hover: {
1090
- bgColor: colors.greyscale1,
1091
- borderColor: colors.greyscale3,
1092
- color: colors.greyscale5,
1093
- },
1094
- open: {
1095
- bgColor: colors.tertiary1,
1096
- borderColor: colors.primary1,
1097
- color: colors.greyscale4,
1098
- },
1099
- options: {
1100
- static: {
1101
- bgColor: colors.greyscale1,
1102
- borderColor: colors.greyscale3,
1103
- color: colors.greyscale4,
1104
- },
1105
- hover: {
1106
- bgColor: colors.tertiary1,
1107
- borderColor: colors.greyscale3,
1108
- color: colors.greyscale4,
1109
- },
1110
- },
1111
- },
1112
- productGrid: {
1113
- borderColor: colors.greyscale2,
1114
- },
1115
- cms: {
1116
- heading: {
1117
- color: colors.greyscale5,
1118
- },
1119
- subheading: {
1120
- color: colors.greyscale4,
1121
- },
1122
- bodyText: {
1123
- color: colors.greyscale5,
1124
- },
1125
- },
1126
- logoHeight: {
1127
- header: {
1128
- desktop: "34px",
1129
- tablet: "30px",
1130
- mobile: "26px",
1131
- },
1132
- modal: {
1133
- desktop: "34px",
1134
- tablet: "30px",
1135
- mobile: "30px",
1136
- },
1137
- content: {
1138
- desktop: "34px",
1139
- tablet: "30px",
1140
- mobile: "26px",
1141
- },
1142
- },
1143
- globalAnimations: {
1144
- confettiAnimation: {
1145
- successModals: {
1146
- colors: [],
1147
- },
1148
- },
1149
- },
1150
- metadata: [
1151
- { name: "msapplication-TileColor", content: "#ffffff" },
1152
- {
1153
- name: "msapplication-TileImage",
1154
- content: "/favicons/ms-icon-144x144.png",
1155
- },
1156
- { name: "theme-color", content: "#ffffff" },
1157
- ],
1158
- scripts: {},
1159
- });
1160
- };
1161
- exports.default = DefaultThemeSFUI;
1162
- exports.globalTheme = {
1163
- BorderRadius: "4px",
1164
- FontFamily: "Cabin, sans-serif",
1165
- baseFontSize: "16px",
1166
- FontWeight: 400,
1167
- FontWeightBold: 700,
1168
- bodyFontColor: "#111111",
1169
- HeadlineFontFamily: "Cabin, sans-serif",
1170
- HeadlineFontWeight: 700,
1171
- bodyBackgroundColor: "#f3f4f6",
1172
- };
1173
- exports.DefaultThemeColors = {
1174
- primary1: "#016abc",
1175
- primary2: "#004f8c",
1176
- primary3: "#002a4b",
1177
- primary4: "#80b4dd",
1178
- primary5: "#e6f0f8",
1179
- secondary1: "#d83A22",
1180
- secondary2: "#aa2003",
1181
- secondary3: "#5b1102",
1182
- secondary4: "#f19582",
1183
- secondary5: "#fceae6",
1184
- tertiary1: "#e6f0f8",
1185
- tertiary2: "#fcefe6",
1186
- tertiary3: "#09448A",
1187
- tertiary4: "",
1188
- tertiary5: "",
1189
- promotion1: "#bc3e31",
1190
- promotion2: "#09448A",
1191
- success: "#218820",
1192
- successDark: "#2e7c49",
1193
- successLight: "#e6f6ec",
1194
- warn: "#fcc260",
1195
- warnDark: "#8f7344",
1196
- warnLight: "#fff6e6",
1197
- alert: "#bc3e31",
1198
- alertDark: "#8c2e24",
1199
- alertLight: "#ffe5e2",
1200
- greyscale1: "#ffffff",
1201
- greyscale2: "#f3f4f6",
1202
- greyscale3: "#ccced0",
1203
- greyscale4: "#71777b",
1204
- greyscale5: "#40464b",
1205
- greyscale6: "#111111",
1206
- greyscale7: "#31363A",
1207
- };