@ppg_pl/pallete 2.0.3 → 2.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/dist/cjs/my-backdrop_8.cjs.entry.js +65 -41
  2. package/dist/cjs/my-backdrop_8.cjs.entry.js.map +1 -1
  3. package/dist/collection/components/api/index.js +4 -0
  4. package/dist/collection/components/api/index.js.map +1 -1
  5. package/dist/collection/components/my-colorinfo/my-colorinfo.js +13 -5
  6. package/dist/collection/components/my-colorinfo/my-colorinfo.js.map +1 -1
  7. package/dist/collection/components/my-modal/my-modal.css +23 -1
  8. package/dist/collection/components/my-modal/my-modal.js +0 -1
  9. package/dist/collection/components/my-modal/my-modal.js.map +1 -1
  10. package/dist/collection/types.js.map +1 -1
  11. package/dist/components/index2.js +4 -0
  12. package/dist/components/index2.js.map +1 -1
  13. package/dist/components/my-colorinfo2.js +12 -4
  14. package/dist/components/my-colorinfo2.js.map +1 -1
  15. package/dist/components/my-modal2.js +49 -37
  16. package/dist/components/my-modal2.js.map +1 -1
  17. package/dist/esm/my-backdrop_8.entry.js +65 -41
  18. package/dist/esm/my-backdrop_8.entry.js.map +1 -1
  19. package/dist/pallete/p-ee5f61e8.entry.js +2 -0
  20. package/dist/pallete/p-ee5f61e8.entry.js.map +1 -0
  21. package/dist/pallete/pallete.esm.js +1 -1
  22. package/dist/types/components/my-colorinfo/my-colorinfo.d.ts +1 -0
  23. package/dist/types/types.d.ts +2 -0
  24. package/package.json +1 -1
  25. package/www/build/p-7c1b28aa.css +1 -0
  26. package/www/build/p-e8e99831.js +2 -0
  27. package/www/build/p-ee5f61e8.entry.js +2 -0
  28. package/www/build/p-ee5f61e8.entry.js.map +1 -0
  29. package/www/build/pallete.esm.js +1 -1
  30. package/www/index.html +1 -1
  31. package/dist/pallete/p-037cfde2.entry.js +0 -2
  32. package/dist/pallete/p-037cfde2.entry.js.map +0 -1
  33. package/www/build/p-037cfde2.entry.js +0 -2
  34. package/www/build/p-037cfde2.entry.js.map +0 -1
@@ -58,6 +58,10 @@ const MyColorBox = class {
58
58
  };
59
59
  MyColorBox.style = myColorboxCss;
60
60
 
61
+ // DEV/
62
+ // export const APIURL = 'http://57.128.200.45:8055';
63
+ // export const accessToken = '_baZ127gfvFIFmZ5umrrTBUUm6D7ve6p';
64
+ // PROD
61
65
  const APIURL = 'http://147.135.211.144:8055'; //'https://pallete-colors-backend.herokuapp.com';
62
66
  const accessToken = 'uBKzhiNM4rkdZSe_PQvKJp9pE-DSTmtu';
