diff --git a/build/webpack.config.prod.js b/build/webpack.config.prod.js index 167a64d..63637d0 100644 --- a/build/webpack.config.prod.js +++ b/build/webpack.config.prod.js @@ -14,9 +14,9 @@ module.exports = merge(baseConfig, { uglifyOptions: { // Eliminate comments comments: false, + // remove warnings + warnings: false, compress: { - // remove warnings - warnings: false, // Drop console statements drop_console: true, } diff --git a/package-lock.json b/package-lock.json index 51ce509..a1d9245 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9541,6 +9541,11 @@ "integrity": "sha512-KmvZVtmM26BQOMK1rwUZsrqxEGeKiYSZGA7SNWE6uExx8UX/cj9hq2MRV/wWC3Cq6AoeDGk57rL9YMFRel/q+g==", "dev": true }, + "vue-infinite-loading": { + "version": "2.4.4", + "resolved": "https://registry.npmjs.org/vue-infinite-loading/-/vue-infinite-loading-2.4.4.tgz", + "integrity": "sha512-eIFBcyKqkivtsDDq7Ee5ybDJVGLxIzU1NcBJCHG7Zx9Ic66QEGzSPs2OPJlGUdtu0/RS7KpUER35ZP/a7FdSOg==" + }, "vue-jest": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/vue-jest/-/vue-jest-3.0.4.tgz", diff --git a/package.json b/package.json index f7123ee..e0d0589 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "axios": "^0.18.1", "vue": "^2.6.10", "vue-autofocus-directive": "^1.0.3", + "vue-infinite-loading": "^2.4.4", "vue-meta": "^1.6.0", "vue-router": "^3.0.6", "vuex": "^3.1.1" diff --git a/web/themes/custom/materiotheme/assets/dist/main.css b/web/themes/custom/materiotheme/assets/dist/main.css index 2c1c915..3b69718 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.css +++ b/web/themes/custom/materiotheme/assets/dist/main.css @@ -1154,3 +1154,50 @@ article.node--type-frontpage .node__content .field--name-computed-articles-refer vertical-align: top; max-width: 250px; } +.cards-list > ul { + margin: 0; + padding: 0; } + .cards-list > ul > li { + list-style: none; + margin: 0 1em 1em 0; + padding: 0; + display: inline-block; + vertical-align: top; } + +.card { + position: relative; + width: 210px; + height: 295px; } + .card header { + position: absolute; + bottom: 0; + z-index: 10; + color: #fff; + background-color: rgba(0, 0, 0, 0.5); + width: 100%; } + .card header h1, .card header h4 { + margin: 0; + padding: 0; } + .card header h1 { + font-size: 1.5em; } + .card header h4 { + font-size: 1em; + font-weight: normal; } + .card section.images { + position: relative; } + .card section.images, .card section.images * { + width: 100%; + height: 100%; } + .card section.images figure { + margin: 0; + position: absolute; + top: 0; + left: 0; } + .card section.images figure:first-of-type { + z-index: 5; } + .card section.images figure img.blank { + position: absolute; + top: 0; + left: 0; + z-index: 20; } + diff --git a/web/themes/custom/materiotheme/assets/dist/main.js b/web/themes/custom/materiotheme/assets/dist/main.js index 3ee0d79..51aecc9 100644 --- a/web/themes/custom/materiotheme/assets/dist/main.js +++ b/web/themes/custom/materiotheme/assets/dist/main.js @@ -417,7 +417,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n\nvar _Card = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Card */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n name: \"Base\",\n data: function data() {\n return {\n pagetitle: \"Base\" // searchinfos: null\n\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n items: function items(state) {\n return state.Search.items;\n },\n searchinfos: function searchinfos(state) {\n return state.Search.infos;\n }\n })),\n methods: _objectSpread({}, (0, _vuex.mapActions)({\n newSearch: 'Search/newSearch'\n })),\n created: function created() {\n // at first page load or first route entering launch a search if params exists in url query\n console.log('Base created() location', window.location);\n var params = new URLSearchParams(window.location.search);\n\n if (params.has('keys') || params.has('term')) {\n this.$store.commit('Search/setKeys', params.get('keys'));\n this.$store.commit('Search/setTerm', params.get('term'));\n this.pagetitle = params.get('keys');\n this.newSearch();\n }\n },\n beforeRouteUpdate: function beforeRouteUpdate(to, from, next) {\n // when query change launch a new search\n console.log('Base beforeRouteUpdate', to, from, next);\n this.$store.commit('Search/setKeys', to.query.keys);\n this.$store.commit('Search/setTerm', to.query.term);\n this.pagetitle = to.query.keys;\n this.newSearch();\n next();\n },\n components: {\n Card: _Card.default\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n\nvar _Card = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/Card */ \"./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar _default = {\n name: \"Base\",\n data: function data() {\n return {\n pagetitle: \"Base\" // searchinfos: null\n\n };\n },\n computed: _objectSpread({}, (0, _vuex.mapState)({\n items: function items(state) {\n return state.Search.items;\n },\n searchinfos: function searchinfos(state) {\n return state.Search.infos;\n },\n count: function count(state) {\n return state.Search.count;\n },\n limit: function limit(state) {\n return state.Search.limit;\n }\n })),\n methods: _objectSpread({}, (0, _vuex.mapActions)({\n newSearch: 'Search/newSearch',\n nextPage: 'Search/nextPage'\n })),\n created: function created() {\n // at first page load or first route entering launch a search if params exists in url query\n console.log('Base created() location', window.location);\n var params = new URLSearchParams(window.location.search);\n\n if (params.has('keys') || params.has('term')) {\n this.$store.commit('Search/setKeys', params.get('keys'));\n this.$store.commit('Search/setTerm', params.get('term'));\n this.pagetitle = params.get('keys');\n this.newSearch();\n }\n },\n beforeRouteUpdate: function beforeRouteUpdate(to, from, next) {\n // when query change launch a new search\n console.log('Base beforeRouteUpdate', to, from, next);\n this.$store.commit('Search/setKeys', to.query.keys);\n this.$store.commit('Search/setTerm', to.query.term);\n this.pagetitle = to.query.keys;\n this.newSearch();\n next();\n },\n components: {\n Card: _Card.default\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options"); /***/ }), @@ -429,7 +429,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n name: \"Card\",\n props: ['item'],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\")\n };\n },\n directives: {\n lazy: {\n bind: function bind(img, binding) {\n // console.log('lazy bind', img, binding);\n if (binding.value === 0) {\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n }\n }\n },\n switcher: {\n inserted: function inserted(el, binding) {\n // switch images on mousemove\n el.addEventListener('mousemove', function (event) {\n var figs = this.querySelectorAll('figure'); // console.log('mousemove', this, event, figs.length);\n // let len = figs.length\n // let w = this.clientWidth;\n // let g = w / len;\n // let delta = Math.floor(event.layerX / g)\n\n var delta = Math.floor(event.layerX / (this.clientWidth / figs.length)); // console.log('delta', delta);\n\n figs.forEach(function (fig, index) {\n // console.log(index);\n if (index == delta) {\n fig.style.display = \"block\";\n } else {\n fig.style.display = \"none\";\n }\n });\n });\n }\n }\n },\n mounted: function mounted() {\n // lazy load images on mouseover\n this.$el.addEventListener('mouseover', function (event) {\n var imgs = this.querySelectorAll('.images figure img.lazy');\n console.log('mouseover', this, imgs);\n imgs.forEach(function (img) {\n // console.log('forEach img',img);\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n });\n }, {\n once: true\n });\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nvar _default = {\n name: \"Card\",\n props: ['item'],\n data: function data() {\n return {\n blanksrc: \"\".concat(drupalSettings.path.themePath, \"/assets/img/blank.gif\")\n };\n },\n directives: {\n lazy: {\n bind: function bind(img, binding) {\n // console.log('lazy bind', img, binding);\n if (binding.value === 0) {\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n }\n }\n },\n switcher: {\n inserted: function inserted(el, binding) {\n // switch images on mousemove\n el.addEventListener('mousemove', function (event) {\n var figs = this.querySelectorAll('figure'); // console.log('mousemove', this, event, figs.length);\n // let len = figs.length\n // let w = this.clientWidth;\n // let g = w / len;\n // let delta = Math.floor(event.layerX / g)\n\n var delta = Math.floor(event.layerX / (this.clientWidth / figs.length)); // console.log('delta', delta);\n\n figs.forEach(function (fig, index) {\n // console.log(index);\n if (index == delta) {\n fig.style.display = \"block\";\n } else {\n fig.style.display = \"none\";\n }\n });\n });\n }\n }\n },\n mounted: function mounted() {\n // lazy load images on mouseover\n this.$el.addEventListener('mouseover', function (event) {\n var imgs = this.querySelectorAll('.images figure img.lazy'); // console.log('mouseover', this, imgs);\n\n imgs.forEach(function (img) {\n // console.log('forEach img',img);\n img.setAttribute('src', img.getAttribute('data-src'));\n img.removeAttribute('data-src');\n img.classList.remove('lazy');\n });\n }, {\n once: true\n });\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Card.vue?./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options"); /***/ }), @@ -488,7 +488,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n /*! no static exports found */ /***/ (function(module, exports, __webpack_require__) { -eval("exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\")(false);\n// Module\nexports.push([module.i, \"body {\\n background: white; }\\n\\na {\\n color: inherit;\\n text-decoration: none; }\\n\\na, a:focus, a:active {\\n outline: none; }\\n\\na:focus {\\n -moz-outline-style: none; }\\n\\n.col-1, .small-col-1, .med-col-1, .large-col-1, .col-2, .small-col-2, .med-col-2, .large-col-2, .col-3, .small-col-3, .med-col-3, .large-col-3, .col-4, .small-col-4, .med-col-4, .large-col-4, .col-5, .small-col-5, .med-col-5, .large-col-5, .col-6, .small-col-6, .med-col-6, .large-col-6, .col-7, .small-col-7, .med-col-7, .large-col-7, .col-8, .small-col-8, .med-col-8, .large-col-8, .col-9, .small-col-9, .med-col-9, .large-col-9, .col-10, .small-col-10, .med-col-10, .large-col-10, .col-11, .small-col-11, .med-col-11, .large-col-11, .col-12, .small-col-12, .med-col-12, .large-col-12, .col-1-offset-1, .col-1-offset-2, .col-1-offset-3, .col-1-offset-4, .col-1-offset-5, .col-1-offset-6, .col-1-offset-7, .col-1-offset-8, .col-1-offset-9, .col-1-offset-10, .col-1-offset-11, .col-2-offset-1, .col-2-offset-2, .col-2-offset-3, .col-2-offset-4, .col-2-offset-5, .col-2-offset-6, .col-2-offset-7, .col-2-offset-8, .col-2-offset-9, .col-2-offset-10, .col-3-offset-1, .col-3-offset-2, .col-3-offset-3, .col-3-offset-4, .col-3-offset-5, .col-3-offset-6, .col-3-offset-7, .col-3-offset-8, .col-3-offset-9, .col-4-offset-1, .col-4-offset-2, .col-4-offset-3, .col-4-offset-4, .col-4-offset-5, .col-4-offset-6, .col-4-offset-7, .col-4-offset-8, .col-5-offset-1, .col-5-offset-2, .col-5-offset-3, .col-5-offset-4, .col-5-offset-5, .col-5-offset-6, .col-5-offset-7, .col-6-offset-1, .col-6-offset-2, .col-6-offset-3, .col-6-offset-4, .col-6-offset-5, .col-6-offset-6, .col-7-offset-1, .col-7-offset-2, .col-7-offset-3, .col-7-offset-4, .col-7-offset-5, .col-8-offset-1, .col-8-offset-2, .col-8-offset-3, .col-8-offset-4, .col-9-offset-1, .col-9-offset-2, .col-9-offset-3, .col-10-offset-1, .col-10-offset-2, .col-11-offset-1 {\\n width: 100%;\\n float: left;\\n box-sizing: border-box; }\\n\\n.row {\\n position: relative; }\\n .row > * {\\n font-size: 16px; }\\n\\n.col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .col-1:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .small-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .med-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .large-col-1:last-child {\\n padding-right: 0; } }\\n\\n.col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .col-2:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .small-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .med-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .large-col-2:last-child {\\n padding-right: 0; } }\\n\\n.col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .col-3:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .small-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .med-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .large-col-3:last-child {\\n padding-right: 0; } }\\n\\n.col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .col-4:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .small-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .med-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .large-col-4:last-child {\\n padding-right: 0; } }\\n\\n.col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .col-5:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .small-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .med-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .large-col-5:last-child {\\n padding-right: 0; } }\\n\\n.col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .col-6:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .small-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .med-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .large-col-6:last-child {\\n padding-right: 0; } }\\n\\n.col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .col-7:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .small-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .med-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .large-col-7:last-child {\\n padding-right: 0; } }\\n\\n.col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .col-8:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .small-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .med-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .large-col-8:last-child {\\n padding-right: 0; } }\\n\\n.col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .col-9:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .small-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .med-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .large-col-9:last-child {\\n padding-right: 0; } }\\n\\n.col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .col-10:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .small-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .med-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .large-col-10:last-child {\\n padding-right: 0; } }\\n\\n.col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .col-11:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .small-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .med-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .large-col-11:last-child {\\n padding-right: 0; } }\\n\\n.col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .col-12:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .small-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .med-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .large-col-12:last-child {\\n padding-right: 0; } }\\n\\n.col-1-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 8.33333%;\\n width: 8.33333%; }\\n .col-1-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 8.33333%; }\\n .col-1-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 8.33333%; }\\n .col-1-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 8.33333%; }\\n .col-1-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 8.33333%; }\\n .col-1-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 8.33333%; }\\n .col-1-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 8.33333%; }\\n .col-1-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 8.33333%; }\\n .col-1-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 8.33333%; }\\n .col-1-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 8.33333%; }\\n .col-1-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-11 {\\n padding-left: 11em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 8.33333%; }\\n .col-1-offset-11:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 16.66667%; }\\n .col-2-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 16.66667%; }\\n .col-2-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 16.66667%; }\\n .col-2-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 16.66667%; }\\n .col-2-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 16.66667%; }\\n .col-2-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 16.66667%; }\\n .col-2-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 16.66667%; }\\n .col-2-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 16.66667%; }\\n .col-2-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 16.66667%; }\\n .col-2-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 16.66667%; }\\n .col-2-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 25%; }\\n .col-3-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 25%; }\\n .col-3-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 25%; }\\n .col-3-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 25%; }\\n .col-3-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 25%; }\\n .col-3-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 25%; }\\n .col-3-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 25%; }\\n .col-3-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 25%; }\\n .col-3-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 25%; }\\n .col-3-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 33.33333%; }\\n .col-4-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 33.33333%; }\\n .col-4-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 33.33333%; }\\n .col-4-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 33.33333%; }\\n .col-4-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 33.33333%; }\\n .col-4-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 33.33333%; }\\n .col-4-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 33.33333%; }\\n .col-4-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 33.33333%; }\\n .col-4-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 41.66667%; }\\n .col-5-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 41.66667%; }\\n .col-5-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 41.66667%; }\\n .col-5-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 41.66667%; }\\n .col-5-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 208.33333%;\\n width: 41.66667%; }\\n .col-5-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 41.66667%; }\\n .col-5-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 41.66667%; }\\n .col-5-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 50%; }\\n .col-6-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 50%; }\\n .col-6-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 50%; }\\n .col-6-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 50%; }\\n .col-6-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 50%; }\\n .col-6-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 300%;\\n width: 50%; }\\n .col-6-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 58.33333%; }\\n .col-7-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 58.33333%; }\\n .col-7-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 58.33333%; }\\n .col-7-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 58.33333%; }\\n .col-7-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 58.33333%; }\\n .col-7-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 66.66667%; }\\n .col-8-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 66.66667%; }\\n .col-8-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 66.66667%; }\\n .col-8-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 66.66667%; }\\n .col-8-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 75%; }\\n .col-9-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 75%; }\\n .col-9-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 75%; }\\n .col-9-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 83.33333%; }\\n .col-10-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 83.33333%; }\\n .col-10-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-11-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 91.66667%; }\\n .col-11-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col.float-right {\\n float: right;\\n padding-right: 0;\\n padding-left: 1em; }\\n\\nbody, html {\\n position: relative;\\n width: 100%;\\n height: 100%;\\n font-family: sans-serif;\\n font-style: normal;\\n margin: 0;\\n padding: 0; }\\n\\nbody.toolbar-horizontal.toolbar-themes.toolbar-no-tabs {\\n padding-top: 24px !important; }\\n\\nheader[role=\\\"banner\\\"] {\\n background-color: #fff;\\n overflow: visible;\\n position: fixed;\\n z-index: 10;\\n width: 100vw;\\n height: 80px; }\\n header[role=\\\"banner\\\"] .wrapper .header-block {\\n min-height: 15px;\\n font-size: 0; }\\n header[role=\\\"banner\\\"] .wrapper .header-block.header-right {\\n text-align: right; }\\n header[role=\\\"banner\\\"] .wrapper .header-block > * {\\n display: inline-block;\\n vertical-align: top;\\n font-size: 16px;\\n text-align: left; }\\n\\nmain[role=\\\"main\\\"] {\\n padding-top: 80px; }\\n\\nbody {\\n font-size: 16px;\\n font-family: \\\"Ubuntu\\\",Arial,\\\"MS Trebuchet\\\",sans-serif;\\n font-weight: 500;\\n font-style: normal;\\n line-height: 1.3; }\\n\\naside.messages {\\n border: none; }\\n\\nheader[role=\\\"banner\\\"] {\\n padding: 0.2em 0 0 0; }\\n header[role=\\\"banner\\\"] #block-sitebranding h1 {\\n margin: 0;\\n line-height: 1; }\\n header[role=\\\"banner\\\"] #block-userlogin {\\n position: relative;\\n width: 8em;\\n overflow: visible; }\\n header[role=\\\"banner\\\"] #block-userlogin h2 {\\n margin: 0;\\n font-size: 1em;\\n font-weight: 400; }\\n header[role=\\\"banner\\\"] #block-userlogin > section {\\n background-color: #fff;\\n overflow: hidden;\\n width: 11em;\\n height: 1px;\\n padding: 0.01em 1em;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out;\\n transition-delay: 2s;\\n position: absolute;\\n right: 0;\\n top: 1.7em;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin:hover > section {\\n transition-delay: 0s;\\n height: 12em;\\n padding: 1em 1em;\\n box-shadow: 0 0 10px #ccc; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item {\\n margin: 0;\\n position: relative;\\n width: 100%; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name {\\n margin: 2px 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass {\\n margin: 0 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login label {\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-userlogin #edit-actions {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li {\\n list-style: none;\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li a {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-languageswitcher h2 {\\n margin: 0.1em 0 0 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.1em 0.4em 0.2em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff;\\n display: inline-block;\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-languageswitcher > ul.links {\\n overflow: hidden;\\n width: 5em;\\n height: 1px;\\n padding: 0.01em 0;\\n margin: 0;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out; }\\n header[role=\\\"banner\\\"] #block-languageswitcher:hover > ul.links {\\n transition-delay: 0s;\\n height: 2em;\\n padding: 0.3em 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li {\\n list-style: none;\\n padding: 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li.is-active {\\n display: none; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li a {\\n margin: 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.2em 0.4em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff; }\\n\\naside.messages {\\n padding: 0; }\\n\\n#materio-sapi-search-form .form-item, #materio-sapi-search-form input.button {\\n display: inline-block; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-a-database:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-showrooms:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-blabla:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-pricing:not(:nth-child(1)) {\\n margin-top: 1em; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-a-database .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-showrooms .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-blabla .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-pricing .field__label {\\n font-size: 2.2em;\\n font-weight: bold; }\\n\\narticle.node--type-frontpage .node__content .field--name-computed-materials-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-showrooms-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-articles-reference .field__item {\\n display: inline-block;\\n vertical-align: top;\\n max-width: 250px; }\\n\\n.cards-list > ul {\\n margin: 0;\\n padding: 0; }\\n .cards-list > ul > li {\\n list-style: none;\\n margin: 0 1em 1em 0;\\n padding: 0;\\n display: inline-block;\\n vertical-align: top; }\\n\\n.card {\\n position: relative;\\n width: 210px;\\n height: 295px; }\\n .card header {\\n position: absolute;\\n bottom: 0;\\n z-index: 10;\\n color: #fff;\\n background-color: rgba(0, 0, 0, 0.5);\\n width: 100%; }\\n .card header h1, .card header h4 {\\n margin: 0;\\n padding: 0; }\\n .card header h1 {\\n font-size: 1.5em; }\\n .card header h4 {\\n font-size: 1em;\\n font-weight: normal; }\\n .card section.images {\\n position: relative; }\\n .card section.images, .card section.images * {\\n width: 100%;\\n height: 100%; }\\n .card section.images figure {\\n margin: 0;\\n position: absolute;\\n top: 0;\\n left: 0; }\\n .card section.images figure:first-of-type {\\n z-index: 5; }\\n .card section.images figure img.blank {\\n position: absolute;\\n top: 0;\\n left: 0;\\n z-index: 20; }\\n\", \"\"]);\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/styles/main.scss?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js"); +eval("exports = module.exports = __webpack_require__(/*! ../../../../../../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\")(false);\n// Module\nexports.push([module.i, \"body {\\n background: white; }\\n\\na {\\n color: inherit;\\n text-decoration: none; }\\n\\na, a:focus, a:active {\\n outline: none; }\\n\\na:focus {\\n -moz-outline-style: none; }\\n\\n.col-1, .small-col-1, .med-col-1, .large-col-1, .col-2, .small-col-2, .med-col-2, .large-col-2, .col-3, .small-col-3, .med-col-3, .large-col-3, .col-4, .small-col-4, .med-col-4, .large-col-4, .col-5, .small-col-5, .med-col-5, .large-col-5, .col-6, .small-col-6, .med-col-6, .large-col-6, .col-7, .small-col-7, .med-col-7, .large-col-7, .col-8, .small-col-8, .med-col-8, .large-col-8, .col-9, .small-col-9, .med-col-9, .large-col-9, .col-10, .small-col-10, .med-col-10, .large-col-10, .col-11, .small-col-11, .med-col-11, .large-col-11, .col-12, .small-col-12, .med-col-12, .large-col-12, .col-1-offset-1, .col-1-offset-2, .col-1-offset-3, .col-1-offset-4, .col-1-offset-5, .col-1-offset-6, .col-1-offset-7, .col-1-offset-8, .col-1-offset-9, .col-1-offset-10, .col-1-offset-11, .col-2-offset-1, .col-2-offset-2, .col-2-offset-3, .col-2-offset-4, .col-2-offset-5, .col-2-offset-6, .col-2-offset-7, .col-2-offset-8, .col-2-offset-9, .col-2-offset-10, .col-3-offset-1, .col-3-offset-2, .col-3-offset-3, .col-3-offset-4, .col-3-offset-5, .col-3-offset-6, .col-3-offset-7, .col-3-offset-8, .col-3-offset-9, .col-4-offset-1, .col-4-offset-2, .col-4-offset-3, .col-4-offset-4, .col-4-offset-5, .col-4-offset-6, .col-4-offset-7, .col-4-offset-8, .col-5-offset-1, .col-5-offset-2, .col-5-offset-3, .col-5-offset-4, .col-5-offset-5, .col-5-offset-6, .col-5-offset-7, .col-6-offset-1, .col-6-offset-2, .col-6-offset-3, .col-6-offset-4, .col-6-offset-5, .col-6-offset-6, .col-7-offset-1, .col-7-offset-2, .col-7-offset-3, .col-7-offset-4, .col-7-offset-5, .col-8-offset-1, .col-8-offset-2, .col-8-offset-3, .col-8-offset-4, .col-9-offset-1, .col-9-offset-2, .col-9-offset-3, .col-10-offset-1, .col-10-offset-2, .col-11-offset-1 {\\n width: 100%;\\n float: left;\\n box-sizing: border-box; }\\n\\n.row {\\n position: relative; }\\n .row > * {\\n font-size: 16px; }\\n\\n.col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .col-1:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .small-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .med-col-1:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-1 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 8.33333%; }\\n .large-col-1:last-child {\\n padding-right: 0; } }\\n\\n.col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .col-2:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .small-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .med-col-2:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-2 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 16.66667%; }\\n .large-col-2:last-child {\\n padding-right: 0; } }\\n\\n.col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .col-3:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .small-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .med-col-3:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-3 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 25%; }\\n .large-col-3:last-child {\\n padding-right: 0; } }\\n\\n.col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .col-4:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .small-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .med-col-4:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-4 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 33.33333%; }\\n .large-col-4:last-child {\\n padding-right: 0; } }\\n\\n.col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .col-5:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .small-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .med-col-5:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-5 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 41.66667%; }\\n .large-col-5:last-child {\\n padding-right: 0; } }\\n\\n.col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .col-6:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .small-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .med-col-6:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-6 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 50%; }\\n .large-col-6:last-child {\\n padding-right: 0; } }\\n\\n.col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .col-7:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .small-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .med-col-7:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-7 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 58.33333%; }\\n .large-col-7:last-child {\\n padding-right: 0; } }\\n\\n.col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .col-8:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .small-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .med-col-8:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-8 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 66.66667%; }\\n .large-col-8:last-child {\\n padding-right: 0; } }\\n\\n.col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .col-9:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .small-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .med-col-9:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-9 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 75%; }\\n .large-col-9:last-child {\\n padding-right: 0; } }\\n\\n.col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .col-10:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .small-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .med-col-10:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-10 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 83.33333%; }\\n .large-col-10:last-child {\\n padding-right: 0; } }\\n\\n.col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .col-11:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .small-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .med-col-11:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-11 {\\n padding-left: 0em;\\n padding-right: 1em;\\n margin-left: 0%;\\n width: 91.66667%; }\\n .large-col-11:last-child {\\n padding-right: 0; } }\\n\\n.col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .col-12:last-child {\\n padding-right: 0; }\\n\\n@media only screen and (max-width: 768px) {\\n .small-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .small-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 769px) and (max-width: 1080px) {\\n .med-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .med-col-12:last-child {\\n padding-right: 0; } }\\n\\n@media only screen and (min-width: 1081px) {\\n .large-col-12 {\\n padding-left: 0em;\\n padding-right: 0;\\n margin-left: 0%;\\n width: 100%; }\\n .large-col-12:last-child {\\n padding-right: 0; } }\\n\\n.col-1-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 8.33333%;\\n width: 8.33333%; }\\n .col-1-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 8.33333%; }\\n .col-1-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 8.33333%; }\\n .col-1-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 8.33333%; }\\n .col-1-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 8.33333%; }\\n .col-1-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 8.33333%; }\\n .col-1-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 8.33333%; }\\n .col-1-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 8.33333%; }\\n .col-1-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 8.33333%; }\\n .col-1-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 8.33333%; }\\n .col-1-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-1-offset-11 {\\n padding-left: 11em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 8.33333%; }\\n .col-1-offset-11:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 16.66667%;\\n width: 16.66667%; }\\n .col-2-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 16.66667%; }\\n .col-2-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 16.66667%; }\\n .col-2-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 16.66667%; }\\n .col-2-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 16.66667%; }\\n .col-2-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 16.66667%; }\\n .col-2-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 16.66667%; }\\n .col-2-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 16.66667%; }\\n .col-2-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 16.66667%; }\\n .col-2-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-2-offset-10 {\\n padding-left: 10em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 16.66667%; }\\n .col-2-offset-10:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 25%;\\n width: 25%; }\\n .col-3-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 25%; }\\n .col-3-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 25%; }\\n .col-3-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 25%; }\\n .col-3-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 25%; }\\n .col-3-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 25%; }\\n .col-3-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 25%; }\\n .col-3-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 25%; }\\n .col-3-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-3-offset-9 {\\n padding-left: 9em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 25%; }\\n .col-3-offset-9:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 33.33333%;\\n width: 33.33333%; }\\n .col-4-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 33.33333%; }\\n .col-4-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 33.33333%; }\\n .col-4-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 33.33333%; }\\n .col-4-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 33.33333%; }\\n .col-4-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 33.33333%; }\\n .col-4-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 33.33333%; }\\n .col-4-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-4-offset-8 {\\n padding-left: 8em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 33.33333%; }\\n .col-4-offset-8:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 41.66667%;\\n width: 41.66667%; }\\n .col-5-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 41.66667%; }\\n .col-5-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 125%;\\n width: 41.66667%; }\\n .col-5-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 41.66667%; }\\n .col-5-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 208.33333%;\\n width: 41.66667%; }\\n .col-5-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 41.66667%; }\\n .col-5-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-5-offset-7 {\\n padding-left: 7em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 41.66667%; }\\n .col-5-offset-7:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 50%;\\n width: 50%; }\\n .col-6-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 100%;\\n width: 50%; }\\n .col-6-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 50%; }\\n .col-6-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 50%; }\\n .col-6-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 250%;\\n width: 50%; }\\n .col-6-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-6-offset-6 {\\n padding-left: 6em;\\n padding-right: 1em;\\n margin-left: 300%;\\n width: 50%; }\\n .col-6-offset-6:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 58.33333%;\\n width: 58.33333%; }\\n .col-7-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 116.66667%;\\n width: 58.33333%; }\\n .col-7-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 175%;\\n width: 58.33333%; }\\n .col-7-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 233.33333%;\\n width: 58.33333%; }\\n .col-7-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-7-offset-5 {\\n padding-left: 5em;\\n padding-right: 1em;\\n margin-left: 291.66667%;\\n width: 58.33333%; }\\n .col-7-offset-5:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 66.66667%;\\n width: 66.66667%; }\\n .col-8-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 133.33333%;\\n width: 66.66667%; }\\n .col-8-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 200%;\\n width: 66.66667%; }\\n .col-8-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-8-offset-4 {\\n padding-left: 4em;\\n padding-right: 1em;\\n margin-left: 266.66667%;\\n width: 66.66667%; }\\n .col-8-offset-4:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 75%;\\n width: 75%; }\\n .col-9-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 150%;\\n width: 75%; }\\n .col-9-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-9-offset-3 {\\n padding-left: 3em;\\n padding-right: 1em;\\n margin-left: 225%;\\n width: 75%; }\\n .col-9-offset-3:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 83.33333%;\\n width: 83.33333%; }\\n .col-10-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col-10-offset-2 {\\n padding-left: 2em;\\n padding-right: 1em;\\n margin-left: 166.66667%;\\n width: 83.33333%; }\\n .col-10-offset-2:last-child {\\n padding-right: 0; }\\n\\n.col-11-offset-1 {\\n padding-left: 1em;\\n padding-right: 1em;\\n margin-left: 91.66667%;\\n width: 91.66667%; }\\n .col-11-offset-1:last-child {\\n padding-right: 0; }\\n\\n.col.float-right {\\n float: right;\\n padding-right: 0;\\n padding-left: 1em; }\\n\\nbody, html {\\n position: relative;\\n width: 100%;\\n height: 100%;\\n font-family: sans-serif;\\n font-style: normal;\\n margin: 0;\\n padding: 0; }\\n\\nbody.toolbar-horizontal.toolbar-themes.toolbar-no-tabs {\\n padding-top: 24px !important; }\\n\\nheader[role=\\\"banner\\\"] {\\n background-color: #fff;\\n overflow: visible;\\n position: fixed;\\n z-index: 10;\\n width: 100vw;\\n height: 80px; }\\n header[role=\\\"banner\\\"] .wrapper .header-block {\\n min-height: 15px;\\n font-size: 0; }\\n header[role=\\\"banner\\\"] .wrapper .header-block.header-right {\\n text-align: right; }\\n header[role=\\\"banner\\\"] .wrapper .header-block > * {\\n display: inline-block;\\n vertical-align: top;\\n font-size: 16px;\\n text-align: left; }\\n\\nmain[role=\\\"main\\\"] {\\n padding-top: 80px; }\\n\\nbody {\\n font-size: 16px;\\n font-family: \\\"Ubuntu\\\",Arial,\\\"MS Trebuchet\\\",sans-serif;\\n font-weight: 500;\\n font-style: normal;\\n line-height: 1.3; }\\n\\naside.messages {\\n border: none; }\\n\\nheader[role=\\\"banner\\\"] {\\n padding: 0.2em 0 0 0; }\\n header[role=\\\"banner\\\"] #block-sitebranding h1 {\\n margin: 0;\\n line-height: 1; }\\n header[role=\\\"banner\\\"] #block-userlogin {\\n position: relative;\\n width: 8em;\\n overflow: visible; }\\n header[role=\\\"banner\\\"] #block-userlogin h2 {\\n margin: 0;\\n font-size: 1em;\\n font-weight: 400; }\\n header[role=\\\"banner\\\"] #block-userlogin > section {\\n background-color: #fff;\\n overflow: hidden;\\n width: 11em;\\n height: 1px;\\n padding: 0.01em 1em;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out;\\n transition-delay: 2s;\\n position: absolute;\\n right: 0;\\n top: 1.7em;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin:hover > section {\\n transition-delay: 0s;\\n height: 12em;\\n padding: 1em 1em;\\n box-shadow: 0 0 10px #ccc; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item {\\n margin: 0;\\n position: relative;\\n width: 100%; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name {\\n margin: 2px 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-name input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass {\\n margin: 0 0 0.5em 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-pass input {\\n width: 90%;\\n padding: 0;\\n box-sizing: content-box; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-userlogin .form-item.form-item-persistent-login label {\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-userlogin #edit-actions {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul {\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li {\\n list-style: none;\\n margin: 0; }\\n header[role=\\\"banner\\\"] #block-userlogin .item-list ul li a {\\n font-size: 0.756em; }\\n header[role=\\\"banner\\\"] #block-languageswitcher h2 {\\n margin: 0.1em 0 0 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.1em 0.4em 0.2em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff;\\n display: inline-block;\\n vertical-align: top; }\\n header[role=\\\"banner\\\"] #block-languageswitcher > ul.links {\\n overflow: hidden;\\n width: 5em;\\n height: 1px;\\n padding: 0.01em 0;\\n margin: 0;\\n box-sizing: content-box;\\n transition: all 0.4s ease-in-out; }\\n header[role=\\\"banner\\\"] #block-languageswitcher:hover > ul.links {\\n transition-delay: 0s;\\n height: 2em;\\n padding: 0.3em 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li {\\n list-style: none;\\n padding: 0; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li.is-active {\\n display: none; }\\n header[role=\\\"banner\\\"] #block-languageswitcher li a {\\n margin: 0;\\n font-size: 0.756em;\\n font-weight: 400;\\n padding: 0.2em 0.4em;\\n border-radius: 3px;\\n background-color: #444;\\n color: #fff; }\\n\\naside.messages {\\n padding: 0; }\\n\\n#materio-sapi-search-form .form-item, #materio-sapi-search-form input.button {\\n display: inline-block; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-a-database:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-showrooms:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-blabla:not(:nth-child(1)),\\narticle.node--type-frontpage .node__content .field--name-field-pricing:not(:nth-child(1)) {\\n margin-top: 1em; }\\n\\narticle.node--type-frontpage .node__content .field--name-field-what-is-materio .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-a-database .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-showrooms .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-blabla .field__label,\\narticle.node--type-frontpage .node__content .field--name-field-pricing .field__label {\\n font-size: 2.2em;\\n font-weight: bold; }\\n\\narticle.node--type-frontpage .node__content .field--name-computed-materials-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-showrooms-reference .field__item,\\narticle.node--type-frontpage .node__content .field--name-computed-articles-reference .field__item {\\n display: inline-block;\\n vertical-align: top;\\n max-width: 250px; }\\n\\n.infinite-loading-container .infinite-status-prompt i[class^=\\\"loading-\\\"] {\\n width: 15px;\\n height: 15px; }\\n\\n.cards-list > ul {\\n margin: 0;\\n padding: 0; }\\n .cards-list > ul > li {\\n list-style: none;\\n margin: 0 1em 1em 0;\\n padding: 0;\\n display: inline-block;\\n vertical-align: top; }\\n\\n.card {\\n position: relative;\\n width: 210px;\\n height: 295px; }\\n .card header {\\n position: absolute;\\n bottom: 0;\\n z-index: 10;\\n color: #fff;\\n background-color: rgba(0, 0, 0, 0.5);\\n width: 100%; }\\n .card header h1, .card header h4 {\\n margin: 0;\\n padding: 0; }\\n .card header h1 {\\n font-size: 1.5em; }\\n .card header h4 {\\n font-size: 1em;\\n font-weight: normal; }\\n .card section.images {\\n position: relative; }\\n .card section.images, .card section.images * {\\n width: 100%;\\n height: 100%; }\\n .card section.images figure {\\n margin: 0;\\n position: absolute;\\n top: 0;\\n left: 0; }\\n .card section.images figure:first-of-type {\\n z-index: 5; }\\n .card section.images figure img.blank {\\n position: absolute;\\n top: 0;\\n left: 0;\\n z-index: 20; }\\n\", \"\"]);\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/styles/main.scss?./node_modules/css-loader/dist/cjs.js!./node_modules/sass-loader/lib/loader.js"); /***/ }), @@ -606,6 +606,17 @@ eval("/* WEBPACK VAR INJECTION */(function(global) {var scope = typeof global != /***/ }), +/***/ "./node_modules/vue-infinite-loading/dist/vue-infinite-loading.js": +/*!************************************************************************!*\ + !*** ./node_modules/vue-infinite-loading/dist/vue-infinite-loading.js ***! + \************************************************************************/ +/*! no static exports found */ +/***/ (function(module, exports, __webpack_require__) { + +eval("/*!\n * vue-infinite-loading v2.4.4\n * (c) 2016-2019 PeachScript\n * MIT License\n */\n!function (t, e) {\n true ? module.exports = e() : undefined;\n}(this, function () {\n return function (t) {\n var e = {};\n\n function n(i) {\n if (e[i]) return e[i].exports;\n var r = e[i] = {\n i: i,\n l: !1,\n exports: {}\n };\n return t[i].call(r.exports, r, r.exports, n), r.l = !0, r.exports;\n }\n\n return n.m = t, n.c = e, n.d = function (t, e, i) {\n n.o(t, e) || Object.defineProperty(t, e, {\n enumerable: !0,\n get: i\n });\n }, n.r = function (t) {\n \"undefined\" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(t, Symbol.toStringTag, {\n value: \"Module\"\n }), Object.defineProperty(t, \"__esModule\", {\n value: !0\n });\n }, n.t = function (t, e) {\n if (1 & e && (t = n(t)), 8 & e) return t;\n if (4 & e && \"object\" == typeof t && t && t.__esModule) return t;\n var i = Object.create(null);\n if (n.r(i), Object.defineProperty(i, \"default\", {\n enumerable: !0,\n value: t\n }), 2 & e && \"string\" != typeof t) for (var r in t) n.d(i, r, function (e) {\n return t[e];\n }.bind(null, r));\n return i;\n }, n.n = function (t) {\n var e = t && t.__esModule ? function () {\n return t.default;\n } : function () {\n return t;\n };\n return n.d(e, \"a\", e), e;\n }, n.o = function (t, e) {\n return Object.prototype.hasOwnProperty.call(t, e);\n }, n.p = \"\", n(n.s = 9);\n }([function (t, e, n) {\n var i = n(6);\n \"string\" == typeof i && (i = [[t.i, i, \"\"]]), i.locals && (t.exports = i.locals);\n (0, n(3).default)(\"09280948\", i, !0, {});\n }, function (t, e, n) {\n var i = n(8);\n \"string\" == typeof i && (i = [[t.i, i, \"\"]]), i.locals && (t.exports = i.locals);\n (0, n(3).default)(\"51e4c3f9\", i, !0, {});\n }, function (t, e) {\n t.exports = function (t) {\n var e = [];\n return e.toString = function () {\n return this.map(function (e) {\n var n = function (t, e) {\n var n = t[1] || \"\",\n i = t[3];\n if (!i) return n;\n\n if (e && \"function\" == typeof btoa) {\n var r = (o = i, \"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,\" + btoa(unescape(encodeURIComponent(JSON.stringify(o)))) + \" */\"),\n a = i.sources.map(function (t) {\n return \"/*# sourceURL=\" + i.sourceRoot + t + \" */\";\n });\n return [n].concat(a).concat([r]).join(\"\\n\");\n }\n\n var o;\n return [n].join(\"\\n\");\n }(e, t);\n\n return e[2] ? \"@media \" + e[2] + \"{\" + n + \"}\" : n;\n }).join(\"\");\n }, e.i = function (t, n) {\n \"string\" == typeof t && (t = [[null, t, \"\"]]);\n\n for (var i = {}, r = 0; r < this.length; r++) {\n var a = this[r][0];\n \"number\" == typeof a && (i[a] = !0);\n }\n\n for (r = 0; r < t.length; r++) {\n var o = t[r];\n \"number\" == typeof o[0] && i[o[0]] || (n && !o[2] ? o[2] = n : n && (o[2] = \"(\" + o[2] + \") and (\" + n + \")\"), e.push(o));\n }\n }, e;\n };\n }, function (t, e, n) {\n \"use strict\";\n\n function i(t, e) {\n for (var n = [], i = {}, r = 0; r < e.length; r++) {\n var a = e[r],\n o = a[0],\n s = {\n id: t + \":\" + r,\n css: a[1],\n media: a[2],\n sourceMap: a[3]\n };\n i[o] ? i[o].parts.push(s) : n.push(i[o] = {\n id: o,\n parts: [s]\n });\n }\n\n return n;\n }\n\n n.r(e), n.d(e, \"default\", function () {\n return b;\n });\n var r = \"undefined\" != typeof document;\n if (\"undefined\" != typeof DEBUG && DEBUG && !r) throw new Error(\"vue-style-loader cannot be used in a non-browser environment. Use { target: 'node' } in your Webpack config to indicate a server-rendering environment.\");\n\n var a = {},\n o = r && (document.head || document.getElementsByTagName(\"head\")[0]),\n s = null,\n l = 0,\n d = !1,\n c = function () {},\n u = null,\n p = \"data-vue-ssr-id\",\n f = \"undefined\" != typeof navigator && /msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());\n\n function b(t, e, n, r) {\n d = n, u = r || {};\n var o = i(t, e);\n return h(o), function (e) {\n for (var n = [], r = 0; r < o.length; r++) {\n var s = o[r];\n (l = a[s.id]).refs--, n.push(l);\n }\n\n e ? h(o = i(t, e)) : o = [];\n\n for (r = 0; r < n.length; r++) {\n var l;\n\n if (0 === (l = n[r]).refs) {\n for (var d = 0; d < l.parts.length; d++) l.parts[d]();\n\n delete a[l.id];\n }\n }\n };\n }\n\n function h(t) {\n for (var e = 0; e < t.length; e++) {\n var n = t[e],\n i = a[n.id];\n\n if (i) {\n i.refs++;\n\n for (var r = 0; r < i.parts.length; r++) i.parts[r](n.parts[r]);\n\n for (; r < n.parts.length; r++) i.parts.push(g(n.parts[r]));\n\n i.parts.length > n.parts.length && (i.parts.length = n.parts.length);\n } else {\n var o = [];\n\n for (r = 0; r < n.parts.length; r++) o.push(g(n.parts[r]));\n\n a[n.id] = {\n id: n.id,\n refs: 1,\n parts: o\n };\n }\n }\n }\n\n function m() {\n var t = document.createElement(\"style\");\n return t.type = \"text/css\", o.appendChild(t), t;\n }\n\n function g(t) {\n var e,\n n,\n i = document.querySelector(\"style[\" + p + '~=\"' + t.id + '\"]');\n\n if (i) {\n if (d) return c;\n i.parentNode.removeChild(i);\n }\n\n if (f) {\n var r = l++;\n i = s || (s = m()), e = w.bind(null, i, r, !1), n = w.bind(null, i, r, !0);\n } else i = m(), e = function (t, e) {\n var n = e.css,\n i = e.media,\n r = e.sourceMap;\n i && t.setAttribute(\"media\", i);\n u.ssrId && t.setAttribute(p, e.id);\n r && (n += \"\\n/*# sourceURL=\" + r.sources[0] + \" */\", n += \"\\n/*# sourceMappingURL=data:application/json;base64,\" + btoa(unescape(encodeURIComponent(JSON.stringify(r)))) + \" */\");\n if (t.styleSheet) t.styleSheet.cssText = n;else {\n for (; t.firstChild;) t.removeChild(t.firstChild);\n\n t.appendChild(document.createTextNode(n));\n }\n }.bind(null, i), n = function () {\n i.parentNode.removeChild(i);\n };\n\n return e(t), function (i) {\n if (i) {\n if (i.css === t.css && i.media === t.media && i.sourceMap === t.sourceMap) return;\n e(t = i);\n } else n();\n };\n }\n\n var v,\n y = (v = [], function (t, e) {\n return v[t] = e, v.filter(Boolean).join(\"\\n\");\n });\n\n function w(t, e, n, i) {\n var r = n ? \"\" : i.css;\n if (t.styleSheet) t.styleSheet.cssText = y(e, r);else {\n var a = document.createTextNode(r),\n o = t.childNodes;\n o[e] && t.removeChild(o[e]), o.length ? t.insertBefore(a, o[e]) : t.appendChild(a);\n }\n }\n }, function (t, e) {\n function n(t) {\n return (n = \"function\" == typeof Symbol && \"symbol\" == typeof Symbol.iterator ? function (t) {\n return typeof t;\n } : function (t) {\n return t && \"function\" == typeof Symbol && t.constructor === Symbol && t !== Symbol.prototype ? \"symbol\" : typeof t;\n })(t);\n }\n\n function i(e) {\n return \"function\" == typeof Symbol && \"symbol\" === n(Symbol.iterator) ? t.exports = i = function (t) {\n return n(t);\n } : t.exports = i = function (t) {\n return t && \"function\" == typeof Symbol && t.constructor === Symbol && t !== Symbol.prototype ? \"symbol\" : n(t);\n }, i(e);\n }\n\n t.exports = i;\n }, function (t, e, n) {\n \"use strict\";\n\n n.r(e);\n var i = n(0),\n r = n.n(i);\n\n for (var a in i) \"default\" !== a && function (t) {\n n.d(e, t, function () {\n return i[t];\n });\n }(a);\n\n e.default = r.a;\n }, function (t, e, n) {\n (t.exports = n(2)(!1)).push([t.i, '.loading-wave-dots[data-v-46b20d22]{position:relative}.loading-wave-dots[data-v-46b20d22] .wave-item{position:absolute;top:50%;left:50%;display:inline-block;margin-top:-4px;width:8px;height:8px;border-radius:50%;-webkit-animation:loading-wave-dots-data-v-46b20d22 linear 2.8s infinite;animation:loading-wave-dots-data-v-46b20d22 linear 2.8s infinite}.loading-wave-dots[data-v-46b20d22] .wave-item:first-child{margin-left:-36px}.loading-wave-dots[data-v-46b20d22] .wave-item:nth-child(2){margin-left:-20px;-webkit-animation-delay:.14s;animation-delay:.14s}.loading-wave-dots[data-v-46b20d22] .wave-item:nth-child(3){margin-left:-4px;-webkit-animation-delay:.28s;animation-delay:.28s}.loading-wave-dots[data-v-46b20d22] .wave-item:nth-child(4){margin-left:12px;-webkit-animation-delay:.42s;animation-delay:.42s}.loading-wave-dots[data-v-46b20d22] .wave-item:last-child{margin-left:28px;-webkit-animation-delay:.56s;animation-delay:.56s}@-webkit-keyframes loading-wave-dots-data-v-46b20d22{0%{-webkit-transform:translateY(0);transform:translateY(0);background:#bbb}10%{-webkit-transform:translateY(-6px);transform:translateY(-6px);background:#999}20%{-webkit-transform:translateY(0);transform:translateY(0);background:#bbb}to{-webkit-transform:translateY(0);transform:translateY(0);background:#bbb}}@keyframes loading-wave-dots-data-v-46b20d22{0%{-webkit-transform:translateY(0);transform:translateY(0);background:#bbb}10%{-webkit-transform:translateY(-6px);transform:translateY(-6px);background:#999}20%{-webkit-transform:translateY(0);transform:translateY(0);background:#bbb}to{-webkit-transform:translateY(0);transform:translateY(0);background:#bbb}}.loading-circles[data-v-46b20d22] .circle-item{width:5px;height:5px;-webkit-animation:loading-circles-data-v-46b20d22 linear .75s infinite;animation:loading-circles-data-v-46b20d22 linear .75s infinite}.loading-circles[data-v-46b20d22] .circle-item:first-child{margin-top:-14.5px;margin-left:-2.5px}.loading-circles[data-v-46b20d22] .circle-item:nth-child(2){margin-top:-11.26px;margin-left:6.26px}.loading-circles[data-v-46b20d22] .circle-item:nth-child(3){margin-top:-2.5px;margin-left:9.5px}.loading-circles[data-v-46b20d22] .circle-item:nth-child(4){margin-top:6.26px;margin-left:6.26px}.loading-circles[data-v-46b20d22] .circle-item:nth-child(5){margin-top:9.5px;margin-left:-2.5px}.loading-circles[data-v-46b20d22] .circle-item:nth-child(6){margin-top:6.26px;margin-left:-11.26px}.loading-circles[data-v-46b20d22] .circle-item:nth-child(7){margin-top:-2.5px;margin-left:-14.5px}.loading-circles[data-v-46b20d22] .circle-item:last-child{margin-top:-11.26px;margin-left:-11.26px}@-webkit-keyframes loading-circles-data-v-46b20d22{0%{background:#dfdfdf}90%{background:#505050}to{background:#dfdfdf}}@keyframes loading-circles-data-v-46b20d22{0%{background:#dfdfdf}90%{background:#505050}to{background:#dfdfdf}}.loading-bubbles[data-v-46b20d22] .bubble-item{background:#666;-webkit-animation:loading-bubbles-data-v-46b20d22 linear .75s infinite;animation:loading-bubbles-data-v-46b20d22 linear .75s infinite}.loading-bubbles[data-v-46b20d22] .bubble-item:first-child{margin-top:-12.5px;margin-left:-.5px}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(2){margin-top:-9.26px;margin-left:8.26px}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(3){margin-top:-.5px;margin-left:11.5px}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(4){margin-top:8.26px;margin-left:8.26px}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(5){margin-top:11.5px;margin-left:-.5px}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(6){margin-top:8.26px;margin-left:-9.26px}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(7){margin-top:-.5px;margin-left:-12.5px}.loading-bubbles[data-v-46b20d22] .bubble-item:last-child{margin-top:-9.26px;margin-left:-9.26px}@-webkit-keyframes loading-bubbles-data-v-46b20d22{0%{width:1px;height:1px;box-shadow:0 0 0 3px #666}90%{width:1px;height:1px;box-shadow:0 0 0 0 #666}to{width:1px;height:1px;box-shadow:0 0 0 3px #666}}@keyframes loading-bubbles-data-v-46b20d22{0%{width:1px;height:1px;box-shadow:0 0 0 3px #666}90%{width:1px;height:1px;box-shadow:0 0 0 0 #666}to{width:1px;height:1px;box-shadow:0 0 0 3px #666}}.loading-default[data-v-46b20d22]{position:relative;border:1px solid #999;-webkit-animation:loading-rotating-data-v-46b20d22 ease 1.5s infinite;animation:loading-rotating-data-v-46b20d22 ease 1.5s infinite}.loading-default[data-v-46b20d22]:before{content:\"\";position:absolute;display:block;top:0;left:50%;margin-top:-3px;margin-left:-3px;width:6px;height:6px;background-color:#999;border-radius:50%}.loading-spiral[data-v-46b20d22]{border:2px solid #777;border-right-color:transparent;-webkit-animation:loading-rotating-data-v-46b20d22 linear .85s infinite;animation:loading-rotating-data-v-46b20d22 linear .85s infinite}@-webkit-keyframes loading-rotating-data-v-46b20d22{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes loading-rotating-data-v-46b20d22{0%{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.loading-bubbles[data-v-46b20d22],.loading-circles[data-v-46b20d22]{position:relative}.loading-bubbles[data-v-46b20d22] .bubble-item,.loading-circles[data-v-46b20d22] .circle-item{position:absolute;top:50%;left:50%;display:inline-block;border-radius:50%}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(2),.loading-circles[data-v-46b20d22] .circle-item:nth-child(2){-webkit-animation-delay:93ms;animation-delay:93ms}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(3),.loading-circles[data-v-46b20d22] .circle-item:nth-child(3){-webkit-animation-delay:.186s;animation-delay:.186s}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(4),.loading-circles[data-v-46b20d22] .circle-item:nth-child(4){-webkit-animation-delay:.279s;animation-delay:.279s}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(5),.loading-circles[data-v-46b20d22] .circle-item:nth-child(5){-webkit-animation-delay:.372s;animation-delay:.372s}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(6),.loading-circles[data-v-46b20d22] .circle-item:nth-child(6){-webkit-animation-delay:.465s;animation-delay:.465s}.loading-bubbles[data-v-46b20d22] .bubble-item:nth-child(7),.loading-circles[data-v-46b20d22] .circle-item:nth-child(7){-webkit-animation-delay:.558s;animation-delay:.558s}.loading-bubbles[data-v-46b20d22] .bubble-item:last-child,.loading-circles[data-v-46b20d22] .circle-item:last-child{-webkit-animation-delay:.651s;animation-delay:.651s}', \"\"]);\n }, function (t, e, n) {\n \"use strict\";\n\n n.r(e);\n var i = n(1),\n r = n.n(i);\n\n for (var a in i) \"default\" !== a && function (t) {\n n.d(e, t, function () {\n return i[t];\n });\n }(a);\n\n e.default = r.a;\n }, function (t, e, n) {\n (t.exports = n(2)(!1)).push([t.i, \".infinite-loading-container[data-v-46b21138]{clear:both;text-align:center}.infinite-loading-container[data-v-46b21138] [class^=loading-]{display:inline-block;margin:5px 0;width:28px;height:28px;font-size:28px;line-height:28px;border-radius:50%}.btn-try-infinite[data-v-46b21138]{margin-top:5px;padding:5px 10px;color:#999;font-size:14px;line-height:1;background:transparent;border:1px solid #ccc;border-radius:3px;outline:none;cursor:pointer}.btn-try-infinite[data-v-46b21138]:not(:active):hover{opacity:.8}\", \"\"]);\n }, function (t, e, n) {\n \"use strict\";\n\n n.r(e);\n\n var i = {\n throttleLimit: 50,\n loopCheckTimeout: 1e3,\n loopCheckMaxCalls: 10\n },\n r = function () {\n var t = !1;\n\n try {\n var e = Object.defineProperty({}, \"passive\", {\n get: function () {\n return t = {\n passive: !0\n }, !0;\n }\n });\n window.addEventListener(\"testpassive\", e, e), window.remove(\"testpassive\", e, e);\n } catch (t) {}\n\n return t;\n }(),\n a = {\n STATE_CHANGER: [\"emit `loaded` and `complete` event through component instance of `$refs` may cause error, so it will be deprecated soon, please use the `$state` argument instead (`$state` just the special `$event` variable):\", \"\\ntemplate:\", '', \"\\nscript:\\n...\\ninfiniteHandler($state) {\\n ajax('https://www.example.com/api/news')\\n .then((res) => {\\n if (res.data.length) {\\n $state.loaded();\\n } else {\\n $state.complete();\\n }\\n });\\n}\\n...\", \"\", \"more details: https://github.com/PeachScript/vue-infinite-loading/issues/57#issuecomment-324370549\"].join(\"\\n\"),\n INFINITE_EVENT: \"`:on-infinite` property will be deprecated soon, please use `@infinite` event instead.\",\n IDENTIFIER: \"the `reset` event will be deprecated soon, please reset this component by change the `identifier` property.\"\n },\n o = {\n INFINITE_LOOP: [\"executed the callback function more than \".concat(i.loopCheckMaxCalls, \" times for a short time, it looks like searched a wrong scroll wrapper that doest not has fixed height or maximum height, please check it. If you want to force to set a element as scroll wrapper ranther than automatic searching, you can do this:\"), '\\n\\x3c!-- add a special attribute for the real scroll wrapper --\\x3e\\n
\\n ...\\n \\x3c!-- set force-use-infinite-wrapper --\\x3e\\n \\n
\\nor\\n
\\n ...\\n \\x3c!-- set force-use-infinite-wrapper as css selector of the real scroll wrapper --\\x3e\\n \\n
\\n ', \"more details: https://github.com/PeachScript/vue-infinite-loading/issues/55#issuecomment-316934169\"].join(\"\\n\")\n },\n s = {\n READY: 0,\n LOADING: 1,\n COMPLETE: 2,\n ERROR: 3\n },\n l = {\n color: \"#666\",\n fontSize: \"14px\",\n padding: \"10px 0\"\n },\n d = {\n mode: \"development\",\n props: {\n spinner: \"default\",\n distance: 100,\n forceUseInfiniteWrapper: !1\n },\n system: i,\n slots: {\n noResults: \"No results :(\",\n noMore: \"No more data :)\",\n error: \"Opps, something went wrong :(\",\n errorBtnText: \"Retry\",\n spinner: \"\"\n },\n WARNINGS: a,\n ERRORS: o,\n STATUS: s\n },\n c = n(4),\n u = n.n(c),\n p = {\n BUBBLES: {\n render: function (t) {\n return t(\"span\", {\n attrs: {\n class: \"loading-bubbles\"\n }\n }, Array.apply(Array, Array(8)).map(function () {\n return t(\"span\", {\n attrs: {\n class: \"bubble-item\"\n }\n });\n }));\n }\n },\n CIRCLES: {\n render: function (t) {\n return t(\"span\", {\n attrs: {\n class: \"loading-circles\"\n }\n }, Array.apply(Array, Array(8)).map(function () {\n return t(\"span\", {\n attrs: {\n class: \"circle-item\"\n }\n });\n }));\n }\n },\n DEFAULT: {\n render: function (t) {\n return t(\"i\", {\n attrs: {\n class: \"loading-default\"\n }\n });\n }\n },\n SPIRAL: {\n render: function (t) {\n return t(\"i\", {\n attrs: {\n class: \"loading-spiral\"\n }\n });\n }\n },\n WAVEDOTS: {\n render: function (t) {\n return t(\"span\", {\n attrs: {\n class: \"loading-wave-dots\"\n }\n }, Array.apply(Array, Array(5)).map(function () {\n return t(\"span\", {\n attrs: {\n class: \"wave-item\"\n }\n });\n }));\n }\n }\n };\n\n function f(t, e, n, i, r, a, o, s) {\n var l,\n d = \"function\" == typeof t ? t.options : t;\n if (e && (d.render = e, d.staticRenderFns = n, d._compiled = !0), i && (d.functional = !0), a && (d._scopeId = \"data-v-\" + a), o ? (l = function (t) {\n (t = t || this.$vnode && this.$vnode.ssrContext || this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext) || \"undefined\" == typeof __VUE_SSR_CONTEXT__ || (t = __VUE_SSR_CONTEXT__), r && r.call(this, t), t && t._registeredComponents && t._registeredComponents.add(o);\n }, d._ssrRegister = l) : r && (l = s ? function () {\n r.call(this, this.$root.$options.shadowRoot);\n } : r), l) if (d.functional) {\n d._injectStyles = l;\n var c = d.render;\n\n d.render = function (t, e) {\n return l.call(e), c(t, e);\n };\n } else {\n var u = d.beforeCreate;\n d.beforeCreate = u ? [].concat(u, l) : [l];\n }\n return {\n exports: t,\n options: d\n };\n }\n\n var b = f({\n name: \"Spinner\",\n computed: {\n spinnerView: function () {\n return p[(this.$attrs.spinner || \"\").toUpperCase()] || this.spinnerInConfig;\n },\n spinnerInConfig: function () {\n return d.slots.spinner && \"string\" == typeof d.slots.spinner ? {\n render: function () {\n return this._v(d.slots.spinner);\n }\n } : \"object\" === u()(d.slots.spinner) ? d.slots.spinner : p[d.props.spinner.toUpperCase()] || p.DEFAULT;\n }\n }\n }, function () {\n var t = this.$createElement;\n return (this._self._c || t)(this.spinnerView, {\n tag: \"component\"\n });\n }, [], !1, function (t) {\n var e = n(5);\n e.__inject__ && e.__inject__(t);\n }, \"46b20d22\", null);\n b.options.__file = \"Spinner.vue\";\n var h = b.exports;\n\n function m(t) {\n \"production\" !== d.mode && console.warn(\"[Vue-infinite-loading warn]: \".concat(t));\n }\n\n function g(t) {\n console.error(\"[Vue-infinite-loading error]: \".concat(t));\n }\n\n var v = {\n timers: [],\n caches: [],\n throttle: function (t) {\n var e = this;\n -1 === this.caches.indexOf(t) && (this.caches.push(t), this.timers.push(setTimeout(function () {\n t(), e.caches.splice(e.caches.indexOf(t), 1), e.timers.shift();\n }, d.system.throttleLimit)));\n },\n reset: function () {\n this.timers.forEach(function (t) {\n clearTimeout(t);\n }), this.timers.length = 0, this.caches = [];\n }\n },\n y = {\n isChecked: !1,\n timer: null,\n times: 0,\n track: function () {\n var t = this;\n this.times += 1, clearTimeout(this.timer), this.timer = setTimeout(function () {\n t.isChecked = !0;\n }, d.system.loopCheckTimeout), this.times > d.system.loopCheckMaxCalls && (g(o.INFINITE_LOOP), this.isChecked = !0);\n }\n },\n w = {\n key: \"_infiniteScrollHeight\",\n getScrollElm: function (t) {\n return t === window ? document.documentElement : t;\n },\n save: function (t) {\n var e = this.getScrollElm(t);\n e[this.key] = e.scrollHeight;\n },\n restore: function (t) {\n var e = this.getScrollElm(t);\n \"number\" == typeof e[this.key] && (e.scrollTop = e.scrollHeight - e[this.key] + e.scrollTop), this.remove(e);\n },\n remove: function (t) {\n void 0 !== t[this.key] && delete t[this.key];\n }\n };\n\n function x(t) {\n return t.replace(/[A-Z]/g, function (t) {\n return \"-\".concat(t.toLowerCase());\n });\n }\n\n function k(t) {\n return t.offsetWidth + t.offsetHeight > 0;\n }\n\n var S = f({\n name: \"InfiniteLoading\",\n data: function () {\n return {\n scrollParent: null,\n scrollHandler: null,\n isFirstLoad: !0,\n status: s.READY,\n slots: d.slots\n };\n },\n components: {\n Spinner: h\n },\n computed: {\n isShowSpinner: function () {\n return this.status === s.LOADING;\n },\n isShowError: function () {\n return this.status === s.ERROR;\n },\n isShowNoResults: function () {\n return this.status === s.COMPLETE && this.isFirstLoad;\n },\n isShowNoMore: function () {\n return this.status === s.COMPLETE && !this.isFirstLoad;\n },\n slotStyles: function () {\n var t = this,\n e = {};\n return Object.keys(d.slots).forEach(function (n) {\n var i = x(n);\n (!t.$slots[i] && !d.slots[n].render || t.$slots[i] && !t.$slots[i][0].tag) && (e[n] = l);\n }), e;\n }\n },\n props: {\n distance: {\n type: Number,\n default: d.props.distance\n },\n spinner: String,\n direction: {\n type: String,\n default: \"bottom\"\n },\n forceUseInfiniteWrapper: {\n type: [Boolean, String],\n default: d.props.forceUseInfiniteWrapper\n },\n identifier: {\n default: +new Date()\n },\n onInfinite: Function\n },\n watch: {\n identifier: function () {\n this.stateChanger.reset();\n }\n },\n mounted: function () {\n var t = this;\n this.$watch(\"forceUseInfiniteWrapper\", function () {\n t.scrollParent = t.getScrollParent();\n }, {\n immediate: !0\n }), this.scrollHandler = function (e) {\n t.status === s.READY && (e && e.constructor === Event && k(t.$el) ? v.throttle(t.attemptLoad) : t.attemptLoad());\n }, setTimeout(function () {\n t.scrollHandler(), t.scrollParent.addEventListener(\"scroll\", t.scrollHandler, r);\n }, 1), this.$on(\"$InfiniteLoading:loaded\", function (e) {\n t.isFirstLoad = !1, \"top\" === t.direction && t.$nextTick(function () {\n w.restore(t.scrollParent);\n }), t.status === s.LOADING && t.$nextTick(t.attemptLoad.bind(null, !0)), e && e.target === t || m(a.STATE_CHANGER);\n }), this.$on(\"$InfiniteLoading:complete\", function (e) {\n t.status = s.COMPLETE, t.$nextTick(function () {\n t.$forceUpdate();\n }), t.scrollParent.removeEventListener(\"scroll\", t.scrollHandler, r), e && e.target === t || m(a.STATE_CHANGER);\n }), this.$on(\"$InfiniteLoading:reset\", function (e) {\n t.status = s.READY, t.isFirstLoad = !0, w.remove(t.scrollParent), t.scrollParent.addEventListener(\"scroll\", t.scrollHandler, r), setTimeout(function () {\n v.reset(), t.scrollHandler();\n }, 1), e && e.target === t || m(a.IDENTIFIER);\n }), this.stateChanger = {\n loaded: function () {\n t.$emit(\"$InfiniteLoading:loaded\", {\n target: t\n });\n },\n complete: function () {\n t.$emit(\"$InfiniteLoading:complete\", {\n target: t\n });\n },\n reset: function () {\n t.$emit(\"$InfiniteLoading:reset\", {\n target: t\n });\n },\n error: function () {\n t.status = s.ERROR, v.reset();\n }\n }, this.onInfinite && m(a.INFINITE_EVENT);\n },\n deactivated: function () {\n this.status === s.LOADING && (this.status = s.READY), this.scrollParent.removeEventListener(\"scroll\", this.scrollHandler, r);\n },\n activated: function () {\n this.scrollParent.addEventListener(\"scroll\", this.scrollHandler, r);\n },\n methods: {\n attemptLoad: function (t) {\n var e = this;\n this.status !== s.COMPLETE && k(this.$el) && this.getCurrentDistance() <= this.distance ? (this.status = s.LOADING, \"top\" === this.direction && this.$nextTick(function () {\n w.save(e.scrollParent);\n }), \"function\" == typeof this.onInfinite ? this.onInfinite.call(null, this.stateChanger) : this.$emit(\"infinite\", this.stateChanger), !t || this.forceUseInfiniteWrapper || y.isChecked || y.track()) : this.status === s.LOADING && (this.status = s.READY);\n },\n getCurrentDistance: function () {\n var t;\n \"top\" === this.direction ? t = \"number\" == typeof this.scrollParent.scrollTop ? this.scrollParent.scrollTop : this.scrollParent.pageYOffset : t = this.$el.getBoundingClientRect().top - (this.scrollParent === window ? window.innerHeight : this.scrollParent.getBoundingClientRect().bottom);\n return t;\n },\n getScrollParent: function () {\n var t,\n e = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : this.$el;\n return \"string\" == typeof this.forceUseInfiniteWrapper && (t = e.querySelector(this.forceUseInfiniteWrapper)), t || (\"BODY\" === e.tagName ? t = window : !this.forceUseInfiniteWrapper && [\"scroll\", \"auto\"].indexOf(getComputedStyle(e).overflowY) > -1 ? t = e : (e.hasAttribute(\"infinite-wrapper\") || e.hasAttribute(\"data-infinite-wrapper\")) && (t = e)), t || this.getScrollParent(e.parentNode);\n }\n },\n destroyed: function () {\n !this.status !== s.COMPLETE && (v.reset(), w.remove(this.scrollParent), this.scrollParent.removeEventListener(\"scroll\", this.scrollHandler, r));\n }\n }, function () {\n var t = this,\n e = t.$createElement,\n n = t._self._c || e;\n return n(\"div\", {\n staticClass: \"infinite-loading-container\"\n }, [n(\"div\", {\n directives: [{\n name: \"show\",\n rawName: \"v-show\",\n value: t.isShowSpinner,\n expression: \"isShowSpinner\"\n }],\n staticClass: \"infinite-status-prompt\",\n style: t.slotStyles.spinner\n }, [t._t(\"spinner\", [n(\"spinner\", {\n attrs: {\n spinner: t.spinner\n }\n })])], 2), t._v(\" \"), n(\"div\", {\n directives: [{\n name: \"show\",\n rawName: \"v-show\",\n value: t.isShowNoResults,\n expression: \"isShowNoResults\"\n }],\n staticClass: \"infinite-status-prompt\",\n style: t.slotStyles.noResults\n }, [t._t(\"no-results\", [t.slots.noResults.render ? n(t.slots.noResults, {\n tag: \"component\"\n }) : [t._v(t._s(t.slots.noResults))]])], 2), t._v(\" \"), n(\"div\", {\n directives: [{\n name: \"show\",\n rawName: \"v-show\",\n value: t.isShowNoMore,\n expression: \"isShowNoMore\"\n }],\n staticClass: \"infinite-status-prompt\",\n style: t.slotStyles.noMore\n }, [t._t(\"no-more\", [t.slots.noMore.render ? n(t.slots.noMore, {\n tag: \"component\"\n }) : [t._v(t._s(t.slots.noMore))]])], 2), t._v(\" \"), n(\"div\", {\n directives: [{\n name: \"show\",\n rawName: \"v-show\",\n value: t.isShowError,\n expression: \"isShowError\"\n }],\n staticClass: \"infinite-status-prompt\",\n style: t.slotStyles.error\n }, [t._t(\"error\", [t.slots.error.render ? n(t.slots.error, {\n tag: \"component\",\n attrs: {\n trigger: t.attemptLoad\n }\n }) : [t._v(\"\\n \" + t._s(t.slots.error) + \"\\n \"), n(\"br\"), t._v(\" \"), n(\"button\", {\n staticClass: \"btn-try-infinite\",\n domProps: {\n textContent: t._s(t.slots.errorBtnText)\n },\n on: {\n click: t.attemptLoad\n }\n })]], {\n trigger: t.attemptLoad\n })], 2)]);\n }, [], !1, function (t) {\n var e = n(7);\n e.__inject__ && e.__inject__(t);\n }, \"46b21138\", null);\n S.options.__file = \"InfiniteLoading.vue\";\n var E = S.exports;\n\n function _(t) {\n d.mode = t.config.productionTip ? \"development\" : \"production\";\n }\n\n Object.defineProperty(E, \"install\", {\n configurable: !1,\n enumerable: !1,\n value: function (t, e) {\n Object.assign(d.props, e && e.props), Object.assign(d.slots, e && e.slots), Object.assign(d.system, e && e.system), t.component(\"infinite-loading\", E), _(t);\n }\n }), \"undefined\" != typeof window && window.Vue && (window.Vue.component(\"infinite-loading\", E), _(window.Vue));\n e.default = E;\n }]);\n});\n\n//# sourceURL=webpack:///./node_modules/vue-infinite-loading/dist/vue-infinite-loading.js?"); + +/***/ }), + /***/ "./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/vue-loader/lib/index.js?!./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue?vue&type=template&id=294c3eb1&scoped=true&v-slot=default&": /*!***********************************************************************************************************************************************************************************************************************************************************************!*\ !*** ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue?vue&type=template&id=294c3eb1&scoped=true&v-slot=default& ***! @@ -638,7 +649,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) * /***/ (function(module, __webpack_exports__, __webpack_require__) { "use strict"; -eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"Base\" } }, [\n _c(\"h1\", { staticClass: \"page-title\" }, [_vm._v(_vm._s(_vm.pagetitle))]),\n _vm._v(\" \"),\n !_vm.items.length\n ? _c(\"div\", { staticClass: \"loading\" }, [\n _c(\"span\", [_vm._v(\"Loading ...\")])\n ])\n : _c(\"div\", { staticClass: \"cards-list\" }, [\n _c(\"aside\", { staticClass: \"search-info\" }, [\n _vm._v(\"\\n \" + _vm._s(_vm.searchinfos) + \"\\n \")\n ]),\n _vm._v(\" \"),\n _c(\n \"ul\",\n _vm._l(_vm.items, function(item) {\n return _c(\n \"li\",\n { key: item.uuid },\n [_c(\"Card\", { attrs: { item: item } })],\n 1\n )\n }),\n 0\n )\n ])\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options"); +eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"render\", function() { return render; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"staticRenderFns\", function() { return staticRenderFns; });\nvar render = function() {\n var _vm = this\n var _h = _vm.$createElement\n var _c = _vm._self._c || _h\n return _c(\"div\", { attrs: { id: \"Base\" } }, [\n _c(\"h1\", { staticClass: \"page-title\" }, [_vm._v(_vm._s(_vm.pagetitle))]),\n _vm._v(\" \"),\n !_vm.items.length\n ? _c(\"div\", { staticClass: \"loading\" }, [\n _c(\"span\", [_vm._v(\"Loading ...\")])\n ])\n : _c(\n \"div\",\n { staticClass: \"cards-list\" },\n [\n _c(\"aside\", { staticClass: \"search-info\" }, [\n _vm._v(\"\\n \" + _vm._s(_vm.searchinfos) + \"\\n \")\n ]),\n _vm._v(\" \"),\n _c(\n \"ul\",\n _vm._l(_vm.items, function(item) {\n return _c(\n \"li\",\n { key: item.uuid },\n [_c(\"Card\", { attrs: { item: item } })],\n 1\n )\n }),\n 0\n ),\n _vm._v(\" \"),\n _vm.count > _vm.limit\n ? _c(\"infinite-loading\", { on: { infinite: _vm.nextPage } }, [\n _c(\"div\", { attrs: { slot: \"no-more\" }, slot: \"no-more\" }, [\n _vm._v(\"No more results\")\n ])\n ])\n : _vm._e()\n ],\n 1\n )\n ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\n\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/components/Content/Base.vue?./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options"); /***/ }), @@ -790,7 +801,7 @@ eval("var g; // This works in non-strict mode\n\ng = function () {\n return thi /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _UserBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/UserBlock.vue\"));\n\nvar _MainContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MainContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue\"));\n\nvar _SearchBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/SearchBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\n__webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n// require('theme/assets/styles/main.scss');\n(function (Drupal, drupalSettings) {\n var MaterioTheme = function MaterioTheme() {\n var _v_sitebranding_block, _v_user_block, _v_main_content, _v_search_block;\n\n var _is_front = drupalSettings.path.isFront;\n console.log('drupalSettings', drupalSettings); // ___ _ _\n // |_ _|_ _ (_) |_\n // | || ' \\| | _|\n // |___|_||_|_|\\__|\n\n function init() {\n console.log(\"MaterioTheme init()\");\n initVues();\n }\n\n function initVues() {\n initVSiteBrandingBlock();\n initVUserBlock();\n initVMainContent();\n initVSearchBlock();\n }\n\n function initVSiteBrandingBlock() {\n _v_sitebranding_block = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: '#block-sitebranding',\n methods: {\n onclick: function onclick(event) {\n // console.log(\"Clicked on logo event\", event);\n var href = event.target.getAttribute('href'); // console.log(\"Clicked on logo href\", href);\n\n this.$router.push(href);\n }\n }\n });\n }\n\n function initVUserBlock() {\n var mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';\n var props = {\n title: \"\",\n loginblock: \"\"\n };\n\n switch (mount_point) {\n case 'block-userlogin':\n var $block = document.getElementById(mount_point);\n console.log('initVUserBlock login form html', $block);\n props.loginblock = $block.outerHTML.trim();\n break;\n\n case 'block-userblock':\n default:\n break;\n }\n\n _v_user_block = new _vue.default({\n store: _store.default,\n // computed: {\n // ...mapState({\n // isloggedin: state => state.User.isloggedin\n // })\n // },\n created: function created() {\n // if already loggedin, call store.user to get the user infos\n if (drupalSettings.user.uid !== 0) {\n this.$store.commit('User/setUid', drupalSettings.user.uid);\n this.$store.dispatch('User/getUser');\n }\n },\n render: function render(h) {\n return h(_UserBlock.default, {\n props: props\n });\n }\n }).$mount('#' + mount_point); // console.log('initVUserBlock', _v_user_block);\n }\n\n function initVMainContent() {\n var id = \"main-content\";\n var $main_content = document.querySelector('#' + id); // console.log('main-content', $main_content);\n\n var main_html = $main_content.innerHTML;\n _v_main_content = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_MainContent.default, {\n props: {\n id: id,\n html: main_html,\n isfront: drupalSettings.path.isFront\n }\n });\n }\n }).$mount('#' + id); // console.log('initTestVContent', v_test_content);\n }\n\n function initVSearchBlock() {\n // console.log('initVSearchBlock');\n var id = \"block-materiosapisearchblock\";\n var $search_block = document.getElementById(id);\n var formhtml = null;\n\n if ($search_block) {\n // get the search form html to pass it as template to the vue\n // we gain display speed vs async downloaded data\n formhtml = $search_block.innerHTML;\n } else {\n // else create the empty block to fill it later with async data\n $search_block = document.createElement('div');\n $search_block.setAttribute('id', id);\n var $region = document.getElementById('content-top');\n $region.appendChild($search_block);\n } // in any case create the vue\n\n\n _v_search_block = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_SearchBlock.default, {\n props: {\n blockid: id,\n formhtml: formhtml\n }\n });\n }\n }).$mount('#' + id);\n }\n\n init();\n }; // end MaterioTheme()\n\n\n var materiotheme = new MaterioTheme();\n})(Drupal, drupalSettings);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/scripts/main.js?"); +eval("\n\nvar _vue = _interopRequireDefault(__webpack_require__(/*! vue */ \"./node_modules/vue/dist/vue.js\"));\n\nvar _vueInfiniteLoading = _interopRequireDefault(__webpack_require__(/*! vue-infinite-loading */ \"./node_modules/vue-infinite-loading/dist/vue-infinite-loading.js\"));\n\nvar _store = _interopRequireDefault(__webpack_require__(/*! vuejs/store */ \"./web/themes/custom/materiotheme/vuejs/store/index.js\"));\n\nvar _route = _interopRequireDefault(__webpack_require__(/*! vuejs/route */ \"./web/themes/custom/materiotheme/vuejs/route/index.js\"));\n\nvar _UserBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/UserBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/UserBlock.vue\"));\n\nvar _MainContent = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Content/MainContent */ \"./web/themes/custom/materiotheme/vuejs/components/Content/MainContent.vue\"));\n\nvar _SearchBlock = _interopRequireDefault(__webpack_require__(/*! vuejs/components/Block/SearchBlock */ \"./web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue\"));\n\nvar _vuex = __webpack_require__(/*! vuex */ \"./node_modules/vuex/dist/vuex.esm.js\");\n\n__webpack_require__(/*! theme/assets/styles/main.scss */ \"./web/themes/custom/materiotheme/assets/styles/main.scss\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\n_vue.default.use(_vueInfiniteLoading.default, {\n props: {\n spinner: 'spiral' // slots.noMore: ''\n\n } // system: {\n // throttleLimit: 50,\n // /* other settings need to configure */\n // }\n\n});\n\n(function (Drupal, drupalSettings) {\n var MaterioTheme = function MaterioTheme() {\n var _v_sitebranding_block, _v_user_block, _v_main_content, _v_search_block;\n\n var _is_front = drupalSettings.path.isFront;\n console.log('drupalSettings', drupalSettings); // ___ _ _\n // |_ _|_ _ (_) |_\n // | || ' \\| | _|\n // |___|_||_|_|\\__|\n\n function init() {\n console.log(\"MaterioTheme init()\");\n initVues();\n }\n\n function initVues() {\n initVSiteBrandingBlock();\n initVUserBlock();\n initVMainContent();\n initVSearchBlock();\n }\n\n function initVSiteBrandingBlock() {\n _v_sitebranding_block = new _vue.default({\n store: _store.default,\n router: _route.default,\n el: '#block-sitebranding',\n methods: {\n onclick: function onclick(event) {\n // console.log(\"Clicked on logo event\", event);\n var href = event.target.getAttribute('href'); // console.log(\"Clicked on logo href\", href);\n\n this.$router.push(href);\n }\n }\n });\n }\n\n function initVUserBlock() {\n var mount_point = drupalSettings.user.uid !== 0 ? 'block-userblock' : 'block-userlogin';\n var props = {\n title: \"\",\n loginblock: \"\"\n };\n\n switch (mount_point) {\n case 'block-userlogin':\n var $block = document.getElementById(mount_point);\n console.log('initVUserBlock login form html', $block);\n props.loginblock = $block.outerHTML.trim();\n break;\n\n case 'block-userblock':\n default:\n break;\n }\n\n _v_user_block = new _vue.default({\n store: _store.default,\n // computed: {\n // ...mapState({\n // isloggedin: state => state.User.isloggedin\n // })\n // },\n created: function created() {\n // if already loggedin, call store.user to get the user infos\n if (drupalSettings.user.uid !== 0) {\n this.$store.commit('User/setUid', drupalSettings.user.uid);\n this.$store.dispatch('User/getUser');\n }\n },\n render: function render(h) {\n return h(_UserBlock.default, {\n props: props\n });\n }\n }).$mount('#' + mount_point); // console.log('initVUserBlock', _v_user_block);\n }\n\n function initVMainContent() {\n var id = \"main-content\";\n var $main_content = document.querySelector('#' + id); // console.log('main-content', $main_content);\n\n var main_html = $main_content.innerHTML;\n _v_main_content = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_MainContent.default, {\n props: {\n id: id,\n html: main_html,\n isfront: drupalSettings.path.isFront\n }\n });\n }\n }).$mount('#' + id); // console.log('initTestVContent', v_test_content);\n }\n\n function initVSearchBlock() {\n // console.log('initVSearchBlock');\n var id = \"block-materiosapisearchblock\";\n var $search_block = document.getElementById(id);\n var formhtml = null;\n\n if ($search_block) {\n // get the search form html to pass it as template to the vue\n // we gain display speed vs async downloaded data\n formhtml = $search_block.innerHTML;\n } else {\n // else create the empty block to fill it later with async data\n $search_block = document.createElement('div');\n $search_block.setAttribute('id', id);\n var $region = document.getElementById('content-top');\n $region.appendChild($search_block);\n } // in any case create the vue\n\n\n _v_search_block = new _vue.default({\n store: _store.default,\n render: function render(h) {\n return h(_SearchBlock.default, {\n props: {\n blockid: id,\n formhtml: formhtml\n }\n });\n }\n }).$mount('#' + id);\n }\n\n init();\n }; // end MaterioTheme()\n\n\n var materiotheme = new MaterioTheme();\n})(Drupal, drupalSettings);\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/assets/scripts/main.js?"); /***/ }), @@ -1185,7 +1196,7 @@ eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\n /***/ (function(module, exports, __webpack_require__) { "use strict"; -eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n\nvar _jsonAxios = __webpack_require__(/*! vuejs/api/json-axios */ \"./web/themes/custom/materiotheme/vuejs/api/json-axios.js\");\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nvar _querystring = _interopRequireDefault(__webpack_require__(/*! querystring */ \"./node_modules/querystring-es3/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar _default = {\n namespaced: true,\n // initial state\n state: {\n keys: \"\",\n term: \"\",\n uuids: [],\n items: [],\n offset: 0,\n limit: 15,\n infos: null,\n count: 0\n },\n // getters\n getters: {},\n // mutations\n mutations: {\n setUuids: function setUuids(state, uuids) {\n state.uuids = uuids;\n },\n resetUuids: function resetUuids(state) {\n state.uuids = [];\n },\n setItems: function setItems(state, items) {\n state.items = items;\n },\n resetItems: function resetItems(state) {\n state.items = [];\n },\n setKeys: function setKeys(state, keys) {\n state.keys = keys;\n },\n setTerm: function setTerm(state, term) {\n state.term = term;\n },\n setInfos: function setInfos(state, infos) {\n state.infos = infos;\n },\n setCount: function setCount(state, count) {\n state.count = count;\n },\n resetOffset: function resetOffset(state) {\n state.offset = 0;\n },\n incrementOffset: function incrementOffset(state) {\n state.offset += state.limit;\n }\n },\n // actions\n actions: {\n newSearch: function newSearch(_ref) {\n var dispatch = _ref.dispatch,\n commit = _ref.commit,\n state = _ref.state;\n console.log('Search newSearch');\n commit('resetUuids');\n commit('resetItems');\n commit('resetOffset');\n dispatch('getResults');\n },\n getResults: function getResults(_ref2) {\n var dispatch = _ref2.dispatch,\n commit = _ref2.commit,\n state = _ref2.state;\n var params = {\n keys: state.keys,\n term: state.term,\n offset: state.offset,\n limit: state.limit // console.log('Search getResults params', params);\n\n };\n\n var q = _querystring.default.stringify(params);\n\n return _maAxios.MA.get(\"/materio_sapi/getresults?\" + q).then(function (_ref3) {\n var data = _ref3.data;\n console.log('search MA getresults data', data); // commit('setItems', data.items)\n\n commit('setInfos', data.infos);\n commit('setCount', data.count);\n commit('setUuids', data.uuids);\n dispatch('getItems', data.uuids);\n }).catch(function (error) {\n console.warn('Issue with getResults', error);\n Promise.reject(error);\n });\n },\n getItems: function getItems(_ref4, uuids) {\n var dispatch = _ref4.dispatch,\n commit = _ref4.commit,\n state = _ref4.state;\n var params = {\n // include: 'images', // no needs to include thanks to consumers_image_styles module\n 'filter[uuids-groupe][group][conjunction]': 'OR'\n };\n\n for (var i = 0; i < uuids.length; i++) {\n var uuid = uuids[i];\n params[\"filter[\".concat(uuid, \"][condition][path]\")] = 'id';\n params[\"filter[\".concat(uuid, \"][condition][value]\")] = uuid;\n params[\"filter[\".concat(uuid, \"][condition][operator]\")] = '=';\n params[\"filter[\".concat(uuid, \"][condition][memberOf]\")] = 'uuids-groupe';\n }\n\n console.log('search JSONAPI params', params);\n\n var q = _querystring.default.stringify(params);\n\n return _jsonAxios.JSONAPI.get('node/materiau?' + q).then(function (_ref5) {\n var data = _ref5.data;\n console.log('search getItems data', data);\n dispatch('parseItems', {\n data: data.data,\n uuids: uuids\n }); // commit('setItems', data.items)\n }).catch(function (error) {\n console.warn('Issue with getItems', error);\n Promise.reject(error);\n });\n },\n parseItems: function parseItems(_ref6, _ref7) {\n var dispatch = _ref6.dispatch,\n commit = _ref6.commit,\n state = _ref6.state;\n var data = _ref7.data,\n uuids = _ref7.uuids;\n // data comes from jsonapi query\n // uuids comes from solr search query (we loop from uuids to conserve the search results order)\n console.log('search parseItems data, uuids', data, uuids);\n var items = []; // for (var i = 0; i < data.length; i++) {\n\n var _loop = function _loop() {\n var uuid = uuids[i];\n var item_index = data.findIndex(function (p) {\n return p.id == uuid;\n });\n var item_src = data[item_index];\n var attrs = item_src.attributes;\n var relations = item_src.relationships; // get field values\n\n var item = {\n uuid: uuid,\n title: attrs.title,\n description: attrs.field_short_description,\n body: attrs.body,\n reference: attrs.field_reference // get images included values\n\n };\n var img_src = relations.images.data;\n item.images = [];\n\n for (j = 0; j < img_src.length; j++) {\n // // https://stackoverflow.com/questions/11258077/how-to-find-index-of-an-object-by-key-and-value-in-an-javascript-array\n // let index = included.findIndex(p => p.id == img_src[j].id)\n // let img = included[index]\n item.images.push({\n title: img_src[j].meta.title,\n url: img_src[j].meta.imageDerivatives.links.card_medium.href\n });\n }\n\n items.push(item);\n };\n\n for (var i = 0; i < uuids.length; i++) {\n var j;\n\n _loop();\n }\n\n console.log('items', items);\n commit('setItems', items);\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/store/modules/search.js?"); +eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n value: true\n});\nexports.default = void 0;\n\nvar _jsonAxios = __webpack_require__(/*! vuejs/api/json-axios */ \"./web/themes/custom/materiotheme/vuejs/api/json-axios.js\");\n\nvar _maAxios = __webpack_require__(/*! vuejs/api/ma-axios */ \"./web/themes/custom/materiotheme/vuejs/api/ma-axios.js\");\n\nvar _querystring = _interopRequireDefault(__webpack_require__(/*! querystring */ \"./node_modules/querystring-es3/index.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar _default = {\n namespaced: true,\n // initial state\n state: {\n keys: \"\",\n term: \"\",\n uuids: [],\n items: [],\n offset: 0,\n limit: 15,\n infos: null,\n count: 0,\n // infinteState will come from vue-infinite-loading plugin\n // implemented in vuejs/components/Content/Base.vue\n infiniteState: null\n },\n // getters\n getters: {},\n // mutations\n mutations: {\n setUuids: function setUuids(state, uuids) {\n state.uuids = state.uuids.concat(uuids);\n },\n resetUuids: function resetUuids(state) {\n state.uuids = [];\n },\n setItems: function setItems(state, items) {\n state.items = state.items.concat(items);\n },\n resetItems: function resetItems(state) {\n state.items = [];\n },\n setKeys: function setKeys(state, keys) {\n state.keys = keys;\n },\n setTerm: function setTerm(state, term) {\n state.term = term;\n },\n setInfos: function setInfos(state, infos) {\n state.infos = infos;\n },\n setCount: function setCount(state, count) {\n state.count = count;\n },\n resetOffset: function resetOffset(state) {\n state.offset = 0;\n },\n incrementOffset: function incrementOffset(state) {\n state.offset += state.limit;\n },\n setInfiniteState: function setInfiniteState(state, s) {\n state.infiniteState = s;\n }\n },\n // actions\n actions: {\n newSearch: function newSearch(_ref) {\n var dispatch = _ref.dispatch,\n commit = _ref.commit,\n state = _ref.state;\n console.log('Search newSearch');\n commit('resetUuids');\n commit('resetItems');\n commit('resetOffset');\n dispatch('getResults');\n },\n nextPage: function nextPage(_ref2, $state) {\n var dispatch = _ref2.dispatch,\n commit = _ref2.commit,\n state = _ref2.state;\n console.log(\"Search nextPage\", $state);\n commit('incrementOffset');\n commit('setInfiniteState', $state);\n dispatch('getResults');\n },\n getResults: function getResults(_ref3) {\n var dispatch = _ref3.dispatch,\n commit = _ref3.commit,\n state = _ref3.state;\n var params = {\n keys: state.keys,\n term: state.term,\n offset: state.offset,\n limit: state.limit // console.log('Search getResults params', params);\n\n };\n\n var q = _querystring.default.stringify(params);\n\n return _maAxios.MA.get(\"/materio_sapi/getresults?\" + q).then(function (_ref4) {\n var data = _ref4.data;\n console.log('search MA getresults data', data); // commit('setItems', data.items)\n\n commit('setInfos', data.infos);\n commit('setCount', data.count);\n commit('setUuids', data.uuids);\n dispatch('getItems', data.uuids);\n }).catch(function (error) {\n console.warn('Issue with getResults', error);\n Promise.reject(error);\n });\n },\n getItems: function getItems(_ref5, uuids) {\n var dispatch = _ref5.dispatch,\n commit = _ref5.commit,\n state = _ref5.state;\n var params = {\n // include: 'images', // no needs to include thanks to consumers_image_styles module\n 'filter[uuids-groupe][group][conjunction]': 'OR'\n };\n\n for (var i = 0; i < uuids.length; i++) {\n var uuid = uuids[i];\n params[\"filter[\".concat(uuid, \"][condition][path]\")] = 'id';\n params[\"filter[\".concat(uuid, \"][condition][value]\")] = uuid;\n params[\"filter[\".concat(uuid, \"][condition][operator]\")] = '=';\n params[\"filter[\".concat(uuid, \"][condition][memberOf]\")] = 'uuids-groupe';\n } // console.log('search JSONAPI params', params);\n\n\n var q = _querystring.default.stringify(params);\n\n return _jsonAxios.JSONAPI.get('node/materiau?' + q).then(function (_ref6) {\n var data = _ref6.data;\n console.log('search getItems data', data);\n dispatch('parseItems', {\n data: data.data,\n uuids: uuids\n }); // commit('setItems', data.items)\n }).catch(function (error) {\n console.warn('Issue with getItems', error);\n Promise.reject(error);\n });\n },\n parseItems: function parseItems(_ref7, _ref8) {\n var dispatch = _ref7.dispatch,\n commit = _ref7.commit,\n state = _ref7.state;\n var data = _ref8.data,\n uuids = _ref8.uuids;\n // data comes from jsonapi query\n // uuids comes from solr search query (we loop from uuids to conserve the search results order)\n console.log('search parseItems data, uuids', data, uuids);\n var items = []; // for (var i = 0; i < data.length; i++) {\n\n var _loop = function _loop() {\n var uuid = uuids[i]; // https://stackoverflow.com/questions/11258077/how-to-find-index-of-an-object-by-key-and-value-in-an-javascript-array\n\n var item_index = data.findIndex(function (p) {\n return p.id == uuid;\n });\n var item_src = data[item_index];\n var attrs = item_src.attributes;\n var relations = item_src.relationships; // get field values\n\n var item = {\n uuid: uuid,\n title: attrs.title,\n description: attrs.field_short_description,\n body: attrs.body,\n reference: attrs.field_reference // get images included values\n\n };\n var img_src = relations.images.data;\n item.images = [];\n\n for (j = 0; j < img_src.length; j++) {\n item.images.push({\n title: img_src[j].meta.title,\n // meta.imageDerivatives.style.href link is provided by drupal consumers_image_styles module\n url: img_src[j].meta.imageDerivatives.links.card_medium.href\n });\n }\n\n items.push(item);\n };\n\n for (var i = 0; i < uuids.length; i++) {\n var j;\n\n _loop();\n }\n\n console.log('items', items);\n commit('setItems', items);\n\n if (state.infiniteState) {\n if (state.offset + state.limit > state.count) {\n console.log('Search infinite completed'); // tell to vue-infinite-loading plugin that there si no new page\n\n state.infiniteState.complete();\n } else {\n console.log('Search infinite loaded'); // tell to vue-infinite-loading plugin that newpage is loaded\n\n state.infiniteState.loaded();\n }\n }\n }\n }\n};\nexports.default = _default;\n\n//# sourceURL=webpack:///./web/themes/custom/materiotheme/vuejs/store/modules/search.js?"); /***/ }), diff --git a/web/themes/custom/materiotheme/assets/scripts/main.js b/web/themes/custom/materiotheme/assets/scripts/main.js index 9443b33..95b9732 100644 --- a/web/themes/custom/materiotheme/assets/scripts/main.js +++ b/web/themes/custom/materiotheme/assets/scripts/main.js @@ -1,5 +1,17 @@ import Vue from 'vue' +import InfiniteLoading from 'vue-infinite-loading'; +Vue.use(InfiniteLoading, { + props: { + spinner: 'spiral', + // slots.noMore: '' + }, + // system: { + // throttleLimit: 50, + // /* other settings need to configure */ + // } +}); + import store from 'vuejs/store' import router from 'vuejs/route' diff --git a/web/themes/custom/materiotheme/assets/styles/main.scss b/web/themes/custom/materiotheme/assets/styles/main.scss index 816bd5e..4f5009d 100644 --- a/web/themes/custom/materiotheme/assets/styles/main.scss +++ b/web/themes/custom/materiotheme/assets/styles/main.scss @@ -217,6 +217,15 @@ article.node--type-frontpage{ // | (__/ _` | '_/ _` (_-< // \___\__,_|_| \__,_/__/ +.infinite-loading-container{ + .infinite-status-prompt{ + i[class^="loading-"]{ + width:15px; height:15px; + } + } +} + + .cards-list{ &>ul{ margin:0; padding:0; diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue index 0a9425b..6ba8bb4 100644 --- a/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue +++ b/web/themes/custom/materiotheme/vuejs/components/Content/Base.vue @@ -13,6 +13,12 @@ + +
No more results
+ @@ -35,13 +41,20 @@ export default { computed: { ...mapState({ items: state => state.Search.items, - searchinfos: state => state.Search.infos + searchinfos: state => state.Search.infos, + count: state => state.Search.count, + limit: state => state.Search.limit }) }, methods: { ...mapActions({ - newSearch: 'Search/newSearch' - }) + newSearch: 'Search/newSearch', + nextPage: 'Search/nextPage' + }), + // infiniteHandler($state){ + // console.log('inifiniteHandler', $state); + // this.nextPage() + // } }, created() { // at first page load or first route entering launch a search if params exists in url query @@ -72,4 +85,5 @@ export default { diff --git a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue index 8fa9449..eb393e3 100644 --- a/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue +++ b/web/themes/custom/materiotheme/vuejs/components/Content/Card.vue @@ -70,7 +70,7 @@ export default { // lazy load images on mouseover this.$el.addEventListener('mouseover', function(event) { let imgs = this.querySelectorAll('.images figure img.lazy') - console.log('mouseover', this, imgs); + // console.log('mouseover', this, imgs); imgs.forEach((img) => { // console.log('forEach img',img); img.setAttribute('src', img.getAttribute('data-src')) diff --git a/web/themes/custom/materiotheme/vuejs/store/modules/search.js b/web/themes/custom/materiotheme/vuejs/store/modules/search.js index 9de4c96..584f727 100644 --- a/web/themes/custom/materiotheme/vuejs/store/modules/search.js +++ b/web/themes/custom/materiotheme/vuejs/store/modules/search.js @@ -14,7 +14,10 @@ export default { offset: 0, limit: 15, infos: null, - count: 0 + count: 0, + // infinteState will come from vue-infinite-loading plugin + // implemented in vuejs/components/Content/Base.vue + infiniteState: null }, // getters @@ -23,13 +26,13 @@ export default { // mutations mutations : { setUuids (state, uuids) { - state.uuids = uuids + state.uuids = state.uuids.concat(uuids) }, resetUuids (state) { state.uuids = [] }, setItems (state, items) { - state.items = items + state.items = state.items.concat(items) }, resetItems (state) { state.items = [] @@ -51,6 +54,9 @@ export default { }, incrementOffset(state) { state.offset += state.limit + }, + setInfiniteState(state, s){ + state.infiniteState = s } }, @@ -63,6 +69,12 @@ export default { commit('resetOffset') dispatch('getResults') }, + nextPage ({ dispatch, commit, state }, $state) { + console.log("Search nextPage", $state); + commit('incrementOffset') + commit('setInfiniteState', $state) + dispatch('getResults') + }, getResults ({ dispatch, commit, state }) { let params = { keys: state.keys, @@ -98,7 +110,7 @@ export default { params[`filter[${uuid}][condition][operator]`] = '=' params[`filter[${uuid}][condition][memberOf]`] = 'uuids-groupe' } - console.log('search JSONAPI params', params); + // console.log('search JSONAPI params', params); let q = qs.stringify(params) return JSONAPI.get('node/materiau?'+q) .then(({ data }) => { @@ -119,6 +131,7 @@ export default { // for (var i = 0; i < data.length; i++) { for (var i = 0; i < uuids.length; i++) { let uuid = uuids[i] + // https://stackoverflow.com/questions/11258077/how-to-find-index-of-an-object-by-key-and-value-in-an-javascript-array let item_index = data.findIndex(p => p.id == uuid) let item_src = data[item_index] let attrs = item_src.attributes @@ -137,19 +150,28 @@ export default { let img_src = relations.images.data item.images = [] for (var j = 0; j < img_src.length; j++) { - // // https://stackoverflow.com/questions/11258077/how-to-find-index-of-an-object-by-key-and-value-in-an-javascript-array - // let index = included.findIndex(p => p.id == img_src[j].id) - // let img = included[index] item.images.push({ title: img_src[j].meta.title, + // meta.imageDerivatives.style.href link is provided by drupal consumers_image_styles module url: img_src[j].meta.imageDerivatives.links.card_medium.href }) } items.push(item) } - console.log('items', items); - commit('setItems', items); + console.log('items', items) + commit('setItems', items) + if(state.infiniteState){ + if (state.offset + state.limit > state.count) { + console.log('Search infinite completed'); + // tell to vue-infinite-loading plugin that there si no new page + state.infiniteState.complete() + }else{ + console.log('Search infinite loaded'); + // tell to vue-infinite-loading plugin that newpage is loaded + state.infiniteState.loaded() + } + } } } }