hemfixarna-web-components 1.7.1 → 1.7.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/hemfixarna-address_15.cjs.entry.js +55 -47
- package/dist/cjs/hemfixarna-address_15.cjs.entry.js.map +1 -1
- package/dist/cjs/hemfixarna-category.cjs.entry.js +1 -1
- package/dist/cjs/hemfixarna-components.cjs.js +1 -1
- package/dist/cjs/hemfixarna-service.cjs.entry.js +1 -1
- package/dist/cjs/{index-4695c475.js → index-6af772cf.js} +8 -1
- package/dist/cjs/index-6af772cf.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/hemfixarna-checkout/hemfixarna-checkout.js +12 -37
- package/dist/collection/components/hemfixarna-checkout/hemfixarna-checkout.js.map +1 -1
- package/dist/collection/components/hemfixarna-component/hemfixarna-component.js +52 -6
- package/dist/collection/components/hemfixarna-component/hemfixarna-component.js.map +1 -1
- package/dist/collection/components/hemfixarna-component/hemfixarna.css +20 -0
- package/dist/collection/components/hemfixarna-contact/hemfixarna-contact.js +6 -1
- package/dist/collection/components/hemfixarna-contact/hemfixarna-contact.js.map +1 -1
- package/dist/collection/store/index.js +7 -0
- package/dist/collection/store/index.js.map +1 -1
- package/dist/esm/hemfixarna-address_15.entry.js +55 -47
- package/dist/esm/hemfixarna-address_15.entry.js.map +1 -1
- package/dist/esm/hemfixarna-category.entry.js +1 -1
- package/dist/esm/hemfixarna-components.js +1 -1
- package/dist/esm/hemfixarna-service.entry.js +1 -1
- package/dist/esm/{index-113a6b21.js → index-8282f88e.js} +8 -1
- package/dist/esm/index-8282f88e.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/hemfixarna-components/hemfixarna-components.esm.js +1 -1
- package/dist/hemfixarna-components/hemfixarna-components.esm.js.map +1 -1
- package/dist/hemfixarna-components/p-8cc96dd9.entry.js +2 -0
- package/dist/hemfixarna-components/{p-a3d759d9.js → p-b397b966.js} +2 -2
- package/dist/hemfixarna-components/p-b397b966.js.map +1 -0
- package/dist/hemfixarna-components/{p-12dbf4e6.entry.js → p-e8800c3b.entry.js} +2 -2
- package/dist/hemfixarna-components/p-fb43b148.entry.js +2 -0
- package/dist/hemfixarna-components/p-fb43b148.entry.js.map +1 -0
- package/dist/types/components/hemfixarna-checkout/hemfixarna-checkout.d.ts +0 -4
- package/dist/types/components/hemfixarna-component/hemfixarna-component.d.ts +3 -0
- package/dist/types/components.d.ts +2 -0
- package/dist/types/store/index.d.ts +2 -0
- package/package.json +1 -1
- package/readme.md +1 -1
- package/dist/cjs/index-4695c475.js.map +0 -1
- package/dist/esm/index-113a6b21.js.map +0 -1
- package/dist/hemfixarna-components/p-7c122f15.entry.js +0 -2
- package/dist/hemfixarna-components/p-9df46508.entry.js +0 -2
- package/dist/hemfixarna-components/p-9df46508.entry.js.map +0 -1
- package/dist/hemfixarna-components/p-a3d759d9.js.map +0 -1
- /package/dist/hemfixarna-components/{p-7c122f15.entry.js.map → p-8cc96dd9.entry.js.map} +0 -0
- /package/dist/hemfixarna-components/{p-12dbf4e6.entry.js.map → p-e8800c3b.entry.js.map} +0 -0
|
@@ -114,6 +114,26 @@
|
|
|
114
114
|
/* Hide default HTML checkbox */
|
|
115
115
|
/* The slider */
|
|
116
116
|
}
|
|
117
|
+
:host .hemfixarna_source {
|
|
118
|
+
display: flex;
|
|
119
|
+
align-items: center;
|
|
120
|
+
justify-content: center;
|
|
121
|
+
cursor: pointer;
|
|
122
|
+
}
|
|
123
|
+
:host .hemfixarna_source img {
|
|
124
|
+
width: 20px;
|
|
125
|
+
}
|
|
126
|
+
:host .hemfixarna_source--pw {
|
|
127
|
+
max-width: 300px !important;
|
|
128
|
+
}
|
|
129
|
+
:host .hemfixarna_source--pw input[type=password] {
|
|
130
|
+
padding: 0.5rem;
|
|
131
|
+
}
|
|
132
|
+
:host .hemfixarna_source--pw form {
|
|
133
|
+
display: flex;
|
|
134
|
+
flex-direction: column;
|
|
135
|
+
gap: 1rem;
|
|
136
|
+
}
|
|
117
137
|
:host .hemfixarna_contact {
|
|
118
138
|
display: flex;
|
|
119
139
|
gap: 16px;
|
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
import { h } from '@stencil/core';
|
|
2
|
+
import state from '../../store';
|
|
2
3
|
export class HemfixarnaInfo {
|
|
3
4
|
constructor() {
|
|
4
5
|
this.vertical = false;
|
|
5
6
|
}
|
|
6
7
|
render() {
|
|
7
|
-
return (h("div", { class: `hemfixarna_contact ${this.vertical ? 'hemfixarna_contact--vertical' : 'hemfixarna_contact--horizontal'}` },
|
|
8
|
+
return (h("div", { class: `hemfixarna_contact ${this.vertical ? 'hemfixarna_contact--vertical' : 'hemfixarna_contact--horizontal'}` }, state.customer.source ? (h("div", { onClick: () => {
|
|
9
|
+
if (!state.selectSource) {
|
|
10
|
+
state.showSourcePasswordPrompt = true;
|
|
11
|
+
}
|
|
12
|
+
}, class: "hemfixarna_source" }, state.selectSource ? (h("svg", { viewBox: "0 0 1024 1024", fill: "#C84E18", height: "1em", width: "1em" }, h("path", { d: "M832 464H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v68c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-68c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0z" }))) : (h("svg", { viewBox: "0 0 1024 1024", fill: "#C84E18", height: "1em", width: "1em" }, h("path", { d: "M832 464h-68V240c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0zm152-237H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v224z" }))))) : null, h("a", { href: "tel:0770-220 720" }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M7 4V20H17V4H7ZM6 2H18C18.5523 2 19 2.44772 19 3V21C19 21.5523 18.5523 22 18 22H6C5.44772 22 5 21.5523 5 21V3C5 2.44772 5.44772 2 6 2ZM12 17C12.5523 17 13 17.4477 13 18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18C11 17.4477 11.4477 17 12 17Z", fill: "#C84E18" })), h("span", null, "0770-220 720")), h("a", { href: "https://hemfixarna.se/kundservice/", target: "_blank" }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { "clip-path": "url(#clip0_1001_894)" }, h("path", { d: "M21 12.22C21 6.73 16.74 3 12 3C7.31 3 3 6.65 3 12.28C2.4 12.62 2 13.26 2 14V16C2 17.1 2.9 18 4 18H5V11.9C5 8.03 8.13 4.9 12 4.9C15.87 4.9 19 8.03 19 11.9V19H11V21H19C20.1 21 21 20.1 21 19V17.78C21.59 17.47 22 16.86 22 16.14V13.84C22 13.14 21.59 12.53 21 12.22Z", fill: "#C84E18" }), h("path", { d: "M9 14C9.55228 14 10 13.5523 10 13C10 12.4477 9.55228 12 9 12C8.44772 12 8 12.4477 8 13C8 13.5523 8.44772 14 9 14Z", fill: "#C84E18" }), h("path", { d: "M15 14C15.5523 14 16 13.5523 16 13C16 12.4477 15.5523 12 15 12C14.4477 12 14 12.4477 14 13C14 13.5523 14.4477 14 15 14Z", fill: "#C84E18" }), h("path", { d: "M18 11.03C17.52 8.18 15.04 6 12.05 6C9.01997 6 5.75997 8.51 6.01997 12.45C8.48997 11.44 10.35 9.24 10.88 6.56C12.19 9.19 14.88 11 18 11.03Z", fill: "#C84E18" })), h("defs", null, h("clipPath", { id: "clip0_1001_894" }, h("rect", { width: "24", height: "24", fill: "white" })))), h("span", null, "Kundservice"))));
|
|
8
13
|
}
|
|
9
14
|
static get is() { return "hemfixarna-contact"; }
|
|
10
15
|
static get properties() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hemfixarna-contact.js","sourceRoot":"","sources":["../../../src/components/hemfixarna-contact/hemfixarna-contact.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"hemfixarna-contact.js","sourceRoot":"","sources":["../../../src/components/hemfixarna-contact/hemfixarna-contact.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,KAAK,MAAM,aAAa,CAAC;AAMhC,MAAM,OAAO,cAAc;;oBACI,KAAK;;EAElC,MAAM;IACJ,OAAO,CACL,WAAK,KAAK,EAAE,sBAAsB,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,8BAA8B,CAAC,CAAC,CAAC,gCAAgC,EAAE;MAClH,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CACvB,WACE,OAAO,EAAE,GAAG,EAAE;UACZ,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE;YACvB,KAAK,CAAC,wBAAwB,GAAG,IAAI,CAAC;WACvC;QACH,CAAC,EACD,KAAK,EAAC,mBAAmB,IAExB,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CACpB,WAAK,OAAO,EAAC,eAAe,EAAC,IAAI,EAAC,SAAS,EAAC,MAAM,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK;QAClE,YAAM,CAAC,EAAC,mVAAmV,GAAG,CAC1V,CACP,CAAC,CAAC,CAAC,CACF,WAAK,OAAO,EAAC,eAAe,EAAC,IAAI,EAAC,SAAS,EAAC,MAAM,EAAC,KAAK,EAAC,KAAK,EAAC,KAAK;QAClE,YAAM,CAAC,EAAC,8TAA8T,GAAG,CACrU,CACP,CACG,CACP,CAAC,CAAC,CAAC,IAAI;MACR,SAAG,IAAI,EAAC,kBAAkB;QACxB,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;UAC5F,YACE,CAAC,EAAC,+PAA+P,EACjQ,IAAI,EAAC,SAAS,GACd,CACE;QACN,+BAAyB,CACvB;MACJ,SAAG,IAAI,EAAC,oCAAoC,EAAC,MAAM,EAAC,QAAQ;QAC1D,WAAK,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAC,4BAA4B;UAC5F,sBAAa,sBAAsB;YACjC,YACE,CAAC,EAAC,sQAAsQ,EACxQ,IAAI,EAAC,SAAS,GACd;YACF,YAAM,CAAC,EAAC,mHAAmH,EAAC,IAAI,EAAC,SAAS,GAAG;YAC7I,YAAM,CAAC,EAAC,yHAAyH,EAAC,IAAI,EAAC,SAAS,GAAG;YACnJ,YACE,CAAC,EAAC,6IAA6I,EAC/I,IAAI,EAAC,SAAS,GACd,CACA;UACJ;YACE,gBAAU,EAAE,EAAC,gBAAgB;cAC3B,YAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,GAAG,CACnC,CACN,CACH;QACN,8BAAwB,CACtB,CACA,CACP,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h } from '@stencil/core';\nimport state from '../../store';\n\n@Component({\n tag: 'hemfixarna-contact',\n shadow: false,\n})\nexport class HemfixarnaInfo {\n @Prop() vertical?: boolean = false;\n\n render() {\n return (\n <div class={`hemfixarna_contact ${this.vertical ? 'hemfixarna_contact--vertical' : 'hemfixarna_contact--horizontal'}`}>\n {state.customer.source ? (\n <div\n onClick={() => {\n if (!state.selectSource) {\n state.showSourcePasswordPrompt = true;\n }\n }}\n class=\"hemfixarna_source\"\n >\n {state.selectSource ? (\n <svg viewBox=\"0 0 1024 1024\" fill=\"#C84E18\" height=\"1em\" width=\"1em\">\n <path d=\"M832 464H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v68c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-68c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0z\" />\n </svg>\n ) : (\n <svg viewBox=\"0 0 1024 1024\" fill=\"#C84E18\" height=\"1em\" width=\"1em\">\n <path d=\"M832 464h-68V240c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0zm152-237H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v224z\" />\n </svg>\n )}\n </div>\n ) : null}\n <a href=\"tel:0770-220 720\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path\n d=\"M7 4V20H17V4H7ZM6 2H18C18.5523 2 19 2.44772 19 3V21C19 21.5523 18.5523 22 18 22H6C5.44772 22 5 21.5523 5 21V3C5 2.44772 5.44772 2 6 2ZM12 17C12.5523 17 13 17.4477 13 18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18C11 17.4477 11.4477 17 12 17Z\"\n fill=\"#C84E18\"\n />\n </svg>\n <span>0770-220 720</span>\n </a>\n <a href=\"https://hemfixarna.se/kundservice/\" target=\"_blank\">\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <g clip-path=\"url(#clip0_1001_894)\">\n <path\n d=\"M21 12.22C21 6.73 16.74 3 12 3C7.31 3 3 6.65 3 12.28C2.4 12.62 2 13.26 2 14V16C2 17.1 2.9 18 4 18H5V11.9C5 8.03 8.13 4.9 12 4.9C15.87 4.9 19 8.03 19 11.9V19H11V21H19C20.1 21 21 20.1 21 19V17.78C21.59 17.47 22 16.86 22 16.14V13.84C22 13.14 21.59 12.53 21 12.22Z\"\n fill=\"#C84E18\"\n />\n <path d=\"M9 14C9.55228 14 10 13.5523 10 13C10 12.4477 9.55228 12 9 12C8.44772 12 8 12.4477 8 13C8 13.5523 8.44772 14 9 14Z\" fill=\"#C84E18\" />\n <path d=\"M15 14C15.5523 14 16 13.5523 16 13C16 12.4477 15.5523 12 15 12C14.4477 12 14 12.4477 14 13C14 13.5523 14.4477 14 15 14Z\" fill=\"#C84E18\" />\n <path\n d=\"M18 11.03C17.52 8.18 15.04 6 12.05 6C9.01997 6 5.75997 8.51 6.01997 12.45C8.48997 11.44 10.35 9.24 10.88 6.56C12.19 9.19 14.88 11 18 11.03Z\"\n fill=\"#C84E18\"\n />\n </g>\n <defs>\n <clipPath id=\"clip0_1001_894\">\n <rect width=\"24\" height=\"24\" fill=\"white\" />\n </clipPath>\n </defs>\n </svg>\n <span>Kundservice</span>\n </a>\n </div>\n );\n }\n}\n"]}
|
|
@@ -25,6 +25,8 @@ const { state, onChange, } = createStore({
|
|
|
25
25
|
checkoutInvoice: false,
|
|
26
26
|
maleri: false,
|
|
27
27
|
sources: null,
|
|
28
|
+
selectSource: false,
|
|
29
|
+
showSourcePasswordPrompt: false,
|
|
28
30
|
});
|
|
29
31
|
onChange('cart', cart => {
|
|
30
32
|
window.sessionStorage.setItem(`hemfixarna-${state.business}-cart`, JSON.stringify(cart));
|
|
@@ -35,6 +37,11 @@ onChange('user', user => {
|
|
|
35
37
|
onChange('creditSafeUser', user => {
|
|
36
38
|
window.sessionStorage.setItem(`hemfixarna-${state.business}-creditSafeUser`, JSON.stringify(user));
|
|
37
39
|
});
|
|
40
|
+
onChange('selectSource', selectSource => {
|
|
41
|
+
if (selectSource) {
|
|
42
|
+
localStorage.setItem('select_source', 'true');
|
|
43
|
+
}
|
|
44
|
+
});
|
|
38
45
|
onChange('selectedProduct', product => {
|
|
39
46
|
if (!state.customer || !product)
|
|
40
47
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/store/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/store/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAqC7C,MAAM,EACJ,KAAK,EACL,QAAQ,GACT,GAGG,WAAW,CAAC;EACd,IAAI,EAAE,CAAC;EACP,YAAY,EAAE,CAAC;EACf,YAAY,EAAE,KAAK;EACnB,gBAAgB,EAAE,IAAI;EACtB,eAAe,EAAE,IAAI;EACrB,eAAe,EAAE,IAAI;EACrB,IAAI,EAAE,EAAE;EACR,QAAQ,EAAE,WAAW;EACrB,OAAO,EAAE,IAAI;EACb,GAAG,EAAE,IAAI;EACT,GAAG,EAAE,IAAI;EACT,KAAK,EAAE,IAAI;EACX,KAAK,EAAE,IAAI;EACX,IAAI,EAAE,IAAI;EACV,KAAK,EAAE,IAAI;EACX,UAAU,EAAE,IAAI;EAChB,UAAU,EAAE,IAAI;EAChB,YAAY,EAAE,IAAI;EAClB,QAAQ,EAAE,IAAI;EACd,wBAAwB,EAAE,IAAI;EAC9B,cAAc,EAAE,IAAI;EACpB,cAAc,EAAE,IAAI;EACpB,eAAe,EAAE,KAAK;EACtB,MAAM,EAAE,KAAK;EACb,OAAO,EAAE,IAAI;EACb,YAAY,EAAE,KAAK;EACnB,wBAAwB,EAAE,KAAK;CAChC,CAAC,CAAC;AAEH,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE;EACtB,MAAM,CAAC,cAAc,CAAC,OAAO,CAAC,cAAc,KAAK,CAAC,QAAQ,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;AAC3F,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE;EACtB,MAAM,CAAC,cAAc,CAAC,OAAO,CAAC,cAAc,KAAK,CAAC,QAAQ,OAAO,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;AAC3F,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,gBAAgB,EAAE,IAAI,CAAC,EAAE;EAChC,MAAM,CAAC,cAAc,CAAC,OAAO,CAAC,cAAc,KAAK,CAAC,QAAQ,iBAAiB,EAAE,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;AACrG,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,cAAc,EAAE,YAAY,CAAC,EAAE;EACtC,IAAI,YAAY,EAAE;IAChB,YAAY,CAAC,OAAO,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;GAC/C;AACH,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAC,EAAE;EACpC,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,OAAO;IAAE,OAAO;EACxC,MAAM,UAAU,GAAG,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,UAAU,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,WAAC,OAAA,MAAA,CAAC,CAAC,cAAc,mCAAI,EAAE,CAAA,EAAA,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;EACxH,MAAM,QAAQ,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,OAAO,CAAC,QAAQ,CAAC,CAAC;EACtE,IAAI,QAAQ,EAAE;IACZ,KAAK,CAAC,cAAc,GAAG,QAAQ,CAAC;IAChC,OAAO;GACR;EACD,KAAK,CAAC,cAAc,GAAG,IAAI,CAAC;AAC9B,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,0BAA0B,EAAE,QAAQ,CAAC,EAAE;EAC9C,IAAI,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,QAAQ;IAAE,OAAO;EACzC,IAAK,QAAgC,CAAC,MAAM,EAAE;IAC5C,MAAM,MAAM,GAAG,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAM,QAAgC,CAAC,MAAM,CAAC,CAAC;IACtG,IAAI,MAAM,EAAE;MACV,KAAK,CAAC,cAAc,GAAG,MAAM,CAAC;MAC9B,OAAO;KACR;GACF;EACD,KAAK,CAAC,cAAc,GAAG,IAAI,CAAC;AAC9B,CAAC,CAAC,CAAC;AAEH,eAAe,KAAK,CAAC","sourcesContent":["import { createStore } from '@stencil/store';\nimport { OnChangeHandler } from '@stencil/store/dist/types';\nimport { Business, CartItem, Category, Customer, CustomerCategory, CustomerSubCategory, GreenOptions, Product, RotOptions, RutOptions, Service, User, WpOptions } from '../types';\nimport { CreditSafeUser } from '../types/felixtypes';\n\ntype StateType = {\n step: number;\n selectedCategory: Category | null;\n selectedService: Service | null;\n selectedProduct: Product | null;\n cart: Array<CartItem>;\n business: Business | 'undefined';\n options: WpOptions | null;\n rut: boolean;\n rot: boolean;\n green: boolean;\n token: string | null;\n checkoutStep: number;\n checkoutEdit: boolean;\n user: User | null;\n creditSafeUser: CreditSafeUser | null;\n modal: {\n title?: string;\n text: string[];\n } | null;\n rutOptions: RutOptions | null;\n rotOptions: RotOptions | null;\n greenOptions: GreenOptions | null;\n customer: Customer | null;\n selectedCustomerCategory: CustomerCategory | CustomerSubCategory | null;\n parentCategory: CustomerCategory | CustomerSubCategory;\n checkoutInvoice: boolean;\n maleri: boolean;\n selectSource: boolean;\n showSourcePasswordPrompt: boolean;\n};\n\nconst {\n state,\n onChange,\n}: {\n state: StateType;\n onChange: OnChangeHandler<StateType>;\n} = createStore({\n step: 1,\n checkoutStep: 1,\n checkoutEdit: false,\n selectedCategory: null,\n selectedService: null,\n selectedProduct: null,\n cart: [],\n business: 'undefined',\n options: null,\n rut: true,\n rot: true,\n green: true,\n token: null,\n user: null,\n modal: null,\n rutOptions: null,\n rotOptions: null,\n greenOptions: null,\n customer: null,\n selectedCustomerCategory: null,\n parentCategory: null,\n creditSafeUser: null,\n checkoutInvoice: false,\n maleri: false,\n sources: null,\n selectSource: false,\n showSourcePasswordPrompt: false,\n});\n\nonChange('cart', cart => {\n window.sessionStorage.setItem(`hemfixarna-${state.business}-cart`, JSON.stringify(cart));\n});\n\nonChange('user', user => {\n window.sessionStorage.setItem(`hemfixarna-${state.business}-user`, JSON.stringify(user));\n});\n\nonChange('creditSafeUser', user => {\n window.sessionStorage.setItem(`hemfixarna-${state.business}-creditSafeUser`, JSON.stringify(user));\n});\n\nonChange('selectSource', selectSource => {\n if (selectSource) {\n localStorage.setItem('select_source', 'true');\n }\n});\n\nonChange('selectedProduct', product => {\n if (!state.customer || !product) return;\n const categories = [...state.customer.categories, ...state.customer.categories.map(c => c.sub_categories ?? [])].flat();\n const category = categories.find(c => c && c.id === product.category);\n if (category) {\n state.parentCategory = category;\n return;\n }\n state.parentCategory = null;\n});\n\nonChange('selectedCustomerCategory', category => {\n if (!state.customer || !category) return;\n if ((category as CustomerSubCategory).parent) {\n const parent = state.customer.categories.find(c => c.id === (category as CustomerSubCategory).parent);\n if (parent) {\n state.parentCategory = parent;\n return;\n }\n }\n state.parentCategory = null;\n});\n\nexport default state;\n"]}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { r as registerInstance, h, g as getElement, F as Fragment, a as getAssetPath } from './index-04bcf90e.js';
|
|
2
|
-
import { s as state } from './index-
|
|
2
|
+
import { s as state } from './index-8282f88e.js';
|
|
3
3
|
import { B as Business, W as WidgetStyle } from './index-1fbc7a74.js';
|
|
4
4
|
|
|
5
5
|
const hideField = (field) => {
|
|
@@ -317,8 +317,8 @@ const getDefaultApiUrl = () => {
|
|
|
317
317
|
}
|
|
318
318
|
};
|
|
319
319
|
const getApiUrl = () => {
|
|
320
|
-
if (typeof process !== 'undefined' && process.env &&
|
|
321
|
-
return
|
|
320
|
+
if (typeof process !== 'undefined' && process.env && "http://hemfixare.test") {
|
|
321
|
+
return "http://hemfixare.test";
|
|
322
322
|
}
|
|
323
323
|
return getDefaultApiUrl();
|
|
324
324
|
};
|
|
@@ -331,8 +331,8 @@ const getDefaultCreditSafeApiUrl = () => {
|
|
|
331
331
|
}
|
|
332
332
|
};
|
|
333
333
|
const getCreditSafeApiUrl = () => {
|
|
334
|
-
if (typeof process !== 'undefined' && process.env &&
|
|
335
|
-
return
|
|
334
|
+
if (typeof process !== 'undefined' && process.env && "https://hemfixare-lookup-dev.vercel.app/api") {
|
|
335
|
+
return "https://hemfixare-lookup-dev.vercel.app/api";
|
|
336
336
|
}
|
|
337
337
|
return getDefaultCreditSafeApiUrl();
|
|
338
338
|
};
|
|
@@ -513,6 +513,7 @@ const HemfixarnaCheckout = class {
|
|
|
513
513
|
this.loading = false;
|
|
514
514
|
};
|
|
515
515
|
this.handleSubmit = (e) => {
|
|
516
|
+
var _a;
|
|
516
517
|
e.preventDefault();
|
|
517
518
|
this.generalError = null;
|
|
518
519
|
const validDate = this.date.length > 0;
|
|
@@ -524,34 +525,20 @@ const HemfixarnaCheckout = class {
|
|
|
524
525
|
if (notValidTerms) {
|
|
525
526
|
this.generalError = 'Du måste godkänna villkoren';
|
|
526
527
|
}
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
528
|
+
if (state.customer.source && state.selectSource) {
|
|
529
|
+
if (!this.sellerID) {
|
|
530
|
+
this.generalError = 'Ange säljare';
|
|
531
|
+
return;
|
|
532
|
+
}
|
|
533
|
+
if (((_a = state.customer.source.sub_sources) === null || _a === void 0 ? void 0 : _a.length) && !this.selectedSubSource) {
|
|
534
|
+
this.generalError = 'Välj underkälla';
|
|
535
|
+
return;
|
|
536
|
+
}
|
|
537
|
+
}
|
|
537
538
|
if (validDate && !notValidTerms) {
|
|
538
539
|
this.sendOrder();
|
|
539
540
|
}
|
|
540
541
|
};
|
|
541
|
-
this.handleKeyDown = (event) => {
|
|
542
|
-
this.enteredPin += event.key;
|
|
543
|
-
const correctPin = '+0033';
|
|
544
|
-
if (this.enteredPin.length === correctPin.length) {
|
|
545
|
-
if (this.enteredPin === correctPin) {
|
|
546
|
-
localStorage.setItem('show_sources', 'true');
|
|
547
|
-
this.showSources = true;
|
|
548
|
-
window.removeEventListener('keydown', this.handleKeyDown);
|
|
549
|
-
}
|
|
550
|
-
this.enteredPin = '';
|
|
551
|
-
}
|
|
552
|
-
clearTimeout(this.pinTimeout);
|
|
553
|
-
this.pinTimeout = setTimeout(() => (this.enteredPin = ''), 5000);
|
|
554
|
-
};
|
|
555
542
|
this.render = () => {
|
|
556
543
|
var _a;
|
|
557
544
|
const dateLogo = getAssetPath(`./assets/date.svg`);
|
|
@@ -564,7 +551,7 @@ const HemfixarnaCheckout = class {
|
|
|
564
551
|
return h("hemfixarna-getuser", null);
|
|
565
552
|
}
|
|
566
553
|
else if (state.checkoutStep === 2) {
|
|
567
|
-
return (h("div", { class: "mb-2" }, h("div", { class: "hemfixarna_addressinfo" }, h("div", null, h("p", null, hideField(state.user.firstName)), h("p", null, hideField(state.user.lastName)), h("p", null, state.user.email), h("p", null, state.user.phone)), h("div", null, h("p", null, hideField(state.user.street)), h("p", null, hideField(state.user.zip)), h("p", null, hideField(state.user.town))), h("button", { onClick: () => (state.checkoutEdit = true) }, "Beh\u00F6ver du \u00E4ndra adressen?")), h("form", { onSubmit: e => this.handleSubmit(e) }, h("div", null, h("img", { src: dateLogo, width: 24 }), h("input", { class: `${this.date.length ? 'input_active' : ''}`, min: new Date().toISOString().split('T')[0], onChange: e => this.handleChangeDate(e), type: "date", name: "date", value: this.date }), h("label", { htmlFor: "date" }, "Tidigaste datum f\u00F6r hembes\u00F6k"), h("img", { src: down, width: 24 })), this.dateError && h("span", null, this.dateError), state.customer.source &&
|
|
554
|
+
return (h("div", { class: "mb-2" }, h("div", { class: "hemfixarna_addressinfo" }, h("div", null, h("p", null, hideField(state.user.firstName)), h("p", null, hideField(state.user.lastName)), h("p", null, state.user.email), h("p", null, state.user.phone)), h("div", null, h("p", null, hideField(state.user.street)), h("p", null, hideField(state.user.zip)), h("p", null, hideField(state.user.town))), h("button", { onClick: () => (state.checkoutEdit = true) }, "Beh\u00F6ver du \u00E4ndra adressen?")), h("form", { onSubmit: e => this.handleSubmit(e) }, h("div", null, h("img", { src: dateLogo, width: 24 }), h("input", { class: `${this.date.length ? 'input_active' : ''}`, min: new Date().toISOString().split('T')[0], onChange: e => this.handleChangeDate(e), type: "date", name: "date", value: this.date }), h("label", { htmlFor: "date" }, "Tidigaste datum f\u00F6r hembes\u00F6k"), h("img", { src: down, width: 24 })), this.dateError && h("span", null, this.dateError), state.customer.source && state.selectSource ? (h(Fragment, null, h("p", null, "Inloggad som:", h("strong", null, " ", state.customer.source.fieldData.So01_Name)), h("label", null, "S\u00E4ljare (S\u00E4ljarId)", h("input", { type: "text", value: this.sellerID, onChange: e => (this.sellerID = e.target.value) })), h("label", null, "PartnerOrderID (RefferalID)", h("input", { type: "text", value: this.RefferalID, onChange: e => (this.RefferalID = e.target.value) })), ((_a = state.customer.source.sub_sources) === null || _a === void 0 ? void 0 : _a.length) ? (h("div", null, h("select", { onChange: e => (this.selectedSubSource = e.target.value) }, h("option", { disabled: true, selected: true, value: "null" }, "V\u00E4lj underk\u00E4lla"), state.customer.source.sub_sources.map(sub => (h("option", { value: sub['So_SubSource::_id'] }, sub['So_SubSource::Sus01_Name'])))))) : (h("p", null, "Det finns inga underk\u00E4llor att v\u00E4lja")))) : null, h("label", { class: "hemfixarna_checkbox" }, h("input", { onChange: () => this.handleChangeTerms(), type: "checkbox" }), h("span", { innerHTML: state.options.terms })), state.cart
|
|
568
555
|
.filter(i => { var _a; return (_a = i.terms_checkout) === null || _a === void 0 ? void 0 : _a.length; })
|
|
569
556
|
.map(item => (h(Fragment, null, h("label", { class: "hemfixarna_checkbox" }, h("input", { onChange: () => this.handleChangeTerms(), type: "checkbox" }), h("span", null, item.terms_checkout))))), this.generalError && h("span", null, this.generalError), h("div", { class: this.loading ? 'loading' : '' }, h("input", { type: "submit", value: this.loading ? '' : 'Skicka bokning' }), h("img", { width: 20, height: 20, src: loading, alt: "spinner" })))));
|
|
570
557
|
}
|
|
@@ -576,7 +563,6 @@ const HemfixarnaCheckout = class {
|
|
|
576
563
|
this.enteredPin = '';
|
|
577
564
|
this.selectedSubSource = null;
|
|
578
565
|
this.partnerOrderId = null;
|
|
579
|
-
this.showSources = false;
|
|
580
566
|
this.sellerID = null;
|
|
581
567
|
this.RefferalID = null;
|
|
582
568
|
}
|
|
@@ -584,21 +570,11 @@ const HemfixarnaCheckout = class {
|
|
|
584
570
|
if (Boolean(state.user && state.user.street)) {
|
|
585
571
|
state.checkoutStep = 2;
|
|
586
572
|
}
|
|
587
|
-
if (state.customer && state.customer.source) {
|
|
588
|
-
window.addEventListener('keydown', this.handleKeyDown);
|
|
589
|
-
}
|
|
590
|
-
const showSources = localStorage.getItem('show_sources');
|
|
591
|
-
if (showSources) {
|
|
592
|
-
this.showSources = true;
|
|
593
|
-
}
|
|
594
|
-
}
|
|
595
|
-
disconnectedCallback() {
|
|
596
|
-
window.removeEventListener('keydown', this.handleKeyDown);
|
|
597
573
|
}
|
|
598
574
|
get el() { return getElement(this); }
|
|
599
575
|
};
|
|
600
576
|
|
|
601
|
-
const hemfixarnaCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap\");\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n* {\n box-sizing: border-box;\n}\n\n:host {\n font-family: \"Inter\", sans-serif;\n}\n:host input[type=text] {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host .mb-2 {\n margin-bottom: 32px;\n}\n:host button {\n color: #474444;\n}\n:host form {\n display: flex;\n flex-direction: column;\n gap: 16px;\n position: relative;\n}\n:host form button {\n position: absolute;\n right: 0;\n top: -1rem;\n}\n:host form img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n pointer-events: none;\n}\n:host form img:first-of-type {\n left: 16px;\n}\n:host form img:last-of-type {\n right: 16px;\n}\n:host form span {\n margin-top: -8px;\n color: #ec6632;\n}\n:host form p {\n text-align: center;\n}\n:host form p {\n margin: 0;\n}\n:host form div {\n position: relative;\n}\n:host form div label {\n pointer-events: none;\n position: absolute;\n left: 16px;\n top: 50%;\n transform: translateY(-50%);\n background: #fff;\n padding: 4px;\n transition: 0.2s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host form div input {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host form div input:focus ~ label,\n:host form div .input_active ~ label {\n top: 0;\n transform: translateY(-50%);\n background: linear-gradient(180deg, #fffaf2 50%, #fff 50%);\n}\n:host form select {\n padding: 0.75rem 1rem;\n width: 100%;\n}\n:host h1 {\n font-size: 24px;\n font-weight: 400;\n line-height: 32px;\n letter-spacing: -3%;\n text-align: left;\n margin: 0 0 8px;\n}\n:host h2 {\n margin: 0 0 24px;\n font-weight: 700;\n font-size: 20px;\n line-height: 28px;\n letter-spacing: -3%;\n}\n:host p {\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna {\n width: 100%;\n /* Hide default HTML checkbox */\n /* The slider */\n}\n:host .hemfixarna_contact {\n display: flex;\n gap: 16px;\n}\n:host .hemfixarna_contact a {\n display: flex;\n align-items: center;\n gap: 8px;\n color: #474444;\n text-decoration: none;\n font-weight: 600;\n font-size: 13px;\n}\n:host .hemfixarna_contact a:hover {\n text-decoration: underline;\n}\n:host .hemfixarna_contact--horizontal span {\n display: none;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_contact--horizontal span {\n display: initial;\n }\n}\n:host .hemfixarna_painting {\n opacity: 0;\n padding: 0 1rem;\n animation: fadeIn 0.5s forwards 0.3s;\n}\n:host .hemfixarna_painting > h2,\n:host .hemfixarna_painting p {\n text-align: center;\n padding: 0 16px;\n}\n:host .hemfixarna_painting > h2 {\n margin: 0 0 8px;\n}\n:host .hemfixarna_partnerlogo {\n max-height: 50px;\n min-height: 45px;\n object-fit: contain;\n max-width: 150px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_partnerlogo {\n max-width: 200px;\n }\n}\n:host .hemfixarna_nav {\n position: absolute;\n top: 0;\n width: 100dvw;\n left: 0;\n height: 80px;\n z-index: 9999;\n}\n:host .hemfixarna_nav--links {\n display: none !important;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav--links {\n display: flex !important;\n }\n}\n:host .hemfixarna_nav--links a {\n color: #ec6632;\n text-decoration: none;\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 56px;\n padding: 8px 32px;\n text-transform: capitalize;\n}\n:host .hemfixarna_nav > div {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 16px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav > div {\n padding: 0 32px;\n }\n}\n:host .hemfixarna_nav > div > div {\n display: flex;\n gap: 32px;\n justify-content: space-between;\n}\n:host .hemfixarna_nav > div > img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: -1;\n}\n:host .hemfixarna_nav a {\n text-decoration: none;\n}\n:host .hemfixarna_nav p {\n color: #474444;\n}\n:host .hemfixarna_nav p.with-bg {\n color: #fff;\n}\n:host .hemfixarna_standalone .hemfixarna_backdrop {\n background: #fffaf2;\n opacity: 1;\n}\n:host .hemfixarna_standalone .hemfixarna_modal {\n top: 80px;\n transform: translateX(-50%);\n border: none;\n height: calc(100dvh - 80px);\n opacity: 0;\n}\n:host .hemfixarna_standalone .hemfixarna_modal--open {\n opacity: 1;\n}\n:host .hemfixarna .switch {\n position: relative;\n display: inline-block;\n width: 40px;\n height: 20px;\n}\n:host .hemfixarna .switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n:host .hemfixarna .slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #ccc;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 34px;\n}\n:host .hemfixarna .slider:before {\n position: absolute;\n content: \"\";\n height: 18px;\n width: 18px;\n left: 2px;\n bottom: 1px;\n background-color: white;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 50%;\n}\n:host .hemfixarna input:checked + .slider {\n background-color: #fcd9c9;\n}\n:host .hemfixarna input:focus + .slider {\n box-shadow: 0 0 1px #fcd9c9;\n}\n:host .hemfixarna input:checked + .slider:before {\n -webkit-transform: translateX(18px);\n -ms-transform: translateX(18px);\n transform: translateX(18px);\n background: #ec6632;\n}\n:host .hemfixarna_maleribox {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n width: 100%;\n min-height: 132px;\n padding: 24px;\n display: flex;\n align-items: center;\n gap: 24px;\n text-align: left;\n}\n:host .hemfixarna_maleribox:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_checkbox {\n display: grid;\n grid-template-columns: 40px auto;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna_checkbox > span {\n transform: translateY(6px);\n}\n:host .hemfixarna_checkbox span,\n:host .hemfixarna_checkbox span p {\n color: #474444;\n font-size: 14px;\n}\n:host .hemfixarna_checkbox p {\n text-align: left;\n}\n:host .hemfixarna_info {\n display: flex;\n flex-direction: column;\n gap: 24px;\n padding: 32px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n border-radius: 4px;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_info h2 {\n margin: 0;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_info {\n position: sticky;\n top: 0;\n }\n}\n:host .hemfixarna_infomodal {\n position: absolute;\n top: 40%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 100%;\n max-width: 80%;\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n padding: 32px;\n z-index: 99;\n border-radius: 4px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n flex-direction: column;\n gap: 16px;\n}\n:host .hemfixarna_infomodal p,\n:host .hemfixarna_infomodal h4 {\n margin: 0;\n}\n:host .hemfixarna_infomodal button {\n background: #ec6632;\n color: #fff;\n border-radius: 60px;\n font-size: 16px;\n padding: 8px 16px;\n}\n:host .hemfixarna_addressinfo {\n padding: 16px 16px 64px;\n border: 1px solid #fcd9c9;\n position: relative;\n margin-bottom: 32px;\n display: grid;\n grid-template-columns: 1fr;\n gap: 8px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_addressinfo {\n grid-template-columns: 1fr 1fr;\n }\n}\n:host .hemfixarna_addressinfo button {\n position: absolute;\n bottom: 16px;\n right: 16px;\n font-weight: 500;\n text-underline-offset: 2px;\n text-decoration: underline;\n}\n:host .hemfixarna_part {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: grid;\n padding: 16px;\n grid-template-columns: auto 75px;\n}\n:host .hemfixarna_counter {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_counter span {\n padding: 0 8px;\n}\n:host .hemfixarna_counter img {\n cursor: pointer;\n}\n:host .hemfixarna_counter img:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_description {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_description ul {\n list-style: disc;\n padding-right: 12px;\n transform: translateX(12px);\n}\n:host .hemfixarna_description--hidden {\n max-height: 140px;\n overflow: hidden;\n position: relative;\n cursor: pointer;\n}\n:host .hemfixarna_description--hidden::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 128px;\n background: linear-gradient(180deg, rgba(255, 253, 250, 0), rgba(255, 253, 250, 0.46) 50%, #fffaf2);\n}\n:host .hemfixarna_terms {\n font-size: 14px;\n}\n:host .hemfixarna_terms a {\n color: inherit;\n}\n:host .hemfixarna_logo {\n height: 64px;\n}\n:host .hemfixarna_box {\n padding: 16px;\n display: flex;\n align-items: center;\n width: 100%;\n box-sizing: border-box;\n border-radius: 4px;\n gap: 16px 8px;\n border-radius: 4px;\n gap: 16px 8px;\n}\n:host .hemfixarna_box p,\n:host .hemfixarna_box span {\n font-size: 15px;\n}\n:host .hemfixarna_box .underline {\n text-decoration: underline;\n text-underline-offset: 2px;\n}\n:host .hemfixarna_box .pointer {\n cursor: pointer;\n}\n:host .hemfixarna_box .p-s {\n font-size: 12px;\n}\n:host .hemfixarna_box > div {\n display: grid;\n gap: 8px;\n}\n:host .hemfixarna_box--standard {\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_box--alternative, :host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n background: transparent;\n border: 1px solid #e3e3e3;\n}\n:host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.0784313725);\n}\n:host .hemfixarna_box--alternative_3 {\n justify-content: center;\n}\n:host .hemfixarna_altbtn {\n display: flex !important;\n flex-direction: column;\n gap: 8px;\n align-items: center;\n margin-left: auto;\n}\n:host .hemfixarna_btn {\n margin-left: auto;\n}\n:host .hemfixarna_btn, :host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n border: none;\n border-radius: 60px;\n font-weight: 600;\n letter-spacing: 0.5px;\n line-height: 20px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_btn:not(.disabled):hover, :host .hemfixarna_buy:not(.disabled):hover,\n:host .hemfixarna input[type=submit]:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna div:has(> input[type=submit]) {\n position: relative;\n}\n:host .hemfixarna div:has(> input[type=submit]) input {\n cursor: pointer;\n}\n:host .hemfixarna div:has(> input[type=submit]) img {\n display: none;\n}\n:host .hemfixarna .loading {\n cursor: default;\n opacity: 0.6;\n}\n:host .hemfixarna .loading > img {\n display: initial !important;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n:host .hemfixarna_btn {\n font-size: 14px;\n background: #c84e18;\n color: #fff;\n padding: 16px 24px;\n white-space: nowrap;\n position: relative;\n}\n:host .hemfixarna_btn span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_btn span {\n background: #25a710;\n color: #fff;\n right: 0 !important;\n}\n:host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n font-size: 21px;\n background: #25a710;\n color: #fff;\n padding: 16px 24px;\n}\n:host .hemfixarna .disabled {\n opacity: 0.5;\n cursor: default;\n}\n:host .hemfixarna_modal {\n position: fixed;\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n border-radius: 4px;\n top: 50%;\n left: 50%;\n z-index: 1000;\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n transform: translate(-50%, -50%) scale(0.7);\n opacity: 0;\n height: 92%;\n width: 92%;\n max-width: 920px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n:host .hemfixarna_modal--open {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n}\n:host .hemfixarna_backdrop {\n z-index: 999;\n position: fixed;\n background: #474444;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n opacity: 0;\n transition: transform 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946), opacity 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host .hemfixarna_backdrop--open {\n opacity: 0.3;\n}\n:host .hemfixarna_order {\n position: absolute;\n top: -1px;\n left: -1px;\n right: -1px;\n bottom: -1px;\n background-repeat: no-repeat !important;\n background-size: cover !important;\n background-position: center !important;\n display: grid;\n grid-template-columns: 1fr 1fr;\n padding: 48px 32px 64px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_order {\n grid-template-columns: 1fr;\n grid-template-rows: 0 auto;\n }\n}\n:host .hemfixarna_order > div:last-of-type {\n background: #fffaf2;\n padding: 32px;\n display: flex;\n flex-direction: column;\n max-height: 100%;\n overflow: auto;\n}\n:host .hemfixarna_order img {\n cursor: pointer;\n}\n:host .hemfixarna_order button {\n margin: 16px 0;\n padding: 0;\n text-decoration: underline;\n text-underline-offset: 2px;\n font-size: 14px;\n font-weight: 600;\n}\n:host .hemfixarna_cart {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart {\n grid-template-columns: 1fr;\n gap: 0;\n }\n}\n:host .hemfixarna_cart--right h2, :host .hemfixarna_cart--left h2 {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_cart--right h2 img, :host .hemfixarna_cart--left h2 img {\n margin-top: 3.2px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_cart--left h2 button {\n display: none;\n }\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart--right h2 button {\n display: none;\n }\n}\n:host .hemfixarna_cart--startfee {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot div {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_cart--additional {\n display: flex;\n flex-direction: column;\n gap: 16px;\n padding: 16px;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--additional p {\n font-size: 14px;\n}\n:host .hemfixarna_cart--additional strong {\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: pointer;\n position: relative;\n}\n:host .hemfixarna_cart--additional strong img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n right: -24px;\n}\n:host .hemfixarna_cart--price {\n border-top: 1px solid #fcd9c9;\n padding: 16px;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--price h3 {\n margin: 0;\n}\n:host .hemfixarna_cart--item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px 0;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--item span {\n font-size: 12px;\n}\n:host .hemfixarna_cart--item > div {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--item > div > div {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n:host .hemfixarna_cart--item > div button {\n color: #ec6632;\n}\n:host .hemfixarna_categories {\n display: flex;\n flex-direction: column;\n gap: 24px;\n}\n:host .hemfixarna_categories--wrapper {\n gap: 32px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_categories--wrapper {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_categories li {\n position: relative;\n background: #fff;\n border-radius: 4px;\n min-height: 132px;\n padding: 24px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n align-items: center;\n gap: 24px;\n cursor: pointer;\n}\n:host .hemfixarna_categories li:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_categories li > button {\n height: 100%;\n width: 100%;\n}\n:host .hemfixarna_categories li .price {\n font-weight: 700;\n}\n:host .hemfixarna_content {\n height: 100%;\n overflow: auto;\n padding: 0 32px 64px;\n}\n:host .hemfixarna_content--5 {\n padding-top: 16px;\n}\n:host .hemfixarna_content--painting {\n padding: 0;\n overflow: initial;\n}\n:host .hemfixarna_crumbs {\n position: relative;\n padding: 16px 24px;\n border-bottom: 1px solid #fcd9c9;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_crumbs--back {\n padding: 16px 24px 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs--back:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_crumbs img {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .close {\n position: absolute;\n right: -16px;\n top: -16px;\n z-index: 9;\n -webkit-transform: translate3d(0, 0, 0);\n}\n:host .hemfixarna_crumbs .cart {\n display: flex;\n padding-left: 16px;\n position: relative;\n}\n:host .hemfixarna_crumbs .cart img {\n cursor: inherit;\n}\n:host .hemfixarna_crumbs .cart span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_crumbs .cart_active {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .cart_active span {\n background: #25a710;\n color: #fff;\n}\n:host .hemfixarna_crumbs--links {\n display: flex;\n align-items: center;\n gap: 16px;\n overflow: auto;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_crumbs--links {\n -ms-overflow-style: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar {\n display: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar-button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs--right {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_crumbs button {\n white-space: nowrap;\n background: #f1ded6;\n border-radius: 64px;\n padding: 12px 16px;\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.3px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs button:not(.active):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n@media (max-width: 768px) {\n :host .hemfixarna_crumbs button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs .active {\n background: #fffaf2;\n cursor: default;\n}\n:host .hemfixarna_features {\n gap: 12px !important;\n}\n:host .hemfixarna_features li {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_address {\n margin-bottom: 16px;\n}\n:host .hemfixarna_product {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_product--link {\n font-weight: 700;\n color: #474444;\n text-underline-offset: 4px;\n}\n:host .hemfixarna_product--left {\n gap: 32px;\n}\n:host .hemfixarna_product--right {\n gap: 32px;\n}\n:host .hemfixarna_product--price {\n margin-top: 4px;\n font-weight: 700;\n}\n:host .hemfixarna_product--total {\n text-align: center;\n margin: -16px 0;\n font-size: 21px;\n line-height: 28px;\n}\n:host .hemfixarna_product--item {\n background: #fff;\n padding: 16px;\n display: grid;\n grid-template-columns: auto 75px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_product--grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--grid {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_product--grid > div {\n display: flex;\n flex-direction: column;\n}\n:host .hemfixarna_product--grid ul {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n:host .hemfixarna_product p {\n margin: 0;\n}\n:host .hemfixarna_product--top {\n display: flex;\n gap: 32px;\n}\n:host .hemfixarna_product--top img {\n object-fit: contain;\n}\n:host .hemfixarna_product--top > div {\n width: 100%;\n}\n:host .hemfixarna_product--top > div h1 {\n max-width: 80%;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--top > div h1 {\n max-width: 100%;\n }\n}\n:host .hemfixarna_product--top h4 {\n margin-bottom: 8px;\n}\n:host h5,\n:host p {\n margin: 0;\n}\n:host input[type=submit] {\n cursor: pointer;\n}\n:host input[type=date] ~ label {\n left: 56px;\n}\n:host input[type=date] {\n border: 1px solid #fcd9c9;\n padding-left: 64px;\n}\n:host input[type=checkbox] {\n height: 18px;\n width: 18px;\n border: 1px solid #fcd9c9;\n}\n:host input[type=checkbox]:checked {\n background: red;\n}\n:host input[type=date]::-webkit-calendar-picker-indicator {\n background: transparent;\n bottom: 0;\n color: transparent;\n cursor: pointer;\n height: auto;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n width: auto;\n}\n:host button,\n:host a {\n cursor: pointer;\n background: none;\n border: none;\n}\n:host ul {\n list-style: none;\n margin: 0;\n padding: 0;\n}";
|
|
577
|
+
const hemfixarnaCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap\");\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n* {\n box-sizing: border-box;\n}\n\n:host {\n font-family: \"Inter\", sans-serif;\n}\n:host input[type=text] {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host .mb-2 {\n margin-bottom: 32px;\n}\n:host button {\n color: #474444;\n}\n:host form {\n display: flex;\n flex-direction: column;\n gap: 16px;\n position: relative;\n}\n:host form button {\n position: absolute;\n right: 0;\n top: -1rem;\n}\n:host form img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n pointer-events: none;\n}\n:host form img:first-of-type {\n left: 16px;\n}\n:host form img:last-of-type {\n right: 16px;\n}\n:host form span {\n margin-top: -8px;\n color: #ec6632;\n}\n:host form p {\n text-align: center;\n}\n:host form p {\n margin: 0;\n}\n:host form div {\n position: relative;\n}\n:host form div label {\n pointer-events: none;\n position: absolute;\n left: 16px;\n top: 50%;\n transform: translateY(-50%);\n background: #fff;\n padding: 4px;\n transition: 0.2s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host form div input {\n padding: 16px;\n width: 100%;\n font-size: 16px;\n border: 1px solid #fcd9c9;\n}\n:host form div input:focus ~ label,\n:host form div .input_active ~ label {\n top: 0;\n transform: translateY(-50%);\n background: linear-gradient(180deg, #fffaf2 50%, #fff 50%);\n}\n:host form select {\n padding: 0.75rem 1rem;\n width: 100%;\n}\n:host h1 {\n font-size: 24px;\n font-weight: 400;\n line-height: 32px;\n letter-spacing: -3%;\n text-align: left;\n margin: 0 0 8px;\n}\n:host h2 {\n margin: 0 0 24px;\n font-weight: 700;\n font-size: 20px;\n line-height: 28px;\n letter-spacing: -3%;\n}\n:host p {\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna {\n width: 100%;\n /* Hide default HTML checkbox */\n /* The slider */\n}\n:host .hemfixarna_source {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n}\n:host .hemfixarna_source img {\n width: 20px;\n}\n:host .hemfixarna_source--pw {\n max-width: 300px !important;\n}\n:host .hemfixarna_source--pw input[type=password] {\n padding: 0.5rem;\n}\n:host .hemfixarna_source--pw form {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n:host .hemfixarna_contact {\n display: flex;\n gap: 16px;\n}\n:host .hemfixarna_contact a {\n display: flex;\n align-items: center;\n gap: 8px;\n color: #474444;\n text-decoration: none;\n font-weight: 600;\n font-size: 13px;\n}\n:host .hemfixarna_contact a:hover {\n text-decoration: underline;\n}\n:host .hemfixarna_contact--horizontal span {\n display: none;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_contact--horizontal span {\n display: initial;\n }\n}\n:host .hemfixarna_painting {\n opacity: 0;\n padding: 0 1rem;\n animation: fadeIn 0.5s forwards 0.3s;\n}\n:host .hemfixarna_painting > h2,\n:host .hemfixarna_painting p {\n text-align: center;\n padding: 0 16px;\n}\n:host .hemfixarna_painting > h2 {\n margin: 0 0 8px;\n}\n:host .hemfixarna_partnerlogo {\n max-height: 50px;\n min-height: 45px;\n object-fit: contain;\n max-width: 150px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_partnerlogo {\n max-width: 200px;\n }\n}\n:host .hemfixarna_nav {\n position: absolute;\n top: 0;\n width: 100dvw;\n left: 0;\n height: 80px;\n z-index: 9999;\n}\n:host .hemfixarna_nav--links {\n display: none !important;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav--links {\n display: flex !important;\n }\n}\n:host .hemfixarna_nav--links a {\n color: #ec6632;\n text-decoration: none;\n border: 1px solid rgba(255, 255, 255, 0.3);\n border-radius: 56px;\n padding: 8px 32px;\n text-transform: capitalize;\n}\n:host .hemfixarna_nav > div {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 0 16px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_nav > div {\n padding: 0 32px;\n }\n}\n:host .hemfixarna_nav > div > div {\n display: flex;\n gap: 32px;\n justify-content: space-between;\n}\n:host .hemfixarna_nav > div > img {\n position: absolute;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n z-index: -1;\n}\n:host .hemfixarna_nav a {\n text-decoration: none;\n}\n:host .hemfixarna_nav p {\n color: #474444;\n}\n:host .hemfixarna_nav p.with-bg {\n color: #fff;\n}\n:host .hemfixarna_standalone .hemfixarna_backdrop {\n background: #fffaf2;\n opacity: 1;\n}\n:host .hemfixarna_standalone .hemfixarna_modal {\n top: 80px;\n transform: translateX(-50%);\n border: none;\n height: calc(100dvh - 80px);\n opacity: 0;\n}\n:host .hemfixarna_standalone .hemfixarna_modal--open {\n opacity: 1;\n}\n:host .hemfixarna .switch {\n position: relative;\n display: inline-block;\n width: 40px;\n height: 20px;\n}\n:host .hemfixarna .switch input {\n opacity: 0;\n width: 0;\n height: 0;\n}\n:host .hemfixarna .slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-color: #ccc;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 34px;\n}\n:host .hemfixarna .slider:before {\n position: absolute;\n content: \"\";\n height: 18px;\n width: 18px;\n left: 2px;\n bottom: 1px;\n background-color: white;\n -webkit-transition: 0.4s;\n transition: 0.4s;\n border-radius: 50%;\n}\n:host .hemfixarna input:checked + .slider {\n background-color: #fcd9c9;\n}\n:host .hemfixarna input:focus + .slider {\n box-shadow: 0 0 1px #fcd9c9;\n}\n:host .hemfixarna input:checked + .slider:before {\n -webkit-transform: translateX(18px);\n -ms-transform: translateX(18px);\n transform: translateX(18px);\n background: #ec6632;\n}\n:host .hemfixarna_maleribox {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n width: 100%;\n min-height: 132px;\n padding: 24px;\n display: flex;\n align-items: center;\n gap: 24px;\n text-align: left;\n}\n:host .hemfixarna_maleribox:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_checkbox {\n display: grid;\n grid-template-columns: 40px auto;\n font-size: 16px;\n font-weight: 400;\n line-height: 24px;\n letter-spacing: -3%;\n}\n:host .hemfixarna_checkbox > span {\n transform: translateY(6px);\n}\n:host .hemfixarna_checkbox span,\n:host .hemfixarna_checkbox span p {\n color: #474444;\n font-size: 14px;\n}\n:host .hemfixarna_checkbox p {\n text-align: left;\n}\n:host .hemfixarna_info {\n display: flex;\n flex-direction: column;\n gap: 24px;\n padding: 32px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n border-radius: 4px;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_info h2 {\n margin: 0;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_info {\n position: sticky;\n top: 0;\n }\n}\n:host .hemfixarna_infomodal {\n position: absolute;\n top: 40%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: 100%;\n max-width: 80%;\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n padding: 32px;\n z-index: 99;\n border-radius: 4px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n flex-direction: column;\n gap: 16px;\n}\n:host .hemfixarna_infomodal p,\n:host .hemfixarna_infomodal h4 {\n margin: 0;\n}\n:host .hemfixarna_infomodal button {\n background: #ec6632;\n color: #fff;\n border-radius: 60px;\n font-size: 16px;\n padding: 8px 16px;\n}\n:host .hemfixarna_addressinfo {\n padding: 16px 16px 64px;\n border: 1px solid #fcd9c9;\n position: relative;\n margin-bottom: 32px;\n display: grid;\n grid-template-columns: 1fr;\n gap: 8px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_addressinfo {\n grid-template-columns: 1fr 1fr;\n }\n}\n:host .hemfixarna_addressinfo button {\n position: absolute;\n bottom: 16px;\n right: 16px;\n font-weight: 500;\n text-underline-offset: 2px;\n text-decoration: underline;\n}\n:host .hemfixarna_part {\n background: #fff;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: grid;\n padding: 16px;\n grid-template-columns: auto 75px;\n}\n:host .hemfixarna_counter {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_counter span {\n padding: 0 8px;\n}\n:host .hemfixarna_counter img {\n cursor: pointer;\n}\n:host .hemfixarna_counter img:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_description {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_description ul {\n list-style: disc;\n padding-right: 12px;\n transform: translateX(12px);\n}\n:host .hemfixarna_description--hidden {\n max-height: 140px;\n overflow: hidden;\n position: relative;\n cursor: pointer;\n}\n:host .hemfixarna_description--hidden::after {\n content: \"\";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 128px;\n background: linear-gradient(180deg, rgba(255, 253, 250, 0), rgba(255, 253, 250, 0.46) 50%, #fffaf2);\n}\n:host .hemfixarna_terms {\n font-size: 14px;\n}\n:host .hemfixarna_terms a {\n color: inherit;\n}\n:host .hemfixarna_logo {\n height: 64px;\n}\n:host .hemfixarna_box {\n padding: 16px;\n display: flex;\n align-items: center;\n width: 100%;\n box-sizing: border-box;\n border-radius: 4px;\n gap: 16px 8px;\n border-radius: 4px;\n gap: 16px 8px;\n}\n:host .hemfixarna_box p,\n:host .hemfixarna_box span {\n font-size: 15px;\n}\n:host .hemfixarna_box .underline {\n text-decoration: underline;\n text-underline-offset: 2px;\n}\n:host .hemfixarna_box .pointer {\n cursor: pointer;\n}\n:host .hemfixarna_box .p-s {\n font-size: 12px;\n}\n:host .hemfixarna_box > div {\n display: grid;\n gap: 8px;\n}\n:host .hemfixarna_box--standard {\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_box--alternative, :host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n background: transparent;\n border: 1px solid #e3e3e3;\n}\n:host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.0784313725);\n}\n:host .hemfixarna_box--alternative_3 {\n justify-content: center;\n}\n:host .hemfixarna_altbtn {\n display: flex !important;\n flex-direction: column;\n gap: 8px;\n align-items: center;\n margin-left: auto;\n}\n:host .hemfixarna_btn {\n margin-left: auto;\n}\n:host .hemfixarna_btn, :host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n border: none;\n border-radius: 60px;\n font-weight: 600;\n letter-spacing: 0.5px;\n line-height: 20px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_btn:not(.disabled):hover, :host .hemfixarna_buy:not(.disabled):hover,\n:host .hemfixarna input[type=submit]:not(.disabled):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna div:has(> input[type=submit]) {\n position: relative;\n}\n:host .hemfixarna div:has(> input[type=submit]) input {\n cursor: pointer;\n}\n:host .hemfixarna div:has(> input[type=submit]) img {\n display: none;\n}\n:host .hemfixarna .loading {\n cursor: default;\n opacity: 0.6;\n}\n:host .hemfixarna .loading > img {\n display: initial !important;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n}\n:host .hemfixarna_btn {\n font-size: 14px;\n background: #c84e18;\n color: #fff;\n padding: 16px 24px;\n white-space: nowrap;\n position: relative;\n}\n:host .hemfixarna_btn span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_btn span {\n background: #25a710;\n color: #fff;\n right: 0 !important;\n}\n:host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n font-size: 21px;\n background: #25a710;\n color: #fff;\n padding: 16px 24px;\n}\n:host .hemfixarna .disabled {\n opacity: 0.5;\n cursor: default;\n}\n:host .hemfixarna_modal {\n position: fixed;\n background: #fffaf2;\n border: 1px solid #fcd9c9;\n border-radius: 4px;\n top: 50%;\n left: 50%;\n z-index: 1000;\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n transform: translate(-50%, -50%) scale(0.7);\n opacity: 0;\n height: 92%;\n width: 92%;\n max-width: 920px;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n:host .hemfixarna_modal--open {\n opacity: 1;\n transform: translate(-50%, -50%) scale(1);\n}\n:host .hemfixarna_backdrop {\n z-index: 999;\n position: fixed;\n background: #474444;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n opacity: 0;\n transition: transform 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946), opacity 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host .hemfixarna_backdrop--open {\n opacity: 0.3;\n}\n:host .hemfixarna_order {\n position: absolute;\n top: -1px;\n left: -1px;\n right: -1px;\n bottom: -1px;\n background-repeat: no-repeat !important;\n background-size: cover !important;\n background-position: center !important;\n display: grid;\n grid-template-columns: 1fr 1fr;\n padding: 48px 32px 64px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_order {\n grid-template-columns: 1fr;\n grid-template-rows: 0 auto;\n }\n}\n:host .hemfixarna_order > div:last-of-type {\n background: #fffaf2;\n padding: 32px;\n display: flex;\n flex-direction: column;\n max-height: 100%;\n overflow: auto;\n}\n:host .hemfixarna_order img {\n cursor: pointer;\n}\n:host .hemfixarna_order button {\n margin: 16px 0;\n padding: 0;\n text-decoration: underline;\n text-underline-offset: 2px;\n font-size: 14px;\n font-weight: 600;\n}\n:host .hemfixarna_cart {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart {\n grid-template-columns: 1fr;\n gap: 0;\n }\n}\n:host .hemfixarna_cart--right h2, :host .hemfixarna_cart--left h2 {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_cart--right h2 img, :host .hemfixarna_cart--left h2 img {\n margin-top: 3.2px;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_cart--left h2 button {\n display: none;\n }\n}\n@media (max-width: 768px) {\n :host .hemfixarna_cart--right h2 button {\n display: none;\n }\n}\n:host .hemfixarna_cart--startfee {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot div {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_cart--additional {\n display: flex;\n flex-direction: column;\n gap: 16px;\n padding: 16px;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--additional p {\n font-size: 14px;\n}\n:host .hemfixarna_cart--additional strong {\n text-decoration: underline;\n text-underline-offset: 2px;\n cursor: pointer;\n position: relative;\n}\n:host .hemfixarna_cart--additional strong img {\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n right: -24px;\n}\n:host .hemfixarna_cart--price {\n border-top: 1px solid #fcd9c9;\n padding: 16px;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--price h3 {\n margin: 0;\n}\n:host .hemfixarna_cart--item {\n display: flex;\n flex-direction: column;\n gap: 8px;\n padding: 16px 0;\n border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--item span {\n font-size: 12px;\n}\n:host .hemfixarna_cart--item > div {\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_cart--item > div > div {\n display: flex;\n align-items: center;\n gap: 16px;\n}\n:host .hemfixarna_cart--item > div button {\n color: #ec6632;\n}\n:host .hemfixarna_categories {\n display: flex;\n flex-direction: column;\n gap: 24px;\n}\n:host .hemfixarna_categories--wrapper {\n gap: 32px;\n display: grid;\n grid-template-columns: 1fr 1fr;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_categories--wrapper {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_categories li {\n position: relative;\n background: #fff;\n border-radius: 4px;\n min-height: 132px;\n padding: 24px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n display: flex;\n align-items: center;\n gap: 24px;\n cursor: pointer;\n}\n:host .hemfixarna_categories li:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_categories li > button {\n height: 100%;\n width: 100%;\n}\n:host .hemfixarna_categories li .price {\n font-weight: 700;\n}\n:host .hemfixarna_content {\n height: 100%;\n overflow: auto;\n padding: 0 32px 64px;\n}\n:host .hemfixarna_content--5 {\n padding-top: 16px;\n}\n:host .hemfixarna_content--painting {\n padding: 0;\n overflow: initial;\n}\n:host .hemfixarna_crumbs {\n position: relative;\n padding: 16px 24px;\n border-bottom: 1px solid #fcd9c9;\n display: flex;\n justify-content: space-between;\n}\n:host .hemfixarna_crumbs--back {\n padding: 16px 24px 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs--back:hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_crumbs img {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .close {\n position: absolute;\n right: -16px;\n top: -16px;\n z-index: 9;\n -webkit-transform: translate3d(0, 0, 0);\n}\n:host .hemfixarna_crumbs .cart {\n display: flex;\n padding-left: 16px;\n position: relative;\n}\n:host .hemfixarna_crumbs .cart img {\n cursor: inherit;\n}\n:host .hemfixarna_crumbs .cart span {\n position: absolute;\n background: #fff;\n border-radius: 100%;\n width: 24px;\n height: 24px;\n display: flex;\n justify-content: center;\n align-items: center;\n font-weight: 600;\n font-size: 13px;\n line-height: 11px;\n top: -6px;\n right: -12px;\n}\n:host .hemfixarna_crumbs .cart_active {\n cursor: pointer;\n}\n:host .hemfixarna_crumbs .cart_active span {\n background: #25a710;\n color: #fff;\n}\n:host .hemfixarna_crumbs--links {\n display: flex;\n align-items: center;\n gap: 16px;\n overflow: auto;\n}\n@media (min-width: 769px) {\n :host .hemfixarna_crumbs--links {\n -ms-overflow-style: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar {\n display: none;\n }\n :host .hemfixarna_crumbs--links::-webkit-scrollbar-button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs--right {\n display: flex;\n align-items: center;\n}\n:host .hemfixarna_crumbs button {\n white-space: nowrap;\n background: #f1ded6;\n border-radius: 64px;\n padding: 12px 16px;\n font-size: 12px;\n font-weight: 600;\n letter-spacing: 0.3px;\n box-shadow: none !important;\n}\n:host .hemfixarna_crumbs button:not(.active):hover {\n transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n filter: brightness(1.02);\n transform: scale(1.01);\n box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n@media (max-width: 768px) {\n :host .hemfixarna_crumbs button {\n display: none;\n }\n}\n:host .hemfixarna_crumbs .active {\n background: #fffaf2;\n cursor: default;\n}\n:host .hemfixarna_features {\n gap: 12px !important;\n}\n:host .hemfixarna_features li {\n display: flex;\n gap: 16px;\n align-items: center;\n}\n:host .hemfixarna_address {\n margin-bottom: 16px;\n}\n:host .hemfixarna_product {\n display: grid;\n gap: 16px;\n}\n:host .hemfixarna_product--link {\n font-weight: 700;\n color: #474444;\n text-underline-offset: 4px;\n}\n:host .hemfixarna_product--left {\n gap: 32px;\n}\n:host .hemfixarna_product--right {\n gap: 32px;\n}\n:host .hemfixarna_product--price {\n margin-top: 4px;\n font-weight: 700;\n}\n:host .hemfixarna_product--total {\n text-align: center;\n margin: -16px 0;\n font-size: 21px;\n line-height: 28px;\n}\n:host .hemfixarna_product--item {\n background: #fff;\n padding: 16px;\n display: grid;\n grid-template-columns: auto 75px;\n box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_product--grid {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 32px;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--grid {\n grid-template-columns: 1fr;\n }\n}\n:host .hemfixarna_product--grid > div {\n display: flex;\n flex-direction: column;\n}\n:host .hemfixarna_product--grid ul {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n:host .hemfixarna_product p {\n margin: 0;\n}\n:host .hemfixarna_product--top {\n display: flex;\n gap: 32px;\n}\n:host .hemfixarna_product--top img {\n object-fit: contain;\n}\n:host .hemfixarna_product--top > div {\n width: 100%;\n}\n:host .hemfixarna_product--top > div h1 {\n max-width: 80%;\n}\n@media (max-width: 768px) {\n :host .hemfixarna_product--top > div h1 {\n max-width: 100%;\n }\n}\n:host .hemfixarna_product--top h4 {\n margin-bottom: 8px;\n}\n:host h5,\n:host p {\n margin: 0;\n}\n:host input[type=submit] {\n cursor: pointer;\n}\n:host input[type=date] ~ label {\n left: 56px;\n}\n:host input[type=date] {\n border: 1px solid #fcd9c9;\n padding-left: 64px;\n}\n:host input[type=checkbox] {\n height: 18px;\n width: 18px;\n border: 1px solid #fcd9c9;\n}\n:host input[type=checkbox]:checked {\n background: red;\n}\n:host input[type=date]::-webkit-calendar-picker-indicator {\n background: transparent;\n bottom: 0;\n color: transparent;\n cursor: pointer;\n height: auto;\n left: 0;\n position: absolute;\n right: 0;\n top: 0;\n width: auto;\n}\n:host button,\n:host a {\n cursor: pointer;\n background: none;\n border: none;\n}\n:host ul {\n list-style: none;\n margin: 0;\n padding: 0;\n}";
|
|
602
578
|
|
|
603
579
|
const HemfixarnaComponent = class {
|
|
604
580
|
constructor(hostRef) {
|
|
@@ -611,11 +587,13 @@ const HemfixarnaComponent = class {
|
|
|
611
587
|
this.showModal = false;
|
|
612
588
|
this.product = null;
|
|
613
589
|
this.id = undefined;
|
|
590
|
+
this.slug = undefined;
|
|
614
591
|
this.business = undefined;
|
|
615
592
|
this.widgetStyle = WidgetStyle.standard;
|
|
616
593
|
this.buttonColor = undefined;
|
|
617
594
|
this.buttonBg = undefined;
|
|
618
595
|
this.proppedProduct = null;
|
|
596
|
+
this.loginSourceError = null;
|
|
619
597
|
}
|
|
620
598
|
loadCategoryOrProduct(id) {
|
|
621
599
|
this.proppedProduct = null;
|
|
@@ -673,13 +651,14 @@ const HemfixarnaComponent = class {
|
|
|
673
651
|
}
|
|
674
652
|
else if (customer) {
|
|
675
653
|
state.customer = customer;
|
|
676
|
-
|
|
677
|
-
|
|
654
|
+
const id = this.id || this.slug;
|
|
655
|
+
if (id) {
|
|
656
|
+
if (id === 'maleri') {
|
|
678
657
|
state.maleri = true;
|
|
679
658
|
state.step = 4;
|
|
680
659
|
}
|
|
681
660
|
else {
|
|
682
|
-
this.loadCategoryOrProduct(
|
|
661
|
+
this.loadCategoryOrProduct(id);
|
|
683
662
|
}
|
|
684
663
|
}
|
|
685
664
|
}
|
|
@@ -691,6 +670,9 @@ const HemfixarnaComponent = class {
|
|
|
691
670
|
state.rutOptions = rut;
|
|
692
671
|
state.greenOptions = greenDiscount;
|
|
693
672
|
state.options = options;
|
|
673
|
+
if (localStorage.getItem('select_source')) {
|
|
674
|
+
state.selectSource = true;
|
|
675
|
+
}
|
|
694
676
|
}
|
|
695
677
|
// Open close modal && click outside event
|
|
696
678
|
openModal() {
|
|
@@ -717,6 +699,25 @@ const HemfixarnaComponent = class {
|
|
|
717
699
|
}
|
|
718
700
|
}
|
|
719
701
|
}
|
|
702
|
+
async handleLogin() {
|
|
703
|
+
this.loginSourceError = null;
|
|
704
|
+
const passwordInput = this.el.shadowRoot.querySelector('input[type="password"]');
|
|
705
|
+
const password = passwordInput.value;
|
|
706
|
+
try {
|
|
707
|
+
const status = await loginCustomer({ id: state.customer.ID, password: password });
|
|
708
|
+
if (status === 200) {
|
|
709
|
+
state.showSourcePasswordPrompt = false;
|
|
710
|
+
state.selectSource = true;
|
|
711
|
+
}
|
|
712
|
+
else {
|
|
713
|
+
this.loginSourceError = 'Fel lösenord';
|
|
714
|
+
}
|
|
715
|
+
}
|
|
716
|
+
catch (error) {
|
|
717
|
+
console.log(error);
|
|
718
|
+
this.loginSourceError = 'Fel lösenord';
|
|
719
|
+
}
|
|
720
|
+
}
|
|
720
721
|
getCartLength() {
|
|
721
722
|
return state.cart.reduce((acc, curr) => acc + curr.amount, 0);
|
|
722
723
|
}
|
|
@@ -728,7 +729,10 @@ const HemfixarnaComponent = class {
|
|
|
728
729
|
return (h("div", { class: `hemfixarna hemfixarna-${this.business}` }, h("div", { class: `hemfixarna_box hemfixarna_box--${this.widgetStyle}` }, [WidgetStyle.alternative_2, WidgetStyle.alternative_3].includes(this.widgetStyle) ? (h("img", { src: this.id === 'maleri' ? pensel : monteringLogo, alt: "montering logo", width: 32, height: 32 })) : null, h("div", null, h("div", null, h("p", { onClick: () => this.openModal(), class: `pointer ${[WidgetStyle.alternative_2, WidgetStyle.alternative_3].includes(this.widgetStyle) && state.selectedProduct ? 'underline' : ''}` }, this.id === 'maleri' ? (h("span", null, "Ber\u00E4kna fast pris p\u00E5 m\u00E5leri & tapetsering h\u00E4r")) : (h(Fragment, null, !state.selectedCustomerCategory && !this.product && !this.proppedProduct ? (h(Fragment, null, ((_a = state.customer) === null || _a === void 0 ? void 0 : _a.widget_title) ? (h("span", null, state.customer.widget_title)) : (h("span", null, "Montering/Installation - ", h("strong", { class: "underline" }, "se priser h\u00E4r"))))) : (h(Fragment, null, ((_b = this.product) === null || _b === void 0 ? void 0 : _b.title) || ((_c = this.proppedProduct) === null || _c === void 0 ? void 0 : _c.title) || ((_d = state.selectedCustomerCategory) === null || _d === void 0 ? void 0 : _d.widget_title) || (h("span", null, "Montering", h("wbr", null), "/Installation ", (_f = (_e = state.selectedCustomerCategory) === null || _e === void 0 ? void 0 : _e.name) !== null && _f !== void 0 ? _f : 'på plats', " - ", h("strong", { class: "underline" }, "se priser h\u00E4r"))), this.proppedProduct && !((_g = this.product) === null || _g === void 0 ? void 0 : _g.invoice) && !((_h = this.proppedProduct) === null || _h === void 0 ? void 0 : _h.invoice) ? (h("span", null, ' från', " ", h("strong", null, getProductPriceWithRotAndRut(this.proppedProduct || this.product), "kr"))) : null)))))), this.widgetStyle === WidgetStyle.standard ? h("img", { src: logo, width: 104 }) : null, this.widgetStyle === WidgetStyle.alternative ? (h("span", { class: "p-s" }, "Utf\u00F6rs av ", h("strong", null, "Hemfixarna"))) : null), [WidgetStyle.standard, WidgetStyle.alternative].includes(this.widgetStyle) ? (h("button", { onClick: () => this.openModal(), class: "hemfixarna_btn", style: {
|
|
729
730
|
color: ((_j = this.buttonColor) === null || _j === void 0 ? void 0 : _j.startsWith('#')) || !((_k = this.buttonColor) === null || _k === void 0 ? void 0 : _k.length) ? this.buttonColor : `#${this.buttonColor}`,
|
|
730
731
|
backgroundColor: ((_l = this.buttonBg) === null || _l === void 0 ? void 0 : _l.startsWith('#')) || !((_m = this.buttonBg) === null || _m === void 0 ? void 0 : _m.length) ? this.buttonBg : `#${this.buttonBg}`,
|
|
731
|
-
} }, "Best\u00E4ll h\u00E4r", this.getCartLength() > 0 && h("span", null, this.getCartLength()))) : null, WidgetStyle.alternative_2 === this.widgetStyle ? (h("div", { class: "hemfixarna_altbtn" }, h("strong", { class: "p-s" }, "Utf\u00F6rs av"), h("img", { src: logo, alt: "hemfixarna logo", width: 98 }))) : null), this.modal && (h("div", null, h("div", { class: `hemfixarna_modal ${this.showModal ? 'hemfixarna_modal--open' : ''}` }, state.modal && (h("div", { class: "hemfixarna_infomodal" }, state.modal.title && h("h2", null, state.modal.title), state.modal.text.map((t) => (h("p", { innerHTML: t }))), h("div", null, h("button", { onClick: () => (state.modal = null) }, "St\u00E4ng")))), state.
|
|
732
|
+
} }, "Best\u00E4ll h\u00E4r", this.getCartLength() > 0 && h("span", null, this.getCartLength()))) : null, WidgetStyle.alternative_2 === this.widgetStyle ? (h("div", { class: "hemfixarna_altbtn" }, h("strong", { class: "p-s" }, "Utf\u00F6rs av"), h("img", { src: logo, alt: "hemfixarna logo", width: 98 }))) : null), this.modal && (h("div", null, h("div", { class: `hemfixarna_modal ${this.showModal ? 'hemfixarna_modal--open' : ''}` }, state.modal && (h("div", { class: "hemfixarna_infomodal" }, state.modal.title && h("h2", null, state.modal.title), state.modal.text.map((t) => (h("p", { innerHTML: t }))), h("div", null, h("button", { onClick: () => (state.modal = null) }, "St\u00E4ng")))), state.showSourcePasswordPrompt ? (h("div", { class: "hemfixarna_source--pw hemfixarna_infomodal" }, h("form", { onSubmit: e => {
|
|
733
|
+
e.preventDefault();
|
|
734
|
+
this.handleLogin();
|
|
735
|
+
} }, h("input", { type: "password", placeholder: "L\u00F6senord" }), h("input", { type: "submit", value: "Logga in" }), this.loginSourceError && h("span", null, "Fel l\u00F6senord")))) : null, state.customer && h("hemfixarna-breadcrumbs", { closeModal: () => this.closeModal() }), h("div", { class: `hemfixarna_content hemfixarna_content--${state.step} ${state.step === 4 && state.maleri ? 'hemfixarna_content--painting' : ''}` }, state.step < 4 && h("hemfixarna-start", null), state.step === 4 && h("hemfixarna-product", null), state.step === 5 && h("hemfixarna-cart", null), state.step === 6 && h("hemfixarna-order", null))), h("div", { class: `hemfixarna_backdrop ${this.showModal ? 'hemfixarna_backdrop--open' : ''}` })))));
|
|
732
736
|
}
|
|
733
737
|
static get assetsDirs() { return ["assets"]; }
|
|
734
738
|
get el() { return getElement(this); }
|
|
@@ -744,7 +748,11 @@ const HemfixarnaInfo$1 = class {
|
|
|
744
748
|
this.vertical = false;
|
|
745
749
|
}
|
|
746
750
|
render() {
|
|
747
|
-
return (h("div", { class: `hemfixarna_contact ${this.vertical ? 'hemfixarna_contact--vertical' : 'hemfixarna_contact--horizontal'}` },
|
|
751
|
+
return (h("div", { class: `hemfixarna_contact ${this.vertical ? 'hemfixarna_contact--vertical' : 'hemfixarna_contact--horizontal'}` }, state.customer.source ? (h("div", { onClick: () => {
|
|
752
|
+
if (!state.selectSource) {
|
|
753
|
+
state.showSourcePasswordPrompt = true;
|
|
754
|
+
}
|
|
755
|
+
}, class: "hemfixarna_source" }, state.selectSource ? (h("svg", { viewBox: "0 0 1024 1024", fill: "#C84E18", height: "1em", width: "1em" }, h("path", { d: "M832 464H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v68c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-68c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0z" }))) : (h("svg", { viewBox: "0 0 1024 1024", fill: "#C84E18", height: "1em", width: "1em" }, h("path", { d: "M832 464h-68V240c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0zm152-237H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v224z" }))))) : null, h("a", { href: "tel:0770-220 720" }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M7 4V20H17V4H7ZM6 2H18C18.5523 2 19 2.44772 19 3V21C19 21.5523 18.5523 22 18 22H6C5.44772 22 5 21.5523 5 21V3C5 2.44772 5.44772 2 6 2ZM12 17C12.5523 17 13 17.4477 13 18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18C11 17.4477 11.4477 17 12 17Z", fill: "#C84E18" })), h("span", null, "0770-220 720")), h("a", { href: "https://hemfixarna.se/kundservice/", target: "_blank" }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { "clip-path": "url(#clip0_1001_894)" }, h("path", { d: "M21 12.22C21 6.73 16.74 3 12 3C7.31 3 3 6.65 3 12.28C2.4 12.62 2 13.26 2 14V16C2 17.1 2.9 18 4 18H5V11.9C5 8.03 8.13 4.9 12 4.9C15.87 4.9 19 8.03 19 11.9V19H11V21H19C20.1 21 21 20.1 21 19V17.78C21.59 17.47 22 16.86 22 16.14V13.84C22 13.14 21.59 12.53 21 12.22Z", fill: "#C84E18" }), h("path", { d: "M9 14C9.55228 14 10 13.5523 10 13C10 12.4477 9.55228 12 9 12C8.44772 12 8 12.4477 8 13C8 13.5523 8.44772 14 9 14Z", fill: "#C84E18" }), h("path", { d: "M15 14C15.5523 14 16 13.5523 16 13C16 12.4477 15.5523 12 15 12C14.4477 12 14 12.4477 14 13C14 13.5523 14.4477 14 15 14Z", fill: "#C84E18" }), h("path", { d: "M18 11.03C17.52 8.18 15.04 6 12.05 6C9.01997 6 5.75997 8.51 6.01997 12.45C8.48997 11.44 10.35 9.24 10.88 6.56C12.19 9.19 14.88 11 18 11.03Z", fill: "#C84E18" })), h("defs", null, h("clipPath", { id: "clip0_1001_894" }, h("rect", { width: "24", height: "24", fill: "white" })))), h("span", null, "Kundservice"))));
|
|
748
756
|
}
|
|
749
757
|
};
|
|
750
758
|
|