@bonlineza/luxity-lib 2.33.7 → 2.33.8

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 (6) hide show
  1. package/LuxityFooter.js +152 -49
  2. package/LuxityMobileHeader.js +45 -27
  3. package/LuxitySideNav.js +22 -18
  4. package/build/bundle.css +1 -1
  5. package/build/bundle.js +138 -76
  6. package/package.json +1 -1
package/LuxityFooter.js CHANGED
@@ -36,6 +36,65 @@
36
36
  }));
37
37
  }
38
38
 
39
+ function _slicedToArray(arr, i) {
40
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
41
+ }
42
+
43
+ function _arrayWithHoles(arr) {
44
+ if (Array.isArray(arr)) return arr;
45
+ }
46
+
47
+ function _iterableToArrayLimit(arr, i) {
48
+ var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
49
+
50
+ if (_i == null) return;
51
+ var _arr = [];
52
+ var _n = true;
53
+ var _d = false;
54
+
55
+ var _s, _e;
56
+
57
+ try {
58
+ for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
59
+ _arr.push(_s.value);
60
+
61
+ if (i && _arr.length === i) break;
62
+ }
63
+ } catch (err) {
64
+ _d = true;
65
+ _e = err;
66
+ } finally {
67
+ try {
68
+ if (!_n && _i["return"] != null) _i["return"]();
69
+ } finally {
70
+ if (_d) throw _e;
71
+ }
72
+ }
73
+
74
+ return _arr;
75
+ }
76
+
77
+ function _unsupportedIterableToArray(o, minLen) {
78
+ if (!o) return;
79
+ if (typeof o === "string") return _arrayLikeToArray(o, minLen);
80
+ var n = Object.prototype.toString.call(o).slice(8, -1);
81
+ if (n === "Object" && o.constructor) n = o.constructor.name;
82
+ if (n === "Map" || n === "Set") return Array.from(o);
83
+ if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
84
+ }
85
+
86
+ function _arrayLikeToArray(arr, len) {
87
+ if (len == null || len > arr.length) len = arr.length;
88
+
89
+ for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
90
+
91
+ return arr2;
92
+ }
93
+
94
+ function _nonIterableRest() {
95
+ throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
96
+ }
97
+
39
98
  var isCheckBoxInput = (element) => element.type === 'checkbox';
40
99
 
41
100
  var isDateObject = (value) => value instanceof Date;
@@ -1873,16 +1932,16 @@
1873
1932
  buyLinks = _ref$buyLinks === void 0 ? [] : _ref$buyLinks,
1874
1933
  _ref$sellLinks = _ref.sellLinks,
1875
1934
  sellLinks = _ref$sellLinks === void 0 ? [] : _ref$sellLinks,
1876
- _ref$helpLinks = _ref.helpLinks,
1877
- helpLinks = _ref$helpLinks === void 0 ? [] : _ref$helpLinks,
1878
1935
  _ref$companyLinks = _ref.companyLinks,
1879
1936
  companyLinks = _ref$companyLinks === void 0 ? [] : _ref$companyLinks,
1937
+ _ref$storeLinks = _ref.storeLinks,
1938
+ storeLinks = _ref$storeLinks === void 0 ? [] : _ref$storeLinks,
1939
+ _ref$popularLinks = _ref.popularLinks,
1940
+ popularLinks = _ref$popularLinks === void 0 ? [] : _ref$popularLinks,
1880
1941
  _ref$socialLinks = _ref.socialLinks,
1881
1942
  socialLinks = _ref$socialLinks === void 0 ? [] : _ref$socialLinks,
1882
1943
  _ref$contactLinks = _ref.contactLinks,
1883
1944
  contactLinks = _ref$contactLinks === void 0 ? [] : _ref$contactLinks,
1884
- _ref$quickiesLinks = _ref.quickiesLinks,
1885
- quickiesLinks = _ref$quickiesLinks === void 0 ? [] : _ref$quickiesLinks,
1886
1945
  visaImgSrc = _ref.visaImgSrc,
1887
1946
  masterCardSrc = _ref.masterCardSrc,
1888
1947
  logoSrc = _ref.logoSrc,
@@ -1926,6 +1985,76 @@
1926
1985
  })));
1927
1986
  };
1928
1987
 