63
67
  class API {
@@ -97,6 +101,15 @@ const MyColorInfo = class {
97
101
  this.onCloseButtonClick = () => {
98
102
  this.closeInfoBox.emit();
99
103
  };
104
+ this.renderSliderOrImage = () => {
105
+ var _a;
106
+ if (this.currentColor.imageInsteadHex) {
107
+ return h("img", { class: 'color-big-image', src: `${APIURL}/assets/${this.currentColor.bigImage}?access_token=${accessToken}`, alt: "color-image" });
108
+ }
109
+ else {
110
+ return h("my-slider", { color: this.currentColor.name, shop: this.shop, product: this.product, slides: (_a = this.data) === null || _a === void 0 ? void 0 : _a.images });
111
+ }
112
+ };
100
113
  this.currentColor = undefined;
101
114
  this.shop = undefined;
102
115
  this.product = undefined;
@@ -106,14 +119,13 @@ const MyColorInfo = class {
106
119
  this.closeImage = 'close.png';
107
120
  }
108
121
  render() {
109
- var _a, _b, _c, _d, _e, _f;
110
- console.log('current', this.currentColor);
122
+ var _a, _b, _c, _d, _e;
111
123
  return (h("div", { class: `boxes__box-content ${this.currentColor.textWhite ? 'boxes__box-content__white' : ''}`, style: {
112
- background: this.currentColor.hex,
124
+ background: this.currentColor.imageInsteadHex ? 'white' : this.currentColor.hex,
113
125
  maxWidth: `${this.infoBoxWidth && this.infoBoxWidth - 4}px`,
114
126
  } }, this.isMobile && h("img", { class: 'closebtn', onClick: this.onCloseButtonClick, src: getAssetPath(`./assets/${this.closeImage}`), alt: "closebtn" }), h("div", { class: "boxes__box-content__info", style: {
115
127
  maxWidth: this.isMobile ? `${this.infoBoxWidth && this.infoBoxWidth - 35}px` : ``,
116
- } }, !this.isMobile && h("img", { class: 'closebtn', onClick: this.onCloseButtonClick, src: getAssetPath(`./assets/${this.closeImage}`), alt: "closebtn" }), !this.isMobile && h("h2", null, this.currentColor.name), !this.isMobile && h("h4", null, this.currentColor.number), !this.isMobile && h("div", { class: "divider" }), h("div", { class: "boxes__box-content__info__value" }, h("div", { class: "boxes__box-content__info__value-image" }, ((_a = this.currentColor) === null || _a === void 0 ? void 0 : _a.image) && h("img", { src: `${APIURL}/assets/${this.currentColor.image}?access_token=${accessToken}`, alt: "color-image" })), h("div", { class: "boxes__box-content__info__value-product" }, h("div", null, !this.isMobile && h("p", null, "Produkt:"), this.isMobile && h("h2", null, (_b = this.currentColor) === null || _b === void 0 ? void 0 : _b.name), " ", h("p", null, this.product)), this.isMobile && h("div", { class: 'divider' }), this.currentColor && ((_c = this.currentColor.links) === null || _c === void 0 ? void 0 : _c.find((link) => (link === null || link === void 0 ? void 0 : link.shop) === this.shop)) && (h("a", { onClick: this.goToProduct, class: `${this.currentColor.buttonInverse ? 'inverse' : ''}`, target: "_blank", href: (_e = (_d = this === null || this === void 0 ? void 0 : this.currentColor.links) === null || _d === void 0 ? void 0 : _d.find((link) => (link === null || link === void 0 ? void 0 : link.shop) === this.shop)) === null || _e === void 0 ? void 0 : _e.path }, "przejd\u017A do produktu"))))), h("div", { class: "boxes__box-content__slider" }, h("my-slider", { color: this.currentColor.name, shop: this.shop, product: this.product, slides: (_f = this.data) === null || _f === void 0 ? void 0 : _f.images }), ' ')));
128
+ } }, !this.isMobile && h("img", { class: 'closebtn', onClick: this.onCloseButtonClick, src: getAssetPath(`./assets/${this.closeImage}`), alt: "closebtn" }), !this.isMobile && h("h2", null, this.currentColor.name), !this.isMobile && h("h4", null, this.currentColor.number), !this.isMobile && h("div", { class: "divider" }), h("div", { class: "boxes__box-content__info__value" }, h("div", { class: "boxes__box-content__info__value-image" }, ((_a = this.currentColor) === null || _a === void 0 ? void 0 : _a.image) && h("img", { src: `${APIURL}/assets/${this.currentColor.image}?access_token=${accessToken}`, alt: "color-image" })), h("div", { class: "boxes__box-content__info__value-product" }, h("div", null, !this.isMobile && h("p", null, "Produkt:"), this.isMobile && h("h2", null, (_b = this.currentColor) === null || _b === void 0 ? void 0 : _b.name), " ", h("p", null, this.product)), this.isMobile && h("div", { class: 'divider' }), this.currentColor && ((_c = this.currentColor.links) === null || _c === void 0 ? void 0 : _c.find((link) => (link === null || link === void 0 ? void 0 : link.shop) === this.shop)) && (h("a", { onClick: this.goToProduct, class: `${this.currentColor.imageInsteadHex ? 'brown' : this.currentColor.buttonInverse ? 'inverse' : ''}`, target: "_blank", href: (_e = (_d = this === null || this === void 0 ? void 0 : this.currentColor.links) === null || _d === void 0 ? void 0 : _d.find((link) => (link === null || link === void 0 ? void 0 : link.shop) === this.shop)) === null || _e === void 0 ? void 0 : _e.path }, "przejd\u017A do produktu"))))), h("div", { class: "boxes__box-content__slider" }, this.renderSliderOrImage())));
117
129
  }
