@bonlineza/luxity-lib 2.37.0 → 2.37.2
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/AddProductInterest.js +10 -133
- package/GraphQLDropdownSelector.js +10 -132
- package/Interests.js +10 -133
- package/LuxityDesktopHeader.js +62 -12
- package/LuxityGraphQLDropdownSelector.js +10 -132
- package/LuxityMobileHeader.js +63 -8
- package/MaterialSelector.js +10 -132
- package/ModelSelector.js +10 -132
- package/TestComponent.js +15 -0
- package/build/CountryCodeSelect/index.js +18 -0
- package/build/ReactSelectWrapper/index.js +34 -0
- package/build/bundle.css +1 -1
- package/build/bundle.js +85 -146
- package/package.json +1 -1
- package/postcss.config.js +6 -0
- package/build/.gitignore +0 -3
- package/build/.npmignore +0 -0
package/MaterialSelector.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'
|
|
4
|
-
(global = global || self, global.MaterialSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios
|
|
5
|
-
}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'], factory) :
|
|
4
|
+
(global = global || self, global.MaterialSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios));
|
|
5
|
+
}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios) { 'use strict';
|
|
6
6
|
|
|
7
7
|
var React__default = 'default' in React ? React['default'] : React;
|
|
8
8
|
var styled__default = 'default' in styled ? styled['default'] : styled;
|
|
@@ -16,7 +16,6 @@
|
|
|
16
16
|
AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
|
|
17
17
|
var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
|
|
18
18
|
axios = axios && Object.prototype.hasOwnProperty.call(axios, 'default') ? axios['default'] : axios;
|
|
19
|
-
Cookies = Cookies && Object.prototype.hasOwnProperty.call(Cookies, 'default') ? Cookies['default'] : Cookies;
|
|
20
19
|
|
|
21
20
|
function ownKeys(object, enumerableOnly) {
|
|
22
21
|
var keys = Object.keys(object);
|
|
@@ -11010,127 +11009,6 @@
|
|
|
11010
11009
|
}));
|
|
11011
11010
|
});
|
|
11012
11011
|
|
|
11013
|
-
function getToken() {
|
|
11014
|
-
var _Cookies$get;
|
|
11015
|
-
|
|
11016
|
-
return (_Cookies$get = Cookies.get('_tk')) === null || _Cookies$get === void 0 ? void 0 : _Cookies$get.replace('*', 'Bearer ');
|
|
11017
|
-
}
|
|
11018
|
-
function setToken(value) {
|
|
11019
|
-
Cookies.set('_tk', value, 30);
|
|
11020
|
-
}
|
|
11021
|
-
|
|
11022
|
-
/** @format */
|
|
11023
|
-
|
|
11024
|
-
function getEncodedSearch(currentUrl) {
|
|
11025
|
-
var splitUrl = currentUrl.split('?');
|
|
11026
|
-
var baseUrl = splitUrl[0];
|
|
11027
|
-
var nextUrlSegments = splitUrl[1].split('&');
|
|
11028
|
-
var nextQueryString = splitUrl[1];
|
|
11029
|
-
|
|
11030
|
-
if (nextUrlSegments.length > 0) {
|
|
11031
|
-
nextQueryString = nextUrlSegments.map(function (v) {
|
|
11032
|
-
var nextValue = v;
|
|
11033
|
-
|
|
11034
|
-
if (v.includes('search=')) {
|
|
11035
|
-
var temp = v.split('=');
|
|
11036
|
-
nextValue = "".concat(temp[0], "=").concat(encodeURIComponent(temp[1]));
|
|
11037
|
-
}
|
|
11038
|
-
|
|
11039
|
-
return nextValue;
|
|
11040
|
-
}).join('&');
|
|
11041
|
-
}
|
|
11042
|
-
|
|
11043
|
-
return "".concat(baseUrl, "?").concat(nextQueryString);
|
|
11044
|
-
}
|
|
11045
|
-
/**
|
|
11046
|
-
* Gets an instance of Axios that is configured with the custom failure handlers
|
|
11047
|
-
* @param {Function} onAuthFailed - callback triggers when auth fails - ie, server error is one of ['token_invalid', 'token_not_provided', 'user_not_found', 'token_expired'] or http status is one of [401, 503, 400]
|
|
11048
|
-
* @param {Function} onForbidden - callback triggers when http status = 403
|
|
11049
|
-
*/
|
|
11050
|
-
|
|
11051
|
-
|
|
11052
|
-
var axiosInstance = function axiosInstance(onAuthFailed, onForbidden) {
|
|
11053
|
-
var instance = axios.create({
|
|
11054
|
-
validateStatus: function validateStatus(status) {
|
|
11055
|
-
return status >= 200 && status < 300;
|
|
11056
|
-
}
|
|
11057
|
-
});
|
|
11058
|
-
var token = getToken();
|
|
11059
|
-
|
|
11060
|
-
if (token !== '') {
|
|
11061
|
-
instance.defaults.headers.common.Authorization = token;
|
|
11062
|
-
}
|
|
11063
|
-
|
|
11064
|
-
instance.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8'; // Add a request interceptor
|
|
11065
|
-
|
|
11066
|
-
instance.interceptors.request.use(function (request, error) {
|
|
11067
|
-
if (error) {
|
|
11068
|
-
return Promise.reject(error.response);
|
|
11069
|
-
}
|
|
11070
|
-
|
|
11071
|
-
if (request.url.includes('search') && request.url.includes('?')) {
|
|
11072
|
-
// do some uri manipulation for ie
|
|
11073
|
-
// https://stackoverflow.com/questions/18220057
|
|
11074
|
-
// eslint-disable-next-line no-param-reassign
|
|
11075
|
-
request.url = getEncodedSearch(request.url);
|
|
11076
|
-
} // eslint-disable-next-line no-param-reassign
|
|
11077
|
-
|
|
11078
|
-
|
|
11079
|
-
request.headers.common['Content-Type'] = 'application/json; charset=utf-8';
|
|
11080
|
-
|
|
11081
|
-
if (typeof request.body === 'undefined') {
|
|
11082
|
-
request.body = {};
|
|
11083
|
-
}
|
|
11084
|
-
|
|
11085
|
-
token = getToken();
|
|
11086
|
-
|
|
11087
|
-
if (token !== '') {
|
|
11088
|
-
// eslint-disable-next-line no-param-reassign
|
|
11089
|
-
request.headers.common.Authorization = token;
|
|
11090
|
-
}
|
|
11091
|
-
|
|
11092
|
-
return request;
|
|
11093
|
-
}, function (error) {
|
|
11094
|
-
return Promise.reject(error.message);
|
|
11095
|
-
}); // Add a response interceptor
|
|
11096
|
-
|
|
11097
|
-
instance.interceptors.response.use(function (response, error) {
|
|
11098
|
-
if (error) {
|
|
11099
|
-
return Promise.reject(error.response);
|
|
11100
|
-
}
|
|
11101
|
-
|
|
11102
|
-
if (response.headers.authorization) {
|
|
11103
|
-
setToken(response.headers.authorization);
|
|
11104
|
-
}
|
|
11105
|
-
|
|
11106
|
-
return response;
|
|
11107
|
-
}, function (error) {
|
|
11108
|
-
if (error.response) {
|
|
11109
|
-
// network error
|
|
11110
|
-
if (error.response.data && error.response.data.error && (error.response.data.error === 'token_invalid' || error.response.data.error === 'token_not_provided' || error.response.data.error === 'user_not_found' || error.response.data.error === 'token_expired') || error.response.status === 401 || error.response.status === 503 || error.response.status === 400) {
|
|
11111
|
-
onAuthFailed();
|
|
11112
|
-
} // if (error.response.status === 500) {
|
|
11113
|
-
// // INTERNAL SERVER ERROR
|
|
11114
|
-
// store.dispatch({
|
|
11115
|
-
// type: AppConstants.OVERLAY.SERVER_ERROR,
|
|
11116
|
-
// });
|
|
11117
|
-
// return Promise.reject(error.response);
|
|
11118
|
-
// }
|
|
11119
|
-
|
|
11120
|
-
|
|
11121
|
-
if (error.response.status === 403) {
|
|
11122
|
-
// FORBIDDEN
|
|
11123
|
-
onForbidden();
|
|
11124
|
-
}
|
|
11125
|
-
|
|
11126
|
-
return Promise.reject(error.response);
|
|
11127
|
-
}
|
|
11128
|
-
|
|
11129
|
-
return Promise.reject(error);
|
|
11130
|
-
});
|
|
11131
|
-
return instance;
|
|
11132
|
-
}; // NOTE: this to be instanciated with params: onAuthFailed, onForbidden
|
|
11133
|
-
|
|
11134
11012
|
var _excluded$8 = ["children"];
|
|
11135
11013
|
|
|
11136
11014
|
var DropdownSelector = function DropdownSelector(_ref) {
|
|
@@ -11352,7 +11230,7 @@
|
|
|
11352
11230
|
case 0:
|
|
11353
11231
|
_context.prev = 0;
|
|
11354
11232
|
_context.next = 3;
|
|
11355
|
-
return
|
|
11233
|
+
return requestInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
|
|
11356
11234
|
query: getBrandsGraphQuery(1000, 1, 'id|desc')
|
|
11357
11235
|
});
|
|
11358
11236
|
|
|
@@ -11383,7 +11261,7 @@
|
|
|
11383
11261
|
}
|
|
11384
11262
|
}
|
|
11385
11263
|
}, _callee, null, [[0, 7]]);
|
|
11386
|
-
})), [baseGraphApi, getBrandsGraphQuery]);
|
|
11264
|
+
})), [baseGraphApi, getBrandsGraphQuery, requestInstance]);
|
|
11387
11265
|
var fetchModels = React.useCallback( /*#__PURE__*/function () {
|
|
11388
11266
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(brandId) {
|
|
11389
11267
|
var _response$data2, _response$data2$data, _response$data2$data$, response, formattedModels;
|
|
@@ -11394,7 +11272,7 @@
|
|
|
11394
11272
|
case 0:
|
|
11395
11273
|
_context2.prev = 0;
|
|
11396
11274
|
_context2.next = 3;
|
|
11397
|
-
return
|
|
11275
|
+
return requestInstance.post("".concat(baseGraphApi, "?id=getModels"), {
|
|
11398
11276
|
query: getModelsGraphQuery(brandId)
|
|
11399
11277
|
});
|
|
11400
11278
|
|
|
@@ -11430,7 +11308,7 @@
|
|
|
11430
11308
|
return function (_x) {
|
|
11431
11309
|
return _ref3.apply(this, arguments);
|
|
11432
11310
|
};
|
|
11433
|
-
}(), [baseGraphApi, getModelsGraphQuery]);
|
|
11311
|
+
}(), [baseGraphApi, getModelsGraphQuery, requestInstance]);
|
|
11434
11312
|
var fetchMaterials = React.useCallback( /*#__PURE__*/function () {
|
|
11435
11313
|
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(brandId) {
|
|
11436
11314
|
var _response$data3, _response$data3$data, _response$data3$data$, response, formattedMaterials;
|
|
@@ -11441,7 +11319,7 @@
|
|
|
11441
11319
|
case 0:
|
|
11442
11320
|
_context3.prev = 0;
|
|
11443
11321
|
_context3.next = 3;
|
|
11444
|
-
return
|
|
11322
|
+
return requestInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
|
|
11445
11323
|
query: getMaterialsGraphQuery(brandId)
|
|
11446
11324
|
});
|
|
11447
11325
|
|
|
@@ -11477,7 +11355,7 @@
|
|
|
11477
11355
|
return function (_x2) {
|
|
11478
11356
|
return _ref4.apply(this, arguments);
|
|
11479
11357
|
};
|
|
11480
|
-
}(), [baseGraphApi, getMaterialsGraphQuery]);
|
|
11358
|
+
}(), [baseGraphApi, getMaterialsGraphQuery, requestInstance]);
|
|
11481
11359
|
React.useEffect(function () {
|
|
11482
11360
|
fetchBrands();
|
|
11483
11361
|
}, [fetchBrands]);
|
package/ModelSelector.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')
|
|
3
|
-
typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'
|
|
4
|
-
(global = global || self, global.ModelSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios
|
|
5
|
-
}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react'), require('styled-components'), require('@bonlineza/b-lib/EllipsisLoader'), require('@bonlineza/b-lib/PageReady'), require('react-animate-height'), require('numeral'), require('stylis-rule-sheet'), require('react-dom'), require('prop-types'), require('raf'), require('react-input-autosize'), require('react-transition-group'), require('@bonlineza/b-lib/functions'), require('rc-slider'), require('react-notify-toast'), require('axios')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['react', 'styled-components', '@bonlineza/b-lib/EllipsisLoader', '@bonlineza/b-lib/PageReady', 'react-animate-height', 'numeral', 'stylis-rule-sheet', 'react-dom', 'prop-types', 'raf', 'react-input-autosize', 'react-transition-group', '@bonlineza/b-lib/functions', 'rc-slider', 'react-notify-toast', 'axios'], factory) :
|
|
4
|
+
(global = global || self, global.ModelSelector = factory(global.React, global.styled, global.EllipsisLoader, global.PageReady, global.AnimateHeight, global.numeral, global['stylis-rule-sheet'], global.reactDom, global.PropTypes, global.raf, global['react-input-autosize'], global['react-transition-group'], global.function, global.rcSlider, global['react-notify-toast'], global.axios));
|
|
5
|
+
}(this, (function (React, styled, EllipsisLoader, PageReady, AnimateHeight, numeral, stylisRuleSheet, reactDom, PropTypes, raf, AutosizeInput, reactTransitionGroup, functions, rcSlider, Notifications, axios) { 'use strict';
|
|
6
6
|
|
|
7
7
|
var React__default = 'default' in React ? React['default'] : React;
|
|
8
8
|
var styled__default = 'default' in styled ? styled['default'] : styled;
|
|
@@ -16,7 +16,6 @@
|
|
|
16
16
|
AutosizeInput = AutosizeInput && Object.prototype.hasOwnProperty.call(AutosizeInput, 'default') ? AutosizeInput['default'] : AutosizeInput;
|
|
17
17
|
var Notifications__default = 'default' in Notifications ? Notifications['default'] : Notifications;
|
|
18
18
|
axios = axios && Object.prototype.hasOwnProperty.call(axios, 'default') ? axios['default'] : axios;
|
|
19
|
-
Cookies = Cookies && Object.prototype.hasOwnProperty.call(Cookies, 'default') ? Cookies['default'] : Cookies;
|
|
20
19
|
|
|
21
20
|
function ownKeys(object, enumerableOnly) {
|
|
22
21
|
var keys = Object.keys(object);
|
|
@@ -11010,127 +11009,6 @@
|
|
|
11010
11009
|
}));
|
|
11011
11010
|
});
|
|
11012
11011
|
|
|
11013
|
-
function getToken() {
|
|
11014
|
-
var _Cookies$get;
|
|
11015
|
-
|
|
11016
|
-
return (_Cookies$get = Cookies.get('_tk')) === null || _Cookies$get === void 0 ? void 0 : _Cookies$get.replace('*', 'Bearer ');
|
|
11017
|
-
}
|
|
11018
|
-
function setToken(value) {
|
|
11019
|
-
Cookies.set('_tk', value, 30);
|
|
11020
|
-
}
|
|
11021
|
-
|
|
11022
|
-
/** @format */
|
|
11023
|
-
|
|
11024
|
-
function getEncodedSearch(currentUrl) {
|
|
11025
|
-
var splitUrl = currentUrl.split('?');
|
|
11026
|
-
var baseUrl = splitUrl[0];
|
|
11027
|
-
var nextUrlSegments = splitUrl[1].split('&');
|
|
11028
|
-
var nextQueryString = splitUrl[1];
|
|
11029
|
-
|
|
11030
|
-
if (nextUrlSegments.length > 0) {
|
|
11031
|
-
nextQueryString = nextUrlSegments.map(function (v) {
|
|
11032
|
-
var nextValue = v;
|
|
11033
|
-
|
|
11034
|
-
if (v.includes('search=')) {
|
|
11035
|
-
var temp = v.split('=');
|
|
11036
|
-
nextValue = "".concat(temp[0], "=").concat(encodeURIComponent(temp[1]));
|
|
11037
|
-
}
|
|
11038
|
-
|
|
11039
|
-
return nextValue;
|
|
11040
|
-
}).join('&');
|
|
11041
|
-
}
|
|
11042
|
-
|
|
11043
|
-
return "".concat(baseUrl, "?").concat(nextQueryString);
|
|
11044
|
-
}
|
|
11045
|
-
/**
|
|
11046
|
-
* Gets an instance of Axios that is configured with the custom failure handlers
|
|
11047
|
-
* @param {Function} onAuthFailed - callback triggers when auth fails - ie, server error is one of ['token_invalid', 'token_not_provided', 'user_not_found', 'token_expired'] or http status is one of [401, 503, 400]
|
|
11048
|
-
* @param {Function} onForbidden - callback triggers when http status = 403
|
|
11049
|
-
*/
|
|
11050
|
-
|
|
11051
|
-
|
|
11052
|
-
var axiosInstance = function axiosInstance(onAuthFailed, onForbidden) {
|
|
11053
|
-
var instance = axios.create({
|
|
11054
|
-
validateStatus: function validateStatus(status) {
|
|
11055
|
-
return status >= 200 && status < 300;
|
|
11056
|
-
}
|
|
11057
|
-
});
|
|
11058
|
-
var token = getToken();
|
|
11059
|
-
|
|
11060
|
-
if (token !== '') {
|
|
11061
|
-
instance.defaults.headers.common.Authorization = token;
|
|
11062
|
-
}
|
|
11063
|
-
|
|
11064
|
-
instance.defaults.headers.common['Content-Type'] = 'application/json;charset=UTF-8'; // Add a request interceptor
|
|
11065
|
-
|
|
11066
|
-
instance.interceptors.request.use(function (request, error) {
|
|
11067
|
-
if (error) {
|
|
11068
|
-
return Promise.reject(error.response);
|
|
11069
|
-
}
|
|
11070
|
-
|
|
11071
|
-
if (request.url.includes('search') && request.url.includes('?')) {
|
|
11072
|
-
// do some uri manipulation for ie
|
|
11073
|
-
// https://stackoverflow.com/questions/18220057
|
|
11074
|
-
// eslint-disable-next-line no-param-reassign
|
|
11075
|
-
request.url = getEncodedSearch(request.url);
|
|
11076
|
-
} // eslint-disable-next-line no-param-reassign
|
|
11077
|
-
|
|
11078
|
-
|
|
11079
|
-
request.headers.common['Content-Type'] = 'application/json; charset=utf-8';
|
|
11080
|
-
|
|
11081
|
-
if (typeof request.body === 'undefined') {
|
|
11082
|
-
request.body = {};
|
|
11083
|
-
}
|
|
11084
|
-
|
|
11085
|
-
token = getToken();
|
|
11086
|
-
|
|
11087
|
-
if (token !== '') {
|
|
11088
|
-
// eslint-disable-next-line no-param-reassign
|
|
11089
|
-
request.headers.common.Authorization = token;
|
|
11090
|
-
}
|
|
11091
|
-
|
|
11092
|
-
return request;
|
|
11093
|
-
}, function (error) {
|
|
11094
|
-
return Promise.reject(error.message);
|
|
11095
|
-
}); // Add a response interceptor
|
|
11096
|
-
|
|
11097
|
-
instance.interceptors.response.use(function (response, error) {
|
|
11098
|
-
if (error) {
|
|
11099
|
-
return Promise.reject(error.response);
|
|
11100
|
-
}
|
|
11101
|
-
|
|
11102
|
-
if (response.headers.authorization) {
|
|
11103
|
-
setToken(response.headers.authorization);
|
|
11104
|
-
}
|
|
11105
|
-
|
|
11106
|
-
return response;
|
|
11107
|
-
}, function (error) {
|
|
11108
|
-
if (error.response) {
|
|
11109
|
-
// network error
|
|
11110
|
-
if (error.response.data && error.response.data.error && (error.response.data.error === 'token_invalid' || error.response.data.error === 'token_not_provided' || error.response.data.error === 'user_not_found' || error.response.data.error === 'token_expired') || error.response.status === 401 || error.response.status === 503 || error.response.status === 400) {
|
|
11111
|
-
onAuthFailed();
|
|
11112
|
-
} // if (error.response.status === 500) {
|
|
11113
|
-
// // INTERNAL SERVER ERROR
|
|
11114
|
-
// store.dispatch({
|
|
11115
|
-
// type: AppConstants.OVERLAY.SERVER_ERROR,
|
|
11116
|
-
// });
|
|
11117
|
-
// return Promise.reject(error.response);
|
|
11118
|
-
// }
|
|
11119
|
-
|
|
11120
|
-
|
|
11121
|
-
if (error.response.status === 403) {
|
|
11122
|
-
// FORBIDDEN
|
|
11123
|
-
onForbidden();
|
|
11124
|
-
}
|
|
11125
|
-
|
|
11126
|
-
return Promise.reject(error.response);
|
|
11127
|
-
}
|
|
11128
|
-
|
|
11129
|
-
return Promise.reject(error);
|
|
11130
|
-
});
|
|
11131
|
-
return instance;
|
|
11132
|
-
}; // NOTE: this to be instanciated with params: onAuthFailed, onForbidden
|
|
11133
|
-
|
|
11134
11012
|
var _excluded$8 = ["children"];
|
|
11135
11013
|
|
|
11136
11014
|
var DropdownSelector = function DropdownSelector(_ref) {
|
|
@@ -11352,7 +11230,7 @@
|
|
|
11352
11230
|
case 0:
|
|
11353
11231
|
_context.prev = 0;
|
|
11354
11232
|
_context.next = 3;
|
|
11355
|
-
return
|
|
11233
|
+
return requestInstance.post("".concat(baseGraphApi, "?id=getBrands"), {
|
|
11356
11234
|
query: getBrandsGraphQuery(1000, 1, 'id|desc')
|
|
11357
11235
|
});
|
|
11358
11236
|
|
|
@@ -11383,7 +11261,7 @@
|
|
|
11383
11261
|
}
|
|
11384
11262
|
}
|
|
11385
11263
|
}, _callee, null, [[0, 7]]);
|
|
11386
|
-
})), [baseGraphApi, getBrandsGraphQuery]);
|
|
11264
|
+
})), [baseGraphApi, getBrandsGraphQuery, requestInstance]);
|
|
11387
11265
|
var fetchModels = React.useCallback( /*#__PURE__*/function () {
|
|
11388
11266
|
var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(brandId) {
|
|
11389
11267
|
var _response$data2, _response$data2$data, _response$data2$data$, response, formattedModels;
|
|
@@ -11394,7 +11272,7 @@
|
|
|
11394
11272
|
case 0:
|
|
11395
11273
|
_context2.prev = 0;
|
|
11396
11274
|
_context2.next = 3;
|
|
11397
|
-
return
|
|
11275
|
+
return requestInstance.post("".concat(baseGraphApi, "?id=getModels"), {
|
|
11398
11276
|
query: getModelsGraphQuery(brandId)
|
|
11399
11277
|
});
|
|
11400
11278
|
|
|
@@ -11430,7 +11308,7 @@
|
|
|
11430
11308
|
return function (_x) {
|
|
11431
11309
|
return _ref3.apply(this, arguments);
|
|
11432
11310
|
};
|
|
11433
|
-
}(), [baseGraphApi, getModelsGraphQuery]);
|
|
11311
|
+
}(), [baseGraphApi, getModelsGraphQuery, requestInstance]);
|
|
11434
11312
|
var fetchMaterials = React.useCallback( /*#__PURE__*/function () {
|
|
11435
11313
|
var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(brandId) {
|
|
11436
11314
|
var _response$data3, _response$data3$data, _response$data3$data$, response, formattedMaterials;
|
|
@@ -11441,7 +11319,7 @@
|
|
|
11441
11319
|
case 0:
|
|
11442
11320
|
_context3.prev = 0;
|
|
11443
11321
|
_context3.next = 3;
|
|
11444
|
-
return
|
|
11322
|
+
return requestInstance.post("".concat(baseGraphApi, "?id=getMaterials"), {
|
|
11445
11323
|
query: getMaterialsGraphQuery(brandId)
|
|
11446
11324
|
});
|
|
11447
11325
|
|
|
@@ -11477,7 +11355,7 @@
|
|
|
11477
11355
|
return function (_x2) {
|
|
11478
11356
|
return _ref4.apply(this, arguments);
|
|
11479
11357
|
};
|
|
11480
|
-
}(), [baseGraphApi, getMaterialsGraphQuery]);
|
|
11358
|
+
}(), [baseGraphApi, getMaterialsGraphQuery, requestInstance]);
|
|
11481
11359
|
React.useEffect(function () {
|
|
11482
11360
|
fetchBrands();
|
|
11483
11361
|
}, [fetchBrands]);
|
package/TestComponent.js
ADDED
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
(function (global, factory) {
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('react')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define(['react'], factory) :
|
|
4
|
+
(global = global || self, global.TestComponent = factory(global.React));
|
|
5
|
+
}(this, (function (React) { 'use strict';
|
|
6
|
+
|
|
7
|
+
React = React && Object.prototype.hasOwnProperty.call(React, 'default') ? React['default'] : React;
|
|
8
|
+
|
|
9
|
+
var TestComponent = function TestComponent() {
|
|
10
|
+
return /*#__PURE__*/React.createElement("div", null, "TestComponent");
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
return TestComponent;
|
|
14
|
+
|
|
15
|
+
})));
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
var react_1 = __importDefault(require("react"));
|
|
7
|
+
var ReactSelectWrapper_1 = __importDefault(require("../ReactSelectWrapper"));
|
|
8
|
+
var responseTransform = function (countryData) {
|
|
9
|
+
return countryData.map(function (item) { return ({
|
|
10
|
+
label: "".concat(item.code, " (+").concat(item.dial_code, ")"),
|
|
11
|
+
value: item.code,
|
|
12
|
+
}); });
|
|
13
|
+
};
|
|
14
|
+
var CountryCodeSelect = function (_a) {
|
|
15
|
+
var _b = _a.countryData, countryData = _b === void 0 ? [] : _b, className = _a.className, classNamePrefix = _a.classNamePrefix, _c = _a.defaultCountryCode, defaultCountryCode = _c === void 0 ? 'ZA' : _c, _d = _a.onChange, onChange = _d === void 0 ? function () { return null; } : _d, _e = _a.isSearchable, isSearchable = _e === void 0 ? true : _e, _f = _a.name, name = _f === void 0 ? 'country_code' : _f, _g = _a.renderNoData, renderNoData = _g === void 0 ? function () { return 'Loading...'; } : _g;
|
|
16
|
+
return (react_1.default.createElement(react_1.default.Fragment, null, countryData && countryData.length ? (react_1.default.createElement(ReactSelectWrapper_1.default, { name: name, className: className, classNamePrefix: classNamePrefix, options: responseTransform(countryData), defaultValue: responseTransform(countryData.filter(function (item) { return item.code === defaultCountryCode; })), onChange: onChange, isSearchable: isSearchable })) : (renderNoData())));
|
|
17
|
+
};
|
|
18
|
+
exports.default = CountryCodeSelect;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
var react_1 = __importDefault(require("react"));
|
|
29
|
+
var react_select_1 = __importDefault(require("react-select"));
|
|
30
|
+
var ReactSelectWrapper = function (_a) {
|
|
31
|
+
var _b = _a.isMulti, isMulti = _b === void 0 ? false : _b, _c = _a.isSearchable, isSearchable = _c === void 0 ? false : _c, _d = _a.components, components = _d === void 0 ? { IndicatorSeparator: function () { return null; } } : _d, _e = _a.options, options = _e === void 0 ? [] : _e, _f = _a.className, className = _f === void 0 ? 'dropdown-select-container' : _f, _g = _a.classNamePrefix, classNamePrefix = _g === void 0 ? 'dropdown-select' : _g, _h = _a.onChange, onChange = _h === void 0 ? function () { return null; } : _h, name = _a.name, _j = _a.noOptionsMessage, noOptionsMessage = _j === void 0 ? function () { return 'No Options'; } : _j, rest = __rest(_a, ["isMulti", "isSearchable", "components", "options", "className", "classNamePrefix", "onChange", "name", "noOptionsMessage"]);
|
|
32
|
+
return (react_1.default.createElement(react_select_1.default, __assign({ isMulti: isMulti, isSearchable: isSearchable, components: components, options: options, className: className, classNamePrefix: classNamePrefix, onChange: onChange, name: name, noOptionsMessage: noOptionsMessage }, rest)));
|
|
33
|
+
};
|
|
34
|
+
exports.default = ReactSelectWrapper;
|
package/build/bundle.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.interests__add-button{display:flex;flex-direction:row;gap:10px;width:100%}@media only screen and (max-width:879px){.interests__add-button{flex-direction:column}}.interests__section-wrapper{display:flex;flex-direction:column;width:100%}.interests__select-option{display:flex;flex-direction:column;margin-bottom:15px}.interests__title{font-family:El Messiri;font-size:16px;margin-bottom:10px}.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%}.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;gap:8px}.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}@media only screen and (max-width:879px){.navbar{padding-top:12px}}.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-left:16px;padding-right:16px}.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;gap:10px;justify-content:flex-start;width:100%}@media only screen and (max-width:879px){.navbar__wrapper .navbar__menu-icon-wrapper{margin-right:10px}.navbar__wrapper .navbar__logo{margin-left:0;margin-right:auto}.navbar__wrapper .navbar__icons-wrapper{align-items:center;display:flex;gap:20px;margin-left:auto}.navbar__wrapper .navbar__icons{align-items:center;display:flex;gap:20px;margin:0}.navbar__wrapper .navbar__icon{margin:0}}.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__search-container{width:100%}.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:20px}.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:150px}}.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}.navbar__icon.navbar__cart-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__loyalty-icon{height:18px;position:absolute;right:-14px;top:-6px;width:18px}.navbar__cart-icon{position:relative}.navbar__cart-count{bottom:50%;font-size:13px;height:20px;left:60%;position:absolute;width:20px}.navbar__account-initials,.navbar__cart-count{align-items:center;background-color:#f2eeeb;border-radius:50%;color:#000;display:flex;justify-content:center}.navbar__account-initials{font-size:11px;font-weight:500;height:24px;text-transform:uppercase;width:24px}.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%}@charset "UTF-8";.currency-select-container{align-items:center;display:flex;margin-right:18px;position:relative}.currency-select-container .currency-flag{margin-right:5px}.currency-select-container .currency-flag img{height:15px;-o-object-fit:cover;object-fit:cover;width:20px}.currency-select-container .currency-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;border:none;color:#000;cursor:pointer;font-family:inherit;font-size:14px;margin:0;outline:none;padding:5px 15px 5px 5px}.currency-select-container .currency-select::-ms-expand{display:none}.currency-select-container .currency-select:focus{box-shadow:none;outline:none}.currency-select-container .currency-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.currency-select-container:after{color:#000;content:"▼";font-size:10px;pointer-events:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media only screen and (max-width:879px){.currency-select-container .currency-select{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;padding-right:0}.currency-select-container:after{display:none}}.currency-select-container.disabled{cursor:not-allowed;opacity:.7}.currency-select-container.disabled .currency-select{pointer-events:none}.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}.search-results{background:#fff;border:1px solid #dfdede;border-radius:2px;box-shadow:0 2px 8px rgba(0,0,0,.08);display:flex;position:absolute;width:770px;z-index:50}@media only screen and (max-width:1052px){.search-results{border:none;box-shadow:none;flex-direction:column;left:0;right:0;top:100%;width:100%}}.search-results__section:first-child{border-right:1px solid #dfdede;flex:1;min-width:240px}.search-results__section:last-child{display:flex;flex:2;flex-direction:column}.search-results__section-header{align-items:center;display:flex;justify-content:space-between}.search-results__header{color:#000;font-family:Martel Sans;font-size:14px;font-weight:600;margin-bottom:0;padding:16px 20px;text-transform:uppercase}.search-results__view-all-link{display:none}@media only screen and (max-width:879px){.search-results__view-all-link{color:#000;display:block;font-family:Martel Sans;font-size:14px;margin-right:20px}}.search-results__list{display:flex;flex-direction:column}.search-results__item{color:grey;font-family:Martel Sans;font-size:14px;padding:8px 20px;text-decoration:none}.search-results__product-list{display:flex;flex-direction:column;overflow-y:auto}.product-card{color:inherit;display:flex;padding:12px 20px;text-decoration:none;transition:background-color .15s ease}.product-card:hover{background-color:#f4f4f4}.product-card__image-container{border-radius:2px;flex-shrink:0;height:90px;margin-right:16px;overflow:hidden;width:90px}.product-card__image{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.product-card__details{display:flex;flex:1;flex-direction:column}.product-card__name{color:#000;font-family:Martel Sans;font-size:14px;line-height:1.4;margin-bottom:24px}.product-card__brand-name{font-weight:600}.product-card__info-row{align-items:flex-end;display:flex;justify-content:space-between}@media only screen and (max-width:879px){.product-card__info-row{align-items:flex-start;flex-direction:column}}.product-card__price-group{display:flex;flex-direction:column;gap:4px}.product-card__price{color:#000;font-family:Martel Sans;font-size:14px;font-weight:600;line-height:1}.product-card__retail-price{color:#939393;font-family:Martel Sans;font-size:14px;text-decoration:line-through}.product-card__condition{color:#000;font-family:Martel Sans;font-size:13px;margin-right:20px;text-align:right}.product-card__condition-label{color:#939393;margin-right:4px}.search-results__view-all-button{background-color:#f5f0ea!important;border:none;color:#000;cursor:pointer;font-family:Martel Sans;font-size:13px;font-weight:400;padding:16px;text-align:center}@media only screen and (max-width:879px){.search-results__view-all-button{display:none}}.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)}}
|
|
1
|
+
.navbar{box-shadow:2px 2px 10px #dfdede;display:flex;padding-bottom:10px;padding-top:20px;position:relative}@media only screen and (max-width:879px){.navbar{padding-top:12px}}.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-left:16px;padding-right:16px}.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;gap:10px;justify-content:flex-start;width:100%}@media only screen and (max-width:879px){.navbar__wrapper .navbar__menu-icon-wrapper{margin-right:10px}.navbar__wrapper .navbar__logo{margin-left:0;margin-right:auto}.navbar__wrapper .navbar__icons-wrapper{align-items:center;display:flex;gap:20px;margin-left:auto}.navbar__wrapper .navbar__icons{align-items:center;display:flex;gap:20px;margin:0}.navbar__wrapper .navbar__icon{margin:0}}.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__search-container{width:100%}.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:20px}.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:150px}}.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}.navbar__icon.navbar__cart-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__loyalty-icon{height:18px;position:absolute;right:-14px;top:-6px;width:18px}.navbar__cart-icon{position:relative}.navbar__cart-count{bottom:50%;font-size:13px;height:20px;left:60%;position:absolute;width:20px}.navbar__account-initials,.navbar__cart-count{align-items:center;background-color:#f2eeeb;border-radius:50%;color:#000;display:flex;justify-content:center}.navbar__account-initials{font-size:11px;font-weight:500;height:24px;text-transform:uppercase;width:24px}.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%}.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;gap:8px}.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}}.interests__add-button{display:flex;flex-direction:row;gap:10px;width:100%}@media only screen and (max-width:879px){.interests__add-button{flex-direction:column}}.interests__section-wrapper{display:flex;flex-direction:column;width:100%}.interests__select-option{display:flex;flex-direction:column;margin-bottom:15px}.interests__title{font-family:El Messiri;font-size:16px;margin-bottom:10px}@charset "UTF-8";.currency-select-container{align-items:center;display:flex;margin-right:18px;position:relative}.currency-select-container .currency-flag{margin-right:5px}.currency-select-container .currency-flag img{height:15px;-o-object-fit:cover;object-fit:cover;width:20px}.currency-select-container .currency-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:transparent;border:none;color:#000;cursor:pointer;font-family:inherit;font-size:14px;margin:0;outline:none;padding:5px 15px 5px 5px}.currency-select-container .currency-select::-ms-expand{display:none}.currency-select-container .currency-select:focus{box-shadow:none;outline:none}.currency-select-container .currency-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000}.currency-select-container:after{color:#000;content:"▼";font-size:10px;pointer-events:none;position:absolute;right:0;top:50%;transform:translateY(-50%)}@media only screen and (max-width:879px){.currency-select-container .currency-select{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;padding-right:0}.currency-select-container:after{display:none}}.currency-select-container.disabled{cursor:not-allowed;opacity:.7}.currency-select-container.disabled .currency-select{pointer-events:none}.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%}.search-results{background:#fff;border:1px solid #dfdede;border-radius:2px;box-shadow:0 2px 8px rgba(0,0,0,.08);display:flex;position:absolute;width:770px;z-index:50}@media only screen and (max-width:1052px){.search-results{border:none;box-shadow:none;flex-direction:column;left:0;right:0;top:100%;width:100%}}.search-results__section:first-child{border-right:1px solid #dfdede;flex:1;min-width:240px}.search-results__section:last-child{display:flex;flex:2;flex-direction:column}.search-results__section-header{align-items:center;display:flex;justify-content:space-between}.search-results__header{color:#000;font-family:Martel Sans;font-size:14px;font-weight:600;margin-bottom:0;padding:16px 20px;text-transform:uppercase}.search-results__view-all-link{display:none}@media only screen and (max-width:879px){.search-results__view-all-link{color:#000;display:block;font-family:Martel Sans;font-size:14px;margin-right:20px}}.search-results__list{display:flex;flex-direction:column}.search-results__item{color:grey;font-family:Martel Sans;font-size:14px;padding:8px 20px;text-decoration:none}.search-results__product-list{display:flex;flex-direction:column;overflow-y:auto}.product-card{color:inherit;display:flex;padding:12px 20px;text-decoration:none;transition:background-color .15s ease}.product-card:hover{background-color:#f4f4f4}.product-card__image-container{border-radius:2px;flex-shrink:0;height:90px;margin-right:16px;overflow:hidden;width:90px}.product-card__image{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.product-card__details{display:flex;flex:1;flex-direction:column}.product-card__name{color:#000;font-family:Martel Sans;font-size:14px;line-height:1.4;margin-bottom:24px}.product-card__brand-name{font-weight:600}.product-card__info-row{align-items:flex-end;display:flex;justify-content:space-between}@media only screen and (max-width:879px){.product-card__info-row{align-items:flex-start;flex-direction:column}}.product-card__price-group{display:flex;flex-direction:column;gap:4px}.product-card__price{color:#000;font-family:Martel Sans;font-size:14px;font-weight:600;line-height:1}.product-card__retail-price{color:#939393;font-family:Martel Sans;font-size:14px;text-decoration:line-through}.product-card__condition{color:#000;font-family:Martel Sans;font-size:13px;margin-right:20px;text-align:right}.product-card__condition-label{color:#939393;margin-right:4px}.search-results__view-all-button{background-color:#f5f0ea!important;border:none;color:#000;cursor:pointer;font-family:Martel Sans;font-size:13px;font-weight:400;padding:16px;text-align:center}@media only screen and (max-width:879px){.search-results__view-all-button{display:none}}.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)}}
|