1988
+ var renderSocialLinks = function renderSocialLinks(links) {
1989
+ return /*#__PURE__*/React__default.createElement("div", {
1990
+ className: "footer__link-container"
1991
+ }, /*#__PURE__*/React__default.createElement("div", {
1992
+ className: "flex gap-2 mb-5"
1993
+ }, links.map(function (link) {
1994
+ return /*#__PURE__*/React__default.createElement("a", {
1995
+ key: link.label,
1996
+ href: link.href,
1997
+ target: "_blank",
1998
+ rel: "noopener noreferrer",
1999
+ className: ""
2000
+ }, link.icon && /*#__PURE__*/React__default.createElement("img", {
2001
+ className: "footer__link-icon",
2002
+ src: link.icon,
2003
+ alt: link.label
2004
+ }));
2005
+ })), /*#__PURE__*/React__default.createElement("div", {
2006
+ className: "footer__links"
2007
+ }, !!contactLinks.map && contactLinks.map(function (link) {
2008
+ return !link.isContact ? /*#__PURE__*/React__default.createElement(GALink, {
2009
+ key: link.label,
2010
+ instance: link.instance,
2011
+ href: link.href,
2012
+ label: link.label,
2013
+ className: "footer__link",
2014
+ rel: "noopener noreferrer",
2015
+ track: link === null || link === void 0 ? void 0 : link.track,
2016
+ target: link.target
2017
+ }, link.label) : /*#__PURE__*/React__default.createElement("div", {
2018
+ className: "footer__text"
2019
+ }, link.label);
2020
+ })));
2021
+ };
2022
+
2023
+ var AccordionSection = function AccordionSection(_ref2) {
2024
+ var title = _ref2.title,
2025
+ links = _ref2.links;
2026
+
2027
+ var _useState = React.useState(false),
2028
+ _useState2 = _slicedToArray(_useState, 2),
2029
+ isOpen = _useState2[0],
2030
+ setIsOpen = _useState2[1];
2031
+
2032
+ var contentRef = React.useRef(null);
2033
+ return /*#__PURE__*/React__default.createElement("div", {
2034
+ className: "border-b border-gray-200"
2035
+ }, /*#__PURE__*/React__default.createElement("button", {
2036
+ type: "button",
2037
+ className: "w-full py-3 px-3 flex justify-between items-center",
2038
+ onClick: function onClick() {
2039
+ return setIsOpen(!isOpen);
2040
+ }
2041
+ }, /*#__PURE__*/React__default.createElement("span", {
2042
+ className: "footer__link-title"
2043
+ }, title), /*#__PURE__*/React__default.createElement("span", null, isOpen ? '-' : '+')), /*#__PURE__*/React__default.createElement("div", {
2044
+ ref: contentRef,
2045
+ className: "px-3 overflow-hidden transition-all duration-500 ease-in-out",
2046
+ style: {
2047
+ maxHeight: isOpen ? "".concat(contentRef.current.scrollHeight, "px") : '0'
2048
+ }
2049
+ }, links.map(function (link) {
2050
+ return /*#__PURE__*/React__default.createElement("a", {
2051
+ key: link.label,
2052
+ href: link.href,
2053
+ className: "footer__link block"
2054
+ }, link.label);
2055
+ })));
2056
+ };
2057
+
1929
2058
  var submitForm = function submitForm(data) {
1930
2059
  onSubmit(data).then(function (res) {
1931
2060
  if (res.success) {
@@ -1980,34 +2109,7 @@
1980
2109
  className: "footer__logo",
1981
2110
  src: logoSrc,
1982
2111
  alt: "luxity-logo"
1983
- })), renderLinks(buyLinks, 'Buy'), /*#__PURE__*/React__default.createElement("div", null, renderLinks(sellLinks, 'Sell'), /*#__PURE__*/React__default.createElement("div", {
1984
- className: "footer__link-child"
1985
- }, renderLinks(companyLinks, 'Company'))), renderLinks(helpLinks, 'Help'), renderLinks(socialLinks, 'Follow us'), /*#__PURE__*/React__default.createElement("div", {
1986
- className: "footer__link-container"
1987
- }, /*#__PURE__*/React__default.createElement("div", {
1988
- className: "footer__link-title"
1989
- }, "Contact"), /*#__PURE__*/React__default.createElement("div", {
1990
- className: "footer__links"
1991
- }, !!contactLinks.map && contactLinks.map(function (link) {
1992
- return !link.isContact ? /*#__PURE__*/React__default.createElement(GALink, {
1993
- key: link.label,
1994
- instance: link.instance,
1995
- href: link.href,
1996
- label: link.label,
1997
- className: "footer__link",
1998
- rel: "noopener noreferrer",
1999
- track: link === null || link === void 0 ? void 0 : link.track,
2000
- target: link.target
2001
- }, link.label) : /*#__PURE__*/React__default.createElement("div", {
2002
- className: "footer__text"
2003
- }, link.label);
2004
- })), /*#__PURE__*/React__default.createElement("div", {
2005
- className: "footer__store-hours"
2006
- }, /*#__PURE__*/React__default.createElement("div", {
2007
- className: "footer__text"
2008
- }, "Monday - Friday"), /*#__PURE__*/React__default.createElement("div", {
2009
- className: "footer__text"
2010
- }, "8:30am - 5pm")))), /*#__PURE__*/React__default.createElement("div", {
2112
+ })), renderLinks(buyLinks, 'Buy'), renderLinks(popularLinks, 'Popular'), renderLinks(sellLinks, 'Sell'), renderLinks(companyLinks, 'Company'), renderLinks(storeLinks, 'Connect'), renderSocialLinks(socialLinks)), /*#__PURE__*/React__default.createElement("div", {
2011
2113
  className: "footer__copyrights-section"
2012
2114
  }, /*#__PURE__*/React__default.createElement("div", {
2013
2115
  className: "footer__payment-icons"
@@ -2021,23 +2123,24 @@
2021
2123
  className: "footer__copyright"
2022
2124
  }, "Copyright ", currentYear, " | Luxity (Pty) LTD | All Rights Reserved | Website Developed by B Online"))), /*#__PURE__*/React__default.createElement("div", {
2023
2125
  className: "footer__wrapper footer__wrapper--mobile"
2024
- }, /*#__PURE__*/React__default.createElement("div", {
2025
- className: "footer__section-row"
2026
- }, renderLinks(quickiesLinks, 'Quickies'), renderLinks(socialLinks, 'Follow us')), /*#__PURE__*/React__default.createElement("div", {
2027
- className: "footer__section-row"
2028
- }, /*#__PURE__*/React__default.createElement("div", {
2029
- className: "footer__link-container"
2030
- }, /*#__PURE__*/React__default.createElement("div", {
2031
- className: "footer__link-title"
2032
- }, "We love..."), /*#__PURE__*/React__default.createElement("div", {
2033
- className: "footer__links"
2034
- }, /*#__PURE__*/React__default.createElement("div", {
2035
- className: "footer__text"
2036
- }, "Visa"), /*#__PURE__*/React__default.createElement("div", {
2037
- className: "footer__text"
2038
- }, "Mastercard"), /*#__PURE__*/React__default.createElement("div", {
2039
- className: "footer__text"
2040
- }, "EFT"))), renderLinks(helpLinks, 'Legal Stuff')), /*#__PURE__*/React__default.createElement("p", {
2126
+ }, /*#__PURE__*/React__default.createElement(AccordionSection, {
2127
+ title: "BUY",
2128
+ links: buyLinks
2129
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
2130
+ title: "POPULAR",
2131
+ links: popularLinks
2132
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
2133
+ title: "SELL",
2134
+ links: sellLinks
2135
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
2136
+ title: "COMPANY",
2137
+ links: companyLinks
2138
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
2139
+ title: "CONNECT",
2140
+ links: storeLinks
2141
+ }), /*#__PURE__*/React__default.createElement("div", {
2142
+ className: "mt-5"
2143
+ }, renderSocialLinks(socialLinks)), /*#__PURE__*/React__default.createElement("p", {
2041
2144
  className: "footer__copyright footer__copyright--mobile"
2042
2145
  }, "Copyright ", currentYear, " | Luxity (Pty) LTD | All Rights Reserved | Website Developed by B Online")));
2043
2146
  };
package/LuxityMobileHeader.js CHANGED
@@ -422,7 +422,7 @@
422
422
  var backIcon = _ref.backIcon,
423
423
  onBackClick = _ref.onBackClick,
424
424
  stores = _ref.stores,
425
- contactUsLink = _ref.contactUsLink;
425
+ onContactUsClick = _ref.onContactUsClick;
426
426
  return /*#__PURE__*/React__default.createElement("div", {
427
427
  className: "side-nav__sub-menu"
428
428
  }, /*#__PURE__*/React__default.createElement("button", {
@@ -452,10 +452,11 @@
452
452
  className: "stores-dropdown__open-days"
453
453
  }, store.weekendOpenDays), /*#__PURE__*/React__default.createElement("div", {
454
454
  className: "stores-dropdown__open-hours"
455
- }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("a", {
456
- href: "".concat(contactUsLink, "/#").concat(store.slug),
457
- className: "stores-dropdown__view-more"
458
- }, ' ', "View More"));
455
+ }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("button", {
456
+ type: "button",
457
+ className: "stores-dropdown__view-more",
458
+ onClick: onContactUsClick
459
+ }, "View More"));
459
460
  })));
460
461
  };
461
462
 
@@ -573,9 +574,9 @@
573
574
  productUrl = _ref.productUrl,
574
575
  onAccountClick = _ref.onAccountClick,
575
576
  onCartClick = _ref.onCartClick,
576
- contactUsLink = _ref.contactUsLink,
577
- ourStoryLink = _ref.ourStoryLink,
578
- blogLink = _ref.blogLink,
577
+ onContactUsClick = _ref.onContactUsClick,
578
+ onOurStoryClick = _ref.onOurStoryClick,
579
+ onBlogClick = _ref.onBlogClick,
579
580
  onSellToUsClick = _ref.onSellToUsClick,
580
581
  stores = _ref.stores,
581
582
  categoryElements = _ref.categoryElements,
@@ -798,19 +799,22 @@
798
799
  onClick: onSellToUsClick