118
130
  };
119
131
 
@@ -1817,6 +1829,10 @@ var decode = function (str, decoder, charset) {
1817
1829
  }
1818
1830
  };
1819
1831
 
1832
+ var limit$1 = 1024;
1833
+
1834
+ /* eslint operator-linebreak: [2, "before"] */
1835
+
1820
1836
  var encode = function encode(str, defaultEncoder, charset, kind, format) {
1821
1837
  // This code was originally written by Brian White (mscdex) for the io.js core querystring library.
1822
1838
  // It has been adapted here for stricter adherence to RFC 3986
@@ -1838,45 +1854,54 @@ var encode = function encode(str, defaultEncoder, charset, kind, format) {
1838
1854
  }
1839
1855
 
1840
1856
  var out = '';
1841
- for (var i = 0; i < string.length; ++i) {
1842
- var c = string.charCodeAt(i);
1843
-
1844
- if (
1845
- c === 0x2D // -
1846
- || c === 0x2E // .
1847
- || c === 0x5F // _
1848
- || c === 0x7E // ~
1849
- || (c >= 0x30 && c <= 0x39) // 0-9
1850
- || (c >= 0x41 && c <= 0x5A) // a-z
1851
- || (c >= 0x61 && c <= 0x7A) // A-Z
1852
- || (format === formats.RFC1738 && (c === 0x28 || c === 0x29)) // ( )
1853
- ) {
1854
- out += string.charAt(i);
1855
- continue;
1856
- }
1857
+ for (var j = 0; j < string.length; j += limit$1) {
1858
+ var segment = string.length >= limit$1 ? string.slice(j, j + limit$1) : string;
1859
+ var arr = [];
1860
+
1861
+ for (var i = 0; i < segment.length; ++i) {
1862
+ var c = segment.charCodeAt(i);
1863
+ if (
1864
+ c === 0x2D // -
1865
+ || c === 0x2E // .
1866
+ || c === 0x5F // _
1867
+ || c === 0x7E // ~
1868
+ || (c >= 0x30 && c <= 0x39) // 0-9
1869
+ || (c >= 0x41 && c <= 0x5A) // a-z
1870
+ || (c >= 0x61 && c <= 0x7A) // A-Z
1871
+ || (format === formats.RFC1738 && (c === 0x28 || c === 0x29)) // ( )
1872
+ ) {
1873
+ arr[arr.length] = segment.charAt(i);
1874
+ continue;
1875
+ }
1857
1876
 
1858
- if (c < 0x80) {
1859
- out = out + hexTable[c];
1860
- continue;
1861
- }
1877
+ if (c < 0x80) {
1878
+ arr[arr.length] = hexTable[c];
1879
+ continue;
1880
+ }
1862
1881
 
1863
- if (c < 0x800) {
1864
- out = out + (hexTable[0xC0 | (c >> 6)] + hexTable[0x80 | (c & 0x3F)]);
1865
- continue;
1866
- }
1882
+ if (c < 0x800) {
1883
+ arr[arr.length] = hexTable[0xC0 | (c >> 6)]
1884
+ + hexTable[0x80 | (c & 0x3F)];
1885
+ continue;
1886
+ }
1867
1887
 
1868
- if (c < 0xD800 || c >= 0xE000) {
1869
- out = out + (hexTable[0xE0 | (c >> 12)] + hexTable[0x80 | ((c >> 6) & 0x3F)] + hexTable[0x80 | (c & 0x3F)]);
1870
- continue;
1888
+ if (c < 0xD800 || c >= 0xE000) {
1889
+ arr[arr.length] = hexTable[0xE0 | (c >> 12)]
1890
+ + hexTable[0x80 | ((c >> 6) & 0x3F)]
1891
+ + hexTable[0x80 | (c & 0x3F)];
1892
+ continue;
1893
+ }
1894
+
1895
+ i += 1;
1896
+ c = 0x10000 + (((c & 0x3FF) << 10) | (segment.charCodeAt(i) & 0x3FF));
1897
+
1898
+ arr[arr.length] = hexTable[0xF0 | (c >> 18)]
1899
+ + hexTable[0x80 | ((c >> 12) & 0x3F)]
1900
+ + hexTable[0x80 | ((c >> 6) & 0x3F)]
1901
+ + hexTable[0x80 | (c & 0x3F)];
1871
1902
  }
1872
1903
 
1873
- i += 1;
1874
- c = 0x10000 + (((c & 0x3FF) << 10) | (string.charCodeAt(i) & 0x3FF));
1875
- /* eslint operator-linebreak: [2, "before"] */
1876
- out += hexTable[0xF0 | (c >> 18)]
1877
- + hexTable[0x80 | ((c >> 12) & 0x3F)]
1878
- + hexTable[0x80 | ((c >> 6) & 0x3F)]
1879
- + hexTable[0x80 | (c & 0x3F)];
1904
+ out += arr.join('');
1880
1905
  }
1881
1906
 
1882
1907
  return out;
@@ -2305,7 +2330,7 @@ var defaults$1 = {
2305
2330
  charset: 'utf-8',
2306
2331
  charsetSentinel: false,
2307
2332
  comma: false,
2308
- decodeDotInKeys: true,
2333
+ decodeDotInKeys: false,
2309
2334
  decoder: utils.decode,
2310
2335
  delimiter: '&',
2311
2336
  depth: 5,
@@ -2632,7 +2657,7 @@ const fetchColorByNumber = (id, colorNumber) => lib.stringify({
2632
2657
  encodeValuesOnly: true,
2633
2658
  });
2634
2659
 
2635
- const myModalCss = ".pallete-wrapper *{font-family:\"Galatea\", sans-serif}.my-modal{box-shadow:1px 1px 1px #ccc;background-color:#fff;position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);max-width:1555px;width:90%;z-index:1000;text-align:center;padding:35px 40px;max-height:calc(100vh - 100px);overflow-y:auto}@media (max-width: 1024px){.my-modal{padding:80px 20px 20px}}.my-modal::-webkit-scrollbar{display:none}.my-modal .loader{display:flex;flex-direction:column;align-items:center;justify-content:center;height:300px}.my-modal>img{width:300px;object-fit:cover}@media (max-width: 768px){.my-modal>img{width:200px}}.my-modal__close{position:absolute;right:20px;top:20px;background:transparent;border:none}.my-modal__close>img{width:45px;height:45px;object-fit:cover;cursor:pointer}@media (max-width: 1024px){.my-modal__close{top:65px}}.my-modal__see-more{font-size:22px;margin-bottom:27px;display:flex;justify-content:center;align-items:center}@media (max-width: 1024px){.my-modal__see-more{font-size:18px}}.my-modal__see-more img{width:45px;height:45px}@media (max-width: 1024px){.my-modal__see-more img{display:none}}.my-modal__wrapper{display:flex;flex-direction:column;position:relative}.my-modal__wrapper .boxes{display:flex;flex-direction:column;flex-wrap:wrap}.my-modal__wrapper .boxes__list{display:flex;flex-wrap:wrap;gap:5px 5px}@media (max-width: 1024px){.my-modal__wrapper .boxes__list{justify-content:center}}.my-modal__wrapper .boxes__box-content{width:100%;margin-bottom:5px;height:500px;text-align:left;display:flex;flex-direction:row;justify-content:space-between;position:relative}.my-modal__wrapper .boxes__box-content .closebtn{position:absolute;right:10px;top:10px;width:53px;height:53px;cursor:pointer;object-fit:cover;z-index:9999}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content{flex-direction:column-reverse;height:auto}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content{margin:0 auto}}.my-modal__wrapper .boxes__box-content__info{width:40%;padding:50px 40px;position:relative}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info{width:100%;padding:15px;min-height:100px}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info{min-height:auto}}.my-modal__wrapper .boxes__box-content__info h2{font-size:35px;font-weight:normal;text-transform:capitalize;margin-bottom:7px;color:#232323}.my-modal__wrapper .boxes__box-content__info h4{margin-top:0px;margin-bottom:15px;font-size:16px;color:#4c4c4c}.my-modal__wrapper .boxes__box-content__info .divider{border:1px solid #4c4c4c;opacity:0.2;margin-bottom:20px}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info .divider{margin:10px 0px}}.my-modal__wrapper .boxes__box-content__info__value{display:flex;flex-direction:row;justify-content:flex-start}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value{justify-content:flex-start}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value{flex-direction:column}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-image{margin:0 auto;margin-bottom:10px}}.my-modal__wrapper .boxes__box-content__info__value-image img{width:114px;object-fit:cover}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-image img{width:75px}}.my-modal__wrapper .boxes__box-content__info__value-product{color:#232323;margin-left:10px}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-product h2{font-size:26px;margin:0;margin-right:10px}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-product h2{font-size:16px}}.my-modal__wrapper .boxes__box-content__info__value-product p{font-size:20px;margin-top:0px;margin-bottom:0px}.my-modal__wrapper .boxes__box-content__info__value-product p:last-of-type{margin-bottom:20px}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-product p:last-of-type{margin-bottom:0}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-product p{font-size:10px}}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-product>div{display:flex;justify-content:flex-start;align-items:center}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-product>div{flex-direction:column}}.my-modal__wrapper .boxes__box-content__slider{width:60%;position:relative}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__slider{width:100%;display:block}}.my-modal__wrapper .boxes__box-content__white *{color:#fff}.my-modal__wrapper .boxes__box-content__white h2{color:#fff}.my-modal__wrapper .pagination{margin:10px 0px;font-size:16px;display:flex;flex-direction:row;align-items:center;justify-content:center}.my-modal__wrapper .pagination>span{margin:0 3px;cursor:pointer;min-width:20px;padding:5px;box-shadow:1px 1px 1px #ccc}.my-modal__wrapper .pagination .current{background-color:wheat}.my-modal .categories{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid #dfdfdf;display:flex;flex-direction:column;align-items:flex-start}.my-modal .categories__container{display:flex;flex-wrap:nowrap;gap:5px 5px;overflow-x:auto;width:100%}@media (max-width: 1024px){.my-modal .categories__container{padding-bottom:5px}}.my-modal .categories__slide-information{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.my-modal .categories__slide-information span{color:#4c4c4c;font-size:16px;font-weight:normal}.my-modal .categories__slide-information span:first-of-type{margin-left:7px}.my-modal .categories__slide-information span:last-of-type{margin-right:7px}.my-modal .button,.my-modal a{background-color:#fff;font-size:16px;box-shadow:0 10px 20px 0 rgba(0, 0, 0, 0.1);border-radius:22.5px;padding:15px 30px;color:#232323;text-decoration:none;display:block;text-align:center;transition:all 0.7s ease-in-out;border:none;cursor:pointer}.my-modal .button:hover,.my-modal a:hover{color:#fff;background-color:#232323}.my-modal .button.inverse,.my-modal a.inverse{background-color:#232323;color:#fff}.my-modal .button.inverse:hover,.my-modal a.inverse:hover{color:#232323;background-color:#fff}@media (max-width: 1024px){.my-modal .button,.my-modal a{max-width:150px;font-size:13px;padding:12px 25px}}@media (max-width: 768px){.my-modal .button,.my-modal a{margin:0 auto}}.my-modal>.button{margin:10px auto}";
2660
+ const myModalCss = ".pallete-wrapper *{font-family:\"Galatea\", sans-serif}.my-modal{box-shadow:1px 1px 1px #ccc;background-color:#fff;position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);max-width:1555px;width:90%;z-index:1000;text-align:center;padding:35px 40px;max-height:calc(100vh - 100px);overflow-y:auto}@media (max-width: 1024px){.my-modal{padding:80px 20px 20px}}.my-modal::-webkit-scrollbar{display:none}.my-modal .loader{display:flex;flex-direction:column;align-items:center;justify-content:center;height:300px}.my-modal>img{width:300px;object-fit:cover}@media (max-width: 768px){.my-modal>img{width:200px}}.my-modal__close{position:absolute;right:20px;top:20px;background:transparent;border:none}.my-modal__close>img{width:45px;height:45px;object-fit:cover;cursor:pointer}@media (max-width: 1024px){.my-modal__close{top:65px}}.my-modal__see-more{font-size:22px;margin-bottom:27px;display:flex;justify-content:center;align-items:center}@media (max-width: 1024px){.my-modal__see-more{font-size:18px}}.my-modal__see-more img{width:45px;height:45px}@media (max-width: 1024px){.my-modal__see-more img{display:none}}.my-modal__wrapper{display:flex;flex-direction:column;position:relative}.my-modal__wrapper .boxes{display:flex;flex-direction:column;flex-wrap:wrap}.my-modal__wrapper .boxes__list{display:flex;flex-wrap:wrap;gap:5px 5px}@media (max-width: 1024px){.my-modal__wrapper .boxes__list{justify-content:center}}.my-modal__wrapper .boxes__box-content{width:100%;margin-bottom:5px;height:500px;text-align:left;display:flex;flex-direction:row;justify-content:space-between;position:relative}.my-modal__wrapper .boxes__box-content .closebtn{position:absolute;right:10px;top:10px;width:53px;height:53px;cursor:pointer;object-fit:cover;z-index:9999}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content{flex-direction:column-reverse;height:auto}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content{margin:0 auto}}.my-modal__wrapper .boxes__box-content__info{width:40%;padding:50px 40px;position:relative}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info{width:100%;padding:15px;min-height:100px}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info{min-height:auto}}.my-modal__wrapper .boxes__box-content__info h2{font-size:35px;font-weight:normal;text-transform:capitalize;margin-bottom:7px;color:#232323}.my-modal__wrapper .boxes__box-content__info h4{margin-top:0px;margin-bottom:15px;font-size:16px;color:#4c4c4c}.my-modal__wrapper .boxes__box-content__info .divider{border:1px solid #4c4c4c;opacity:0.2;margin-bottom:20px}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info .divider{margin:10px 0px}}.my-modal__wrapper .boxes__box-content__info__value{display:flex;flex-direction:row;justify-content:flex-start}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value{justify-content:flex-start}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value{flex-direction:column}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-image{margin:0 auto;margin-bottom:10px}}.my-modal__wrapper .boxes__box-content__info__value-image img{width:114px;object-fit:cover}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-image img{width:75px}}.my-modal__wrapper .boxes__box-content__info__value-product{color:#232323;margin-left:10px}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-product h2{font-size:26px;margin:0;margin-right:10px}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-product h2{font-size:16px}}.my-modal__wrapper .boxes__box-content__info__value-product p{font-size:20px;margin-top:0px;margin-bottom:0px}.my-modal__wrapper .boxes__box-content__info__value-product p:last-of-type{margin-bottom:20px}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-product p:last-of-type{margin-bottom:0}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-product p{font-size:10px}}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__info__value-product>div{display:flex;justify-content:flex-start;align-items:center}}@media (max-width: 768px){.my-modal__wrapper .boxes__box-content__info__value-product>div{flex-direction:column}}.my-modal__wrapper .boxes__box-content__slider{width:60%;min-width:60%;max-width:60%;position:relative}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__slider{width:100%;display:block}}.my-modal__wrapper .boxes__box-content__slider .color-big-image{width:100%;height:100%;object-fit:cover}@media (max-width: 1024px){.my-modal__wrapper .boxes__box-content__slider .color-big-image{height:300px}}.my-modal__wrapper .boxes__box-content__white *{color:#fff}.my-modal__wrapper .boxes__box-content__white h2{color:#fff}.my-modal__wrapper .pagination{margin:10px 0px;font-size:16px;display:flex;flex-direction:row;align-items:center;justify-content:center}.my-modal__wrapper .pagination>span{margin:0 3px;cursor:pointer;min-width:20px;padding:5px;box-shadow:1px 1px 1px #ccc}.my-modal__wrapper .pagination .current{background-color:wheat}.my-modal .categories{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid #dfdfdf;display:flex;flex-direction:column;align-items:flex-start}.my-modal .categories__container{display:flex;flex-wrap:nowrap;gap:5px 5px;overflow-x:auto;width:100%}@media (max-width: 1024px){.my-modal .categories__container{padding-bottom:5px}}.my-modal .categories__slide-information{display:flex;flex-direction:row;align-items:center;justify-content:space-between}.my-modal .categories__slide-information span{color:#4c4c4c;font-size:16px;font-weight:normal}.my-modal .categories__slide-information span:first-of-type{margin-left:7px}.my-modal .categories__slide-information span:last-of-type{margin-right:7px}.my-modal .button,.my-modal a{background-color:#fff;font-size:16px;box-shadow:0 10px 20px 0 rgba(0, 0, 0, 0.1);border-radius:22.5px;padding:12px 30px;color:#232323;text-decoration:none;display:block;text-align:center;transition:all 0.7s ease-in-out;border:none;cursor:pointer}.my-modal .button:hover,.my-modal a:hover{color:#fff;background-color:#232323}.my-modal .button.brown,.my-modal a.brown{background-color:#3c2114;color:#fff}.my-modal .button.brown:hover,.my-modal a.brown:hover{color:#fff;background-color:#232323}.my-modal .button.inverse,.my-modal a.inverse{background-color:#232323;color:#fff}.my-modal .button.inverse:hover,.my-modal a.inverse:hover{color:#232323;background-color:#fff}@media (max-width: 1024px){.my-modal .button,.my-modal a{max-width:150px;font-size:13px;padding:12px 25px}}@media (max-width: 768px){.my-modal .button,.my-modal a{margin:0 auto}}.my-modal>.button{margin:10px auto}";
2636
2661
 
2637
2662
  const MyModal = class {
2638
2663
  constructor(hostRef) {
@@ -2869,7 +2894,6 @@ const MyModal = class {
2869
2894
  }
2870
2895
  render() {
2871
2896
  var _a, _b, _c, _d;
2872
- console.log(this.colors);
2873
2897
  return (h("div", { class: `my-modal`, onMouseEnter: () => this.handleReadyToClose(false), onMouseLeave: () => this.handleReadyToClose(true) }, this.preloader && (h("div", { class: 'loader' }, h("my-loader", null))), !this.preloader && (h("button", { class: "my-modal__close", onClick: () => this.closeModalHandler() }, h("img", { src: getAssetPath(`./assets/${this.closeImage}`), alt: "closebtn" }))), !this.preloader && this.data && this.data.modalLogo && h("img", { src: `${APIURL}/assets/${(_a = this.data) === null || _a === void 0 ? void 0 : _a.modalLogo}?access_token=${accessToken}`, alt: "modal-logo" }), !this.preloader && this.data && (h("p", { class: "my-modal__see-more" }, (_b = this.data) === null || _b === void 0 ? void 0 : _b.modalDescription)), this.showRange && (h("div", { class: 'categories' }, this.data && h("my-search", { productId: Number((_c = this.data) === null || _c === void 0 ? void 0 : _c.id), isMobile: this.isMobile }), h("div", { class: 'categories__container', style: { maxWidth: `${this.infoBoxWidth}px` } }, (_d = this.data) === null || _d === void 0 ? void 0 : _d.Category.map((c) => (h("my-colorbox", { key: c.id, onClick: () => this.handleCategoryClick(c.Category_id.id), color: c.Category_id.hex, name: c.Category_id.category_name, shop: this.shop, product: this.product, isCategoryActive: this.selectedCategory === c.Category_id.id })))), this.isMobile && (h("div", { class: 'categories__slide-information', style: { width: `${this.infoBoxWidth}px` } }, h("span", null, "Przewi\u0144 w lewo"), h("span", null, "Przewi\u0144 w prawo"))))), h("div", { class: 'my-modal__wrapper' }, this.loading && h("my-loader", null), !this.loading && this.colors && (h("div", { class: 'container_boxes' }, this.colors.list.length > 0 ? (this.chunks(this.colors.list).map((color, index) => {
2874
2898
  var _a;
2875
2899
  return (h("div", { key: index, class: "boxes" }, h("div", { class: "boxes__list" }, color.map((c) => {