@thryveai/theme-interfaces 2.2.3 → 2.3.0-beta

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