799
800
  }, "Sell To Us")), /*#__PURE__*/React__default.createElement("div", {
800
801
  className: "side-nav__menu-item"
801
- }, /*#__PURE__*/React__default.createElement("a", {
802
- href: ourStoryLink,
803
- className: "side-nav__sub-link"
802
+ }, /*#__PURE__*/React__default.createElement("button", {
803
+ type: "button",
804
+ className: "side-nav__sub-link",
805
+ onClick: onOurStoryClick
804
806
  }, "Our Story")), /*#__PURE__*/React__default.createElement("div", {
805
807
  className: "side-nav__menu-item"
806
- }, /*#__PURE__*/React__default.createElement("a", {
807
- href: blogLink,
808
- className: "side-nav__sub-link"
808
+ }, /*#__PURE__*/React__default.createElement("button", {
809
+ type: "button",
810
+ className: "side-nav__sub-link",
811
+ onClick: onBlogClick
809
812
  }, "Blog")), /*#__PURE__*/React__default.createElement("div", {
810
813
  className: "side-nav__menu-item"
811
- }, /*#__PURE__*/React__default.createElement("a", {
812
- href: contactUsLink,
813
- className: "side-nav__sub-link"
814
+ }, /*#__PURE__*/React__default.createElement("button", {
815
+ type: "button",
816
+ className: "side-nav__sub-link",
817
+ onClick: onContactUsClick
814
818
  }, "Contact Us")), /*#__PURE__*/React__default.createElement("div", {
815
819
  className: "side-nav__menu-item"
816
820
  }, /*#__PURE__*/React__default.createElement("button", {
@@ -913,7 +917,7 @@
913
917
  backIcon: backIcon,
914
918
  onBackClick: onBackClick,
915
919
  stores: stores,
916
- contactUsLink: contactUsLink
920
+ onContactUsClick: onContactUsClick
917
921
  })));
918
922
  };
919
923
 
@@ -998,9 +1002,9 @@
998
1002
  categoryElements = _ref.categoryElements,
999
1003
  onAccountClick = _ref.onAccountClick,
1000
1004
  onDashboardClick = _ref.onDashboardClick,
1001
- contactUsLink = _ref.contactUsLink,
1002
- ourStoryLink = _ref.ourStoryLink,
1003
- blogLink = _ref.blogLink,
1005
+ onContactUsClick = _ref.onContactUsClick,
1006
+ onOurStoryClick = _ref.onOurStoryClick,
1007
+ onBlogClick = _ref.onBlogClick,
1004
1008
  bugReportLink = _ref.bugReportLink,
1005
1009
  onSellToUsClick = _ref.onSellToUsClick,
1006
1010
  onLogoClick = _ref.onLogoClick,
@@ -1177,6 +1181,22 @@
1177
1181
  return handleClick(onSubmissionsClick);
1178
1182
  };
1179
1183
 
1184
+ var handleAccountClick = function handleAccountClick() {
1185
+ return handleClick(onAccountClick);
1186
+ };
1187
+
1188
+ var handleContactUsClick = function handleContactUsClick() {
1189
+ return handleClick(onContactUsClick);
1190
+ };
1191
+
1192
+ var handleOurStoryClick = function handleOurStoryClick() {
1193
+ return handleClick(onOurStoryClick);
1194
+ };
1195
+
1196
+ var handleBlogClick = function handleBlogClick() {
1197
+ return handleClick(onBlogClick);
1198
+ };
1199
+
1180
1200
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
1181
1201
  className: "navbar navbar__mobile-wrapper"
1182
1202
  }, /*#__PURE__*/React__default.createElement("div", {
@@ -1259,11 +1279,11 @@
1259
1279
  closeIcon: closeIcon,
1260
1280
  backIcon: backIcon,
1261
1281
  productUrl: productsUrl,
1262
- onAccountClick: onAccountClick,
1282
+ onAccountClick: handleAccountClick,
1263
1283
  onCartClick: handleCartClick,
1264
- contactUsLink: contactUsLink,
1265
- ourStoryLink: ourStoryLink,
1266
- blogLink: blogLink,
1284
+ onContactUsClick: handleContactUsClick,
1285
+ onOurStoryClick: handleOurStoryClick,
1286
+ onBlogClick: handleBlogClick,
1267
1287
  onSellToUsClick: handleSellToUsClick,
1268
1288
  stores: stores,
1269
1289
  categoryElements: categoryElements,
@@ -1281,8 +1301,6 @@
1281
1301
  onDashboardClick: handleDashboardClick,
1282
1302
  onLogoutClick: handleLogoutClick,
1283
1303
  bugReportLink: bugReportLink,
1284
- ourStoryLink: ourStoryLink,
1285
- blogLink: blogLink,
1286
1304
  onLuxityShopClick: handleLuxityShopClick,
1287
1305
  showSideNav: showSideNav,
1288
1306
  onMenuClick: onMenuClick,
package/LuxitySideNav.js CHANGED
@@ -111,7 +111,7 @@
111
111
  var backIcon = _ref.backIcon,
112
112
  onBackClick = _ref.onBackClick,
113
113
  stores = _ref.stores,
114
- contactUsLink = _ref.contactUsLink;
114
+ onContactUsClick = _ref.onContactUsClick;
115
115
  return /*#__PURE__*/React__default.createElement("div", {
116
116
  className: "side-nav__sub-menu"
117
117
  }, /*#__PURE__*/React__default.createElement("button", {
@@ -141,10 +141,11 @@
141
141
  className: "stores-dropdown__open-days"
142
142
  }, store.weekendOpenDays), /*#__PURE__*/React__default.createElement("div", {
143
143
  className: "stores-dropdown__open-hours"
144
- }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("a", {
145
- href: "".concat(contactUsLink, "/#").concat(store.slug),
146
- className: "stores-dropdown__view-more"
147
- }, ' ', "View More"));
144
+ }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("button", {
145
+ type: "button",
146
+ className: "stores-dropdown__view-more",
147
+ onClick: onContactUsClick
148
+ }, "View More"));
148
149
  })));
149
150
  };
150
151
 
@@ -262,9 +263,9 @@
262
263
  productUrl = _ref.productUrl,
263
264
  onAccountClick = _ref.onAccountClick,
264
265
  onCartClick = _ref.onCartClick,
265
- contactUsLink = _ref.contactUsLink,
266
- ourStoryLink = _ref.ourStoryLink,
267
- blogLink = _ref.blogLink,
266
+ onContactUsClick = _ref.onContactUsClick,
267
+ onOurStoryClick = _ref.onOurStoryClick,
268
+ onBlogClick = _ref.onBlogClick,
268
269
  onSellToUsClick = _ref.onSellToUsClick,
269
270
  stores = _ref.stores,
270
271
  categoryElements = _ref.categoryElements,
@@ -487,19 +488,22 @@
487
488
  onClick: onSellToUsClick
488
489
  }, "Sell To Us")), /*#__PURE__*/React__default.createElement("div", {
489
490
  className: "side-nav__menu-item"
490
- }, /*#__PURE__*/React__default.createElement("a", {
491
- href: ourStoryLink,
492
- className: "side-nav__sub-link"
491
+ }, /*#__PURE__*/React__default.createElement("button", {
492
+ type: "button",
493
+ className: "side-nav__sub-link",
494
+ onClick: onOurStoryClick
493
495
  }, "Our Story")), /*#__PURE__*/React__default.createElement("div", {
494
496
  className: "side-nav__menu-item"
495
- }, /*#__PURE__*/React__default.createElement("a", {
496
- href: blogLink,
497
- className: "side-nav__sub-link"
497
+ }, /*#__PURE__*/React__default.createElement("button", {
498
+ type: "button",
499
+ className: "side-nav__sub-link",
500
+ onClick: onBlogClick
498
501
  }, "Blog")), /*#__PURE__*/React__default.createElement("div", {
499
502
  className: "side-nav__menu-item"
500
- }, /*#__PURE__*/React__default.createElement("a", {
501
- href: contactUsLink,
502
- className: "side-nav__sub-link"
503
+ }, /*#__PURE__*/React__default.createElement("button", {
504
+ type: "button",
505
+ className: "side-nav__sub-link",
506
+ onClick: onContactUsClick
503
507
  }, "Contact Us")), /*#__PURE__*/React__default.createElement("div", {
504
508
  className: "side-nav__menu-item"
505
509
  }, /*#__PURE__*/React__default.createElement("button", {
@@ -602,7 +606,7 @@
602
606
  backIcon: backIcon,
603
607
  onBackClick: onBackClick,
604
608
  stores: stores,
605
- contactUsLink: contactUsLink
609
+ onContactUsClick: onContactUsClick
606
610
  })));
607
611
  };
608
612
 
package/build/bundle.css CHANGED
@@ -1 +1 @@
1
- .navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}.navbar__link-item--desktop{align-items:center;display:flex;height:35px;margin:auto 0;padding-top:5px}.navbar__mobile-wrapper{align-items:center;display:flex;flex-direction:column;padding-bottom:20px;padding-left:32px;padding-right:32px}.navbar__container{display:flex;margin:0 auto;max-width:1280px;padding-left:12px;padding-right:12px;width:100%}.navbar__body{flex-basis:60%}.navbar__wrapper{align-items:center;display:flex;justify-content:space-between;width:100%}.navbar__product-search-wrapper{align-items:center;display:flex;justify-content:center;padding:0 20%;width:100%}@media only screen and (max-width:879px){.navbar__product-search-wrapper{padding:0}}.navbar__input-close-icon{height:auto;margin-bottom:10px;margin-left:10px;width:20px}@media only screen and (max-width:879px){.navbar__input-close-icon{margin-bottom:0;margin-left:0;width:15px}}.navbar__menu-icon{width:30px}.navbar__product-search{align-items:center;display:flex;max-width:545px;width:100%}.navbar__logo-wrapper{margin-right:18px;width:200px}.navbar__logo{width:200px}@media only screen and (max-width:879px){.navbar__logo{margin-left:10px;margin-top:5px;width:125px}}.navbar__form-input{align-items:center;background:transparent;border:none;display:flex;font-size:13px;outline:none;padding:8px;width:100%}.navbar__product-search{border:1px solid #dfdede;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__product-search{border:none;border-bottom:1px solid #dfdede;margin-bottom:0;margin-right:10px;margin-top:10px}}.navbar__section{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;width:100%}.navbar__link{display:inline-block;font-family:Martel Sans;font-size:14px;font-weight:700;margin-right:10px;overflow:hidden;text-transform:uppercase;transition:.3s ease-in-out}.navbar__link:after{background-color:#000;content:"";display:block;height:2px;transition:width .25s ease-out;width:0}.navbar__link:hover:after{width:100%}.navbar__link:hover .navbar__dropdown{animation:fadeInDropdown .3s ease-in-out;display:block}.navbar__dropdown{background-color:#fff;box-shadow:5px 5px 5px #dfdede;display:none;left:0;position:absolute;width:100%;z-index:999}@keyframes fadeInDropdown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar__company-link{font-size:13px;font-weight:400;list-style:none;margin-left:18px;text-decoration:none}.navbar__company-block{align-items:center;background-color:#000;color:#fff;display:flex;font-weight:700;height:33px;justify-content:center;margin-right:0;padding:0 18px;text-transform:uppercase}.navbar__input-search-icon{height:auto;margin-left:1.125rem;margin-right:.375rem;width:15px}.navbar__nav-links{align-items:center;display:flex}.navbar__nav-links--wrap{flex-wrap:wrap}.navbar__icons{align-items:center;display:flex;height:40px;justify-content:flex-end;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__icons{display:block;height:20px;margin-bottom:0}}.navbar__icon{cursor:pointer;height:auto;margin-right:18px;width:20px}@media only screen and (max-width:879px){.navbar__icon{margin-right:0}}.navbar__icon--app{cursor:pointer;height:auto;margin-left:12px;width:20px}@media only screen and (max-width:879px){.navbar__icon--app{margin-right:0}}.navbar__cart-icon{position:relative}.navbar__cart-count{align-items:center;background-color:#000;border-radius:50%;bottom:50%;color:#fff;display:flex;font-size:13px;height:20px;justify-content:center;left:100%;position:absolute;width:20px}.footer__newsletter-section{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-between;padding:2.265rem 0}@media only screen and (max-width:879px){.footer__newsletter-section{flex-direction:column}}.footer__newsletter-wrapper{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__newsletter-wrapper{flex-direction:column}.footer__link-container{flex-basis:50%}}.footer__newsletter-icon{height:30px;position:absolute;right:0;top:0;width:32px}.footer__newsletter-form{flex-basis:50%;max-width:250px;position:relative}@media only screen and (max-width:879px){.footer__newsletter-form{display:block;margin-top:20px;max-width:100%;width:100%}}.footer__newsletter-title{font-family:Martel Sans,sans-serif;font-size:14px;font-weight:700;letter-spacing:3px;margin-bottom:1.125rem;text-transform:uppercase}.footer__newsletter-text{font-size:14px}.footer__form-input{background-color:#000;border:none;border-bottom:1px solid #fff;color:#fff;height:30px;outline:none;width:100%}.footer__form-input::-moz-placeholder{color:#fff;font-weight:400}.footer__form-input::placeholder{color:#fff;font-weight:400}.footer__form-errors{color:#fff;margin-top:5px}.footer__main-section{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:50px;margin-top:80px}.footer__link-title{font-family:El Messiri;font-size:16px;font-weight:700;margin-bottom:20px;text-transform:uppercase}@media only screen and (max-width:879px){.footer__link-title{margin-bottom:10px}}.footer__link-child{margin-top:25px}.footer__links{display:flex;flex-direction:column}.footer__link{color:#939393;cursor:pointer;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__link:hover{color:#000;text-decoration:underline}@media only screen and (max-width:879px){.footer__link{margin-bottom:10px}}.footer__link-wrapper{align-items:center;display:flex;gap:5px}.footer__link-icon{height:13px;margin-bottom:18px}.footer__text{color:#939393;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__store-hours{margin-top:35px}.footer__copyrights-section{border-top:1px solid;display:flex;justify-content:space-between;padding-bottom:20px;padding-top:20px}.footer__logo{height:30px;width:135px}.footer__payment-icons{align-items:center;display:flex}.footer__wrapper{margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__wrapper{padding:32px 0 0 24px}}.footer__wrapper--desktop{display:block}@media only screen and (max-width:879px){.footer__wrapper--desktop{display:none}}.footer__wrapper--mobile{display:none}@media only screen and (max-width:879px){.footer__wrapper--mobile{display:block;padding-top:30px}}.footer__copyright{font-size:10px;line-height:22px}.footer__copyright--mobile{display:none}@media only screen and (max-width:879px){.footer__copyright--mobile{display:block;padding:30px 10px 30px 0;text-align:center}}.footer__section-row{display:flex;gap:50%}@media only screen and (max-width:879px){.footer__section-row{gap:unset}}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{align-items:center;display:flex;font-size:14px;font-weight:700;justify-content:center;line-height:20px;text-transform:uppercase}.side-nav__menu-icon{display:flex;height:25px;margin-right:10px;width:25px}.side-nav__menu-divider{margin-bottom:40px}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;justify-content:space-between;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{font-size:14px;font-weight:700;line-height:20px;text-transform:uppercase}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.dropdown{display:flex;justify-content:space-between;margin-left:auto;margin-right:auto;max-width:1280px;min-height:500px;overflow-x:auto;padding:20px 0}.dropdown__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center;min-height:300px}.dropdown__column{flex:1;padding-left:12px}.dropdown__column:nth-child(2){flex:2}.dropdown__title{font-family:El Messiri;font-size:16px;font-weight:700;letter-spacing:3px;line-height:1;margin-bottom:20px;text-transform:uppercase}.dropdown__elements{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:800px;overflow-y:auto}.dropdown__brand-elements{-moz-column-count:3;column-count:3;max-height:800px}.dropdown__brand-element{cursor:pointer;margin-bottom:10px}.dropdown__element{flex-basis:33.33%;font-family:Martel Sans;font-size:14px;font-weight:400;margin-bottom:10px;text-transform:capitalize}.cover-spinner{align-items:center;background-color:hsla(0,0%,100%,.7);display:flex;height:100%;justify-content:center;min-height:400px;position:relative;top:50%;width:100%;z-index:9999}.cover-spinner:after{animation:spin 1.5s linear infinite;border:4px dotted #000;border-radius:50%;border-top-color:transparent;content:"";display:block;height:40px;position:absolute;width:40px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.stores-dropdown{align-items:flex-start;display:flex;font-family:Martel Sans;gap:20px;margin-left:auto;margin-right:auto;max-width:1280px;overflow-x:auto;padding:20px 15px}.stores-dropdown__image{height:200px;-o-object-fit:cover;object-fit:cover;width:100%}.stores-dropdown__store-details{flex-basis:20%}.stores-dropdown__title{font-family:El Messiri}.stores-dropdown__main-title,.stores-dropdown__title{font-size:16px;font-weight:400;letter-spacing:3px;margin-top:20px}.stores-dropdown__main-title{font-weight:700;margin-bottom:10px}.stores-dropdown__open-days{font-size:12px;font-weight:700;line-height:20px}.stores-dropdown__open-hours{font-size:12px;font-weight:400;line-height:20px}.stores-dropdown__queries-title{font-family:El Messiri;font-size:16px;font-weight:400;letter-spacing:3px}.stores-dropdown__contact-details{font-size:16px;font-weight:700}.stores-dropdown__view-more{cursor:pointer;font-size:14px;font-weight:400;margin-top:10px;text-transform:capitalize}
1
+ .footer__newsletter-section{align-items:center;background-color:#000;color:#fff;display:flex;justify-content:space-between;padding:2.265rem 0}@media only screen and (max-width:879px){.footer__newsletter-section{flex-direction:column}}.footer__newsletter-wrapper{align-items:center;display:flex;justify-content:space-between;margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__newsletter-wrapper{flex-direction:column}.footer__link-container{flex-basis:50%}}.footer__newsletter-icon{height:30px;position:absolute;right:0;top:0;width:32px}.footer__newsletter-form{flex-basis:50%;max-width:250px;position:relative}@media only screen and (max-width:879px){.footer__newsletter-form{display:block;margin-top:20px;max-width:100%;width:100%}}.footer__newsletter-title{font-family:Martel Sans,sans-serif;font-size:14px;font-weight:700;letter-spacing:3px;margin-bottom:1.125rem;text-transform:uppercase}.footer__newsletter-text{font-size:14px}.footer__form-input{background-color:#000;border:none;border-bottom:1px solid #fff;color:#fff;height:30px;outline:none;width:100%}.footer__form-input::-moz-placeholder{color:#fff;font-weight:400}.footer__form-input::placeholder{color:#fff;font-weight:400}.footer__form-errors{color:#fff;margin-top:5px}.footer__main-section{align-items:flex-start;display:flex;justify-content:space-between;margin-bottom:50px;margin-top:80px}.footer__link-title{font-family:El Messiri;font-size:16px;font-weight:700;margin-bottom:20px;text-transform:uppercase}@media only screen and (max-width:879px){.footer__link-title{margin-bottom:10px}}.footer__link-child{margin-top:25px}.footer__links{display:flex;flex-direction:column}.footer__link{color:#939393;cursor:pointer;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:7px;text-align:left;text-decoration:none}.footer__link:hover{color:#000;text-decoration:underline}@media only screen and (max-width:879px){.footer__link{margin-bottom:10px}}.footer__link-wrapper{align-items:center;display:flex;gap:5px}.footer__link-icon{height:30px;margin-bottom:18px}.footer__text{color:#939393;font-family:Martel Sans;font-size:14px;line-height:20px;margin-bottom:15px;text-align:left;text-decoration:none}.footer__store-hours{margin-top:35px}.footer__copyrights-section{border-top:1px solid;display:flex;justify-content:space-between;padding-bottom:20px;padding-top:20px}.footer__logo{height:30px;width:135px}.footer__payment-icons{align-items:center;display:flex}.footer__wrapper{margin:0 auto;max-width:1280px;padding-left:32px;padding-right:32px;width:100%}@media only screen and (max-width:879px){.footer__wrapper{padding:32px 0 0 24px}}.footer__wrapper--desktop{display:block}@media only screen and (max-width:879px){.footer__wrapper--desktop{display:none}}.footer__wrapper--mobile{display:none}@media only screen and (max-width:879px){.footer__wrapper--mobile{display:block;padding-top:30px}}.footer__copyright{font-size:10px;line-height:22px}.footer__copyright--mobile{display:none}@media only screen and (max-width:879px){.footer__copyright--mobile{display:block;padding:30px 10px 30px 0;text-align:center}}.footer__section-row{display:flex;gap:50%}@media only screen and (max-width:879px){.footer__section-row{gap:unset}}.navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}.navbar__link-item--desktop{align-items:center;display:flex;height:35px;margin:auto 0;padding-top:5px}.navbar__mobile-wrapper{align-items:center;display:flex;flex-direction:column;padding-bottom:20px;padding-left:32px;padding-right:32px}.navbar__container{display:flex;margin:0 auto;max-width:1280px;padding-left:12px;padding-right:12px;width:100%}.navbar__body{flex-basis:60%}.navbar__wrapper{align-items:center;display:flex;justify-content:space-between;width:100%}.navbar__product-search-wrapper{align-items:center;display:flex;justify-content:center;padding:0 20%;width:100%}@media only screen and (max-width:879px){.navbar__product-search-wrapper{padding:0}}.navbar__input-close-icon{height:auto;margin-bottom:10px;margin-left:10px;width:20px}@media only screen and (max-width:879px){.navbar__input-close-icon{margin-bottom:0;margin-left:0;width:15px}}.navbar__menu-icon{width:30px}.navbar__product-search{align-items:center;display:flex;max-width:545px;width:100%}.navbar__logo-wrapper{margin-right:18px;width:200px}.navbar__logo{width:200px}@media only screen and (max-width:879px){.navbar__logo{margin-left:10px;margin-top:5px;width:125px}}.navbar__form-input{align-items:center;background:transparent;border:none;display:flex;font-size:13px;outline:none;padding:8px;width:100%}.navbar__product-search{border:1px solid #dfdede;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__product-search{border:none;border-bottom:1px solid #dfdede;margin-bottom:0;margin-right:10px;margin-top:10px}}.navbar__section{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;width:100%}.navbar__link{display:inline-block;font-family:Martel Sans;font-size:14px;font-weight:700;margin-right:10px;overflow:hidden;text-transform:uppercase;transition:.3s ease-in-out}.navbar__link:after{background-color:#000;content:"";display:block;height:2px;transition:width .25s ease-out;width:0}.navbar__link:hover:after{width:100%}.navbar__link:hover .navbar__dropdown{animation:fadeInDropdown .3s ease-in-out;display:block}.navbar__dropdown{background-color:#fff;box-shadow:5px 5px 5px #dfdede;display:none;left:0;position:absolute;width:100%;z-index:999}@keyframes fadeInDropdown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar__company-link{font-size:13px;font-weight:400;list-style:none;margin-left:18px;text-decoration:none}.navbar__company-block{align-items:center;background-color:#000;color:#fff;display:flex;font-weight:700;height:33px;justify-content:center;margin-right:0;padding:0 18px;text-transform:uppercase}.navbar__input-search-icon{height:auto;margin-left:1.125rem;margin-right:.375rem;width:15px}.navbar__nav-links{align-items:center;display:flex}.navbar__nav-links--wrap{flex-wrap:wrap}.navbar__icons{align-items:center;display:flex;height:40px;justify-content:flex-end;margin-bottom:10px}@media only screen and (max-width:879px){.navbar__icons{display:block;height:20px;margin-bottom:0}}.navbar__icon{cursor:pointer;height:auto;margin-right:18px;width:20px}@media only screen and (max-width:879px){.navbar__icon{margin-right:0}}.navbar__icon--app{cursor:pointer;height:auto;margin-left:12px;width:20px}@media only screen and (max-width:879px){.navbar__icon--app{margin-right:0}}.navbar__cart-icon{position:relative}.navbar__cart-count{align-items:center;background-color:#000;border-radius:50%;bottom:50%;color:#fff;display:flex;font-size:13px;height:20px;justify-content:center;left:100%;position:absolute;width:20px}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;justify-content:space-between;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{font-size:14px;font-weight:700;line-height:20px;text-transform:uppercase}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.side-nav{font-family:Martel Sans}.side-nav__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center}.side-nav__overlay{background-color:rgba(78,73,73,.51);height:100%;opacity:0;position:fixed;top:0;transition:opacity .5s ease-out 0s,visibility .5s ease-out 0s;width:100%;z-index:99999}.side-nav__overlay--visible{opacity:1;visibility:visible}.side-nav__overlay--hidden{opacity:1;visibility:hidden}.side-nav__content{background-color:#fff;bottom:0;overflow-y:scroll;padding:1.5rem;position:fixed;top:0;transition:left .5s ease-in-out;width:80%;z-index:99999}.side-nav__content--hidden{display:none}.side-nav__content--open{left:0}.side-nav__content--closed{left:-100%}.side-nav__menu-title-wrapper{align-items:center;background-color:transparent;border:none;display:flex;outline:none;width:100%}.side-nav__icon-container{float:right;margin-bottom:10px}.side-nav__menu-title{align-items:center;display:flex;font-size:14px;font-weight:700;justify-content:center;line-height:20px;text-transform:uppercase}.side-nav__menu-icon{display:flex;height:25px;margin-right:10px;width:25px}.side-nav__menu-divider{margin-bottom:40px}.side-nav__accordion-icon{height:auto;width:15px}.side-nav__menu-item{margin-bottom:25px}.side-nav__close-icon{height:20px;margin-left:auto;width:20px}.side-nav__back-button-wrapper{align-items:center;display:flex;margin-bottom:25px}.side-nav__back-icon{height:20px;width:20px}.side-nav__back-button,.side-nav__sub-menu-title{font-weight:700;text-transform:uppercase}.side-nav__sub-menu-title{font-size:14px;margin-bottom:10px}.side-nav__elements{display:flex;flex-direction:column}.side-nav__element{color:#555;cursor:pointer;line-height:20px;margin-bottom:10px}.side-nav__element,.side-nav__sub-link{font-size:14px;font-weight:400;text-transform:capitalize}.side-nav__block-button{background-color:#000;color:#fff;font-weight:700;padding:10px 0;width:100%}.stores-dropdown{align-items:flex-start;display:flex;font-family:Martel Sans;gap:20px;margin-left:auto;margin-right:auto;max-width:1280px;overflow-x:auto;padding:20px 15px}.stores-dropdown__image{height:200px;-o-object-fit:cover;object-fit:cover;width:100%}.stores-dropdown__store-details{flex-basis:20%}.stores-dropdown__title{font-family:El Messiri}.stores-dropdown__main-title,.stores-dropdown__title{font-size:16px;font-weight:400;letter-spacing:3px;margin-top:20px}.stores-dropdown__main-title{font-weight:700;margin-bottom:10px}.stores-dropdown__open-days{font-size:12px;font-weight:700;line-height:20px}.stores-dropdown__open-hours{font-size:12px;font-weight:400;line-height:20px}.stores-dropdown__queries-title{font-family:El Messiri;font-size:16px;font-weight:400;letter-spacing:3px}.stores-dropdown__contact-details{font-size:16px;font-weight:700}.stores-dropdown__view-more{cursor:pointer;font-size:14px;font-weight:400;margin-top:10px;text-transform:capitalize}.dropdown{display:flex;justify-content:space-between;margin-left:auto;margin-right:auto;max-width:1280px;min-height:500px;overflow-x:auto;padding:20px 0}.dropdown__errors{align-items:center;color:red;display:flex;font-size:16px;justify-content:center;min-height:300px}.dropdown__column{flex:1;padding-left:12px}.dropdown__column:nth-child(2){flex:2}.dropdown__title{font-family:El Messiri;font-size:16px;font-weight:700;letter-spacing:3px;line-height:1;margin-bottom:20px;text-transform:uppercase}.dropdown__elements{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:800px;overflow-y:auto}.dropdown__brand-elements{-moz-column-count:3;column-count:3;max-height:800px}.dropdown__brand-element{cursor:pointer;margin-bottom:10px}.dropdown__element{flex-basis:33.33%;font-family:Martel Sans;font-size:14px;font-weight:400;margin-bottom:10px;text-transform:capitalize}.cover-spinner{align-items:center;background-color:hsla(0,0%,100%,.7);display:flex;height:100%;justify-content:center;min-height:400px;position:relative;top:50%;width:100%;z-index:9999}.cover-spinner:after{animation:spin 1.5s linear infinite;border:4px dotted #000;border-radius:50%;border-top-color:transparent;content:"";display:block;height:40px;position:absolute;width:40px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
package/build/bundle.js CHANGED
@@ -14227,16 +14227,16 @@
14227
14227
  buyLinks = _ref$buyLinks === void 0 ? [] : _ref$buyLinks,
14228
14228
  _ref$sellLinks = _ref.sellLinks,
14229
14229
  sellLinks = _ref$sellLinks === void 0 ? [] : _ref$sellLinks,
14230
- _ref$helpLinks = _ref.helpLinks,
14231
- helpLinks = _ref$helpLinks === void 0 ? [] : _ref$helpLinks,
14232
14230
  _ref$companyLinks = _ref.companyLinks,
14233
14231
  companyLinks = _ref$companyLinks === void 0 ? [] : _ref$companyLinks,
14232
+ _ref$storeLinks = _ref.storeLinks,
14233
+ storeLinks = _ref$storeLinks === void 0 ? [] : _ref$storeLinks,
14234
+ _ref$popularLinks = _ref.popularLinks,
14235
+ popularLinks = _ref$popularLinks === void 0 ? [] : _ref$popularLinks,
14234
14236
  _ref$socialLinks = _ref.socialLinks,
14235
14237
  socialLinks = _ref$socialLinks === void 0 ? [] : _ref$socialLinks,
14236
14238
  _ref$contactLinks = _ref.contactLinks,
14237
14239
  contactLinks = _ref$contactLinks === void 0 ? [] : _ref$contactLinks,
14238
- _ref$quickiesLinks = _ref.quickiesLinks,
14239
- quickiesLinks = _ref$quickiesLinks === void 0 ? [] : _ref$quickiesLinks,
14240
14240
  visaImgSrc = _ref.visaImgSrc,
14241
14241
  masterCardSrc = _ref.masterCardSrc,
14242
14242
  logoSrc = _ref.logoSrc,
@@ -14280,6 +14280,76 @@
14280
14280
  })));
14281
14281
  };
14282
14282
 
14283
+ var renderSocialLinks = function renderSocialLinks(links) {
14284
+ return /*#__PURE__*/React__default.createElement("div", {
14285
+ className: "footer__link-container"
14286
+ }, /*#__PURE__*/React__default.createElement("div", {
14287
+ className: "flex gap-2 mb-5"
14288
+ }, links.map(function (link) {
14289
+ return /*#__PURE__*/React__default.createElement("a", {
14290
+ key: link.label,
14291
+ href: link.href,
14292
+ target: "_blank",
14293
+ rel: "noopener noreferrer",
14294
+ className: ""
14295
+ }, link.icon && /*#__PURE__*/React__default.createElement("img", {
14296
+ className: "footer__link-icon",
14297
+ src: link.icon,
14298
+ alt: link.label
14299
+ }));
14300
+ })), /*#__PURE__*/React__default.createElement("div", {
14301
+ className: "footer__links"
14302
+ }, !!contactLinks.map && contactLinks.map(function (link) {
14303
+ return !link.isContact ? /*#__PURE__*/React__default.createElement(GALink, {
14304
+ key: link.label,
14305
+ instance: link.instance,
14306
+ href: link.href,
14307
+ label: link.label,
14308
+ className: "footer__link",
14309
+ rel: "noopener noreferrer",
14310
+ track: link === null || link === void 0 ? void 0 : link.track,
14311
+ target: link.target
14312
+ }, link.label) : /*#__PURE__*/React__default.createElement("div", {
14313
+ className: "footer__text"
14314
+ }, link.label);
14315
+ })));
14316
+ };
14317
+
14318
+ var AccordionSection = function AccordionSection(_ref2) {
14319
+ var title = _ref2.title,
14320
+ links = _ref2.links;
14321
+
14322
+ var _useState = React.useState(false),
14323
+ _useState2 = _slicedToArray(_useState, 2),
14324
+ isOpen = _useState2[0],
14325
+ setIsOpen = _useState2[1];
14326
+
14327
+ var contentRef = React.useRef(null);
14328
+ return /*#__PURE__*/React__default.createElement("div", {
14329
+ className: "border-b border-gray-200"
14330
+ }, /*#__PURE__*/React__default.createElement("button", {
14331
+ type: "button",
14332
+ className: "w-full py-3 px-3 flex justify-between items-center",
14333
+ onClick: function onClick() {
14334
+ return setIsOpen(!isOpen);
14335
+ }
14336
+ }, /*#__PURE__*/React__default.createElement("span", {
14337
+ className: "footer__link-title"
14338
+ }, title), /*#__PURE__*/React__default.createElement("span", null, isOpen ? '-' : '+')), /*#__PURE__*/React__default.createElement("div", {
14339
+ ref: contentRef,
14340
+ className: "px-3 overflow-hidden transition-all duration-500 ease-in-out",
14341
+ style: {
14342
+ maxHeight: isOpen ? "".concat(contentRef.current.scrollHeight, "px") : '0'
14343
+ }
14344
+ }, links.map(function (link) {
14345
+ return /*#__PURE__*/React__default.createElement("a", {
14346
+ key: link.label,
14347
+ href: link.href,
14348
+ className: "footer__link block"
14349
+ }, link.label);
14350
+ })));
14351
+ };
14352
+
14283
14353
  var submitForm = function submitForm(data) {
14284
14354
  onSubmit(data).then(function (res) {
14285
14355
  if (res.success) {
@@ -14334,34 +14404,7 @@
14334
14404
  className: "footer__logo",
14335
14405
  src: logoSrc,
14336
14406
  alt: "luxity-logo"
14337
- })), renderLinks(buyLinks, 'Buy'), /*#__PURE__*/React__default.createElement("div", null, renderLinks(sellLinks, 'Sell'), /*#__PURE__*/React__default.createElement("div", {
14338
- className: "footer__link-child"
14339
- }, renderLinks(companyLinks, 'Company'))), renderLinks(helpLinks, 'Help'), renderLinks(socialLinks, 'Follow us'), /*#__PURE__*/React__default.createElement("div", {
14340
- className: "footer__link-container"
14341
- }, /*#__PURE__*/React__default.createElement("div", {
14342
- className: "footer__link-title"
14343
- }, "Contact"), /*#__PURE__*/React__default.createElement("div", {
14344
- className: "footer__links"
14345
- }, !!contactLinks.map && contactLinks.map(function (link) {
14346
- return !link.isContact ? /*#__PURE__*/React__default.createElement(GALink, {
14347
- key: link.label,
14348
- instance: link.instance,
14349
- href: link.href,
14350
- label: link.label,
14351
- className: "footer__link",
14352
- rel: "noopener noreferrer",
14353
- track: link === null || link === void 0 ? void 0 : link.track,
14354
- target: link.target
14355
- }, link.label) : /*#__PURE__*/React__default.createElement("div", {
14356
- className: "footer__text"
14357
- }, link.label);
14358
- })), /*#__PURE__*/React__default.createElement("div", {
14359
- className: "footer__store-hours"
14360
- }, /*#__PURE__*/React__default.createElement("div", {
14361
- className: "footer__text"
14362
- }, "Monday - Friday"), /*#__PURE__*/React__default.createElement("div", {
14363
- className: "footer__text"
14364
- }, "8:30am - 5pm")))), /*#__PURE__*/React__default.createElement("div", {
14407
+ })), renderLinks(buyLinks, 'Buy'), renderLinks(popularLinks, 'Popular'), renderLinks(sellLinks, 'Sell'), renderLinks(companyLinks, 'Company'), renderLinks(storeLinks, 'Connect'), renderSocialLinks(socialLinks)), /*#__PURE__*/React__default.createElement("div", {
14365
14408
  className: "footer__copyrights-section"
14366
14409
  }, /*#__PURE__*/React__default.createElement("div", {
14367
14410
  className: "footer__payment-icons"
@@ -14375,23 +14418,24 @@
14375
14418
  className: "footer__copyright"
14376
14419
  }, "Copyright ", currentYear, " | Luxity (Pty) LTD | All Rights Reserved | Website Developed by B Online"))), /*#__PURE__*/React__default.createElement("div", {
14377
14420
  className: "footer__wrapper footer__wrapper--mobile"
14378
- }, /*#__PURE__*/React__default.createElement("div", {
14379
- className: "footer__section-row"
14380
- }, renderLinks(quickiesLinks, 'Quickies'), renderLinks(socialLinks, 'Follow us')), /*#__PURE__*/React__default.createElement("div", {
14381
- className: "footer__section-row"
14382
- }, /*#__PURE__*/React__default.createElement("div", {
14383
- className: "footer__link-container"
14384
- }, /*#__PURE__*/React__default.createElement("div", {
14385
- className: "footer__link-title"
14386
- }, "We love..."), /*#__PURE__*/React__default.createElement("div", {
14387
- className: "footer__links"
14388
- }, /*#__PURE__*/React__default.createElement("div", {
14389
- className: "footer__text"
14390
- }, "Visa"), /*#__PURE__*/React__default.createElement("div", {
14391
- className: "footer__text"
14392
- }, "Mastercard"), /*#__PURE__*/React__default.createElement("div", {
14393
- className: "footer__text"
14394
- }, "EFT"))), renderLinks(helpLinks, 'Legal Stuff')), /*#__PURE__*/React__default.createElement("p", {
14421
+ }, /*#__PURE__*/React__default.createElement(AccordionSection, {
14422
+ title: "BUY",
14423
+ links: buyLinks
14424
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
14425
+ title: "POPULAR",
14426
+ links: popularLinks
14427
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
14428
+ title: "SELL",
14429
+ links: sellLinks
14430
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
14431
+ title: "COMPANY",
14432
+ links: companyLinks
14433
+ }), /*#__PURE__*/React__default.createElement(AccordionSection, {
14434
+ title: "CONNECT",
14435
+ links: storeLinks
14436
+ }), /*#__PURE__*/React__default.createElement("div", {
14437
+ className: "mt-5"
14438
+ }, renderSocialLinks(socialLinks)), /*#__PURE__*/React__default.createElement("p", {
14395
14439
  className: "footer__copyright footer__copyright--mobile"
14396
14440
  }, "Copyright ", currentYear, " | Luxity (Pty) LTD | All Rights Reserved | Website Developed by B Online")));
14397
14441
  };
@@ -15106,7 +15150,7 @@
15106
15150
  var backIcon = _ref.backIcon,
15107
15151
  onBackClick = _ref.onBackClick,
15108
15152
  stores = _ref.stores,
15109
- contactUsLink = _ref.contactUsLink;
15153
+ onContactUsClick = _ref.onContactUsClick;
15110
15154
  return /*#__PURE__*/React__default.createElement("div", {
15111
15155
  className: "side-nav__sub-menu"
15112
15156
  }, /*#__PURE__*/React__default.createElement("button", {
@@ -15136,10 +15180,11 @@
15136
15180
  className: "stores-dropdown__open-days"
15137
15181
  }, store.weekendOpenDays), /*#__PURE__*/React__default.createElement("div", {
15138
15182
  className: "stores-dropdown__open-hours"
15139
- }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("a", {
15140
- href: "".concat(contactUsLink, "/#").concat(store.slug),
15141
- className: "stores-dropdown__view-more"
15142
- }, ' ', "View More"));
15183
+ }, store.weekendOpenHours), /*#__PURE__*/React__default.createElement("button", {
15184
+ type: "button",
15185
+ className: "stores-dropdown__view-more",
15186
+ onClick: onContactUsClick
15187
+ }, "View More"));
15143
15188
  })));
15144
15189
  };
15145
15190
 
@@ -15226,9 +15271,9 @@
15226
15271
  productUrl = _ref.productUrl,
15227
15272
  onAccountClick = _ref.onAccountClick,
15228
15273
  onCartClick = _ref.onCartClick,
15229
- contactUsLink = _ref.contactUsLink,
15230
- ourStoryLink = _ref.ourStoryLink,
15231
- blogLink = _ref.blogLink,
15274
+ onContactUsClick = _ref.onContactUsClick,
15275
+ onOurStoryClick = _ref.onOurStoryClick,
15276
+ onBlogClick = _ref.onBlogClick,
15232
15277
  onSellToUsClick = _ref.onSellToUsClick,
15233
15278
  stores = _ref.stores,
15234
15279
  categoryElements = _ref.categoryElements,
@@ -15451,19 +15496,22 @@
15451
15496
  onClick: onSellToUsClick
15452
15497
  }, "Sell To Us")), /*#__PURE__*/React__default.createElement("div", {
15453
15498
  className: "side-nav__menu-item"
15454
- }, /*#__PURE__*/React__default.createElement("a", {
15455
- href: ourStoryLink,
15456
- className: "side-nav__sub-link"
15499
+ }, /*#__PURE__*/React__default.createElement("button", {
15500
+ type: "button",
15501
+ className: "side-nav__sub-link",
15502
+ onClick: onOurStoryClick
15457
15503
  }, "Our Story")), /*#__PURE__*/React__default.createElement("div", {
15458
15504
  className: "side-nav__menu-item"
15459
- }, /*#__PURE__*/React__default.createElement("a", {
15460
- href: blogLink,
15461
- className: "side-nav__sub-link"
15505
+ }, /*#__PURE__*/React__default.createElement("button", {
15506
+ type: "button",
15507
+ className: "side-nav__sub-link",
15508
+ onClick: onBlogClick
15462
15509
  }, "Blog")), /*#__PURE__*/React__default.createElement("div", {
15463
15510
  className: "side-nav__menu-item"
15464
- }, /*#__PURE__*/React__default.createElement("a", {
15465
- href: contactUsLink,
15466
- className: "side-nav__sub-link"
15511
+ }, /*#__PURE__*/React__default.createElement("button", {
15512
+ type: "button",
15513
+ className: "side-nav__sub-link",
15514
+ onClick: onContactUsClick
15467
15515
  }, "Contact Us")), /*#__PURE__*/React__default.createElement("div", {
15468
15516
  className: "side-nav__menu-item"
15469
15517
  }, /*#__PURE__*/React__default.createElement("button", {
@@ -15566,7 +15614,7 @@
15566
15614
  backIcon: backIcon,
15567
15615
  onBackClick: onBackClick,
15568
15616
  stores: stores,
15569
- contactUsLink: contactUsLink
15617
+ onContactUsClick: onContactUsClick
15570
15618
  })));
15571
15619
  };
15572
15620
 
@@ -15772,9 +15820,9 @@
15772
15820
  categoryElements = _ref.categoryElements,
15773
15821
  onAccountClick = _ref.onAccountClick,
15774
15822
  onDashboardClick = _ref.onDashboardClick,
15775
- contactUsLink = _ref.contactUsLink,
15776
- ourStoryLink = _ref.ourStoryLink,
15777
- blogLink = _ref.blogLink,
15823
+ onContactUsClick = _ref.onContactUsClick,
15824
+ onOurStoryClick = _ref.onOurStoryClick,
15825
+ onBlogClick = _ref.onBlogClick,
15778
15826
  bugReportLink = _ref.bugReportLink,
15779
15827
  onSellToUsClick = _ref.onSellToUsClick,
15780
15828
  onLogoClick = _ref.onLogoClick,
@@ -15951,6 +15999,22 @@
15951
15999
  return handleClick(onSubmissionsClick);
15952
16000
  };
15953
16001
 
16002
+ var handleAccountClick = function handleAccountClick() {
16003
+ return handleClick(onAccountClick);
16004
+ };
16005
+
16006
+ var handleContactUsClick = function handleContactUsClick() {
16007
+ return handleClick(onContactUsClick);
16008
+ };
16009
+
16010
+ var handleOurStoryClick = function handleOurStoryClick() {
16011
+ return handleClick(onOurStoryClick);
16012
+ };
16013
+
16014
+ var handleBlogClick = function handleBlogClick() {
16015
+ return handleClick(onBlogClick);
16016
+ };
16017
+
15954
16018
  return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
15955
16019
  className: "navbar navbar__mobile-wrapper"
15956
16020
  }, /*#__PURE__*/React__default.createElement("div", {
@@ -16033,11 +16097,11 @@
16033
16097
  closeIcon: closeIcon,
16034
16098
  backIcon: backIcon,
16035
16099
  productUrl: productsUrl,
16036
- onAccountClick: onAccountClick,
16100
+ onAccountClick: handleAccountClick,
16037
16101
  onCartClick: handleCartClick,
16038
- contactUsLink: contactUsLink,
16039
- ourStoryLink: ourStoryLink,
16040
- blogLink: blogLink,
16102
+ onContactUsClick: handleContactUsClick,
16103
+ onOurStoryClick: handleOurStoryClick,
16104
+ onBlogClick: handleBlogClick,
16041
16105
  onSellToUsClick: handleSellToUsClick,
16042
16106
  stores: stores,
16043
16107
  categoryElements: categoryElements,
@@ -16055,8 +16119,6 @@
16055
16119
  onDashboardClick: handleDashboardClick,
16056
16120
  onLogoutClick: handleLogoutClick,
16057
16121
  bugReportLink: bugReportLink,
16058
- ourStoryLink: ourStoryLink,
16059
- blogLink: blogLink,
16060
16122
  onLuxityShopClick: handleLuxityShopClick,
16061
16123
  showSideNav: showSideNav,
16062
16124
  onMenuClick: onMenuClick,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bonlineza/luxity-lib",
3
- "version": "2.33.7",
3
+ "version": "2.33.8",
4
4
  "scripts": {
5
5
  "start": "start-storybook -p 9001 -c .storybook -s ./public",
6
6
  "clean": "rimraf ./build/*.*",