nestiq-component-library 1.1.94 → 1.1.96
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/index.es.js +8 -9
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +8 -9
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/src/components/NewPropertyCard/NewPropertyCard.css +9 -11
- package/src/components/NewPropertyCard/NewPropertyCard.tsx +5 -12
- package/src/components/PropertyImageList/PropertyImageList.tsx +2 -2
package/dist/index.js
CHANGED
|
@@ -356,11 +356,11 @@ function PropertyImageList(prop) {
|
|
|
356
356
|
React.createElement("img", { src: picture.url, alt: "Image ".concat(index + 1), className: "col-12 h-100 rounded-3 object-fit-cover" }))); })))),
|
|
357
357
|
React.createElement("div", { className: "col-1 h-100 d-flex position-absolute end-0 top-0", onClick: function () { return handleArrowClickInMainImage("right"); }, role: "button" },
|
|
358
358
|
React.createElement("div", { className: "col-lg-12 h-100 d-flex flex-column listImageButton border-0 rounded-3 ms-1" },
|
|
359
|
-
React.createElement("img", { src: iconArrowRight, className: "arroIconColour
|
|
359
|
+
React.createElement("img", { src: iconArrowRight, className: "arroIconColour ", alt: "Right Arrow" }))))),
|
|
360
360
|
React.createElement("div", { className: "col-7 col-lg-6 d-flex flex-row" },
|
|
361
361
|
React.createElement("div", { className: "col-lg-4 col-4 p-1", role: "button", onClick: toggleAllPhotos },
|
|
362
362
|
React.createElement("div", { className: "border col-lg-12 h-100 d-flex flex-column listImageButton border-0 rounded-3" },
|
|
363
|
-
React.createElement("img", { src: iconGallery, alt: "Gallery Icon"
|
|
363
|
+
React.createElement("img", { src: iconGallery, alt: "Gallery Icon" }),
|
|
364
364
|
React.createElement("span", { className: "listImgText" }, "Alle Fotos"))),
|
|
365
365
|
React.createElement("div", { className: "col-lg-4 col-3 p-1", role: "button", onClick: floorPlanClickHandler },
|
|
366
366
|
React.createElement("div", { className: "border col-lg-12 h-100 d-flex flex-column listImageButton border-0 rounded-3" },
|
|
@@ -438,7 +438,7 @@ function PropertyCard$1(props) {
|
|
|
438
438
|
React.createElement("span", null, "Wohnfl\u00E4che")))));
|
|
439
439
|
}
|
|
440
440
|
|
|
441
|
-
var css_248z$3 = ".
|
|
441
|
+
var css_248z$3 = ".property-card {\r\n width: 100%;\r\n max-width: 1280px;\r\n\r\n @media (min-width: 1500px) {\r\n max-width: 1280px;\r\n margin: 0 auto;\r\n }\r\n}\r\n\r\n.listing-compacts {\r\n max-width: 750px;\r\n align-self: stretch;\r\n flex-grow: 1;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: flex-start;\r\n align-items: flex-start;\r\n gap: 16px;\r\n border-radius: 0px 32px 32px 0px;\r\n /* box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); */\r\n background-color: rgba(58, 58, 58, 0.068);\r\n height: 460px;\r\n padding: 32px;\r\n}\r\n.cardStyles {\r\n width: 100%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 460px;\r\n border-radius: 32px 0px 0px 32px !important;\r\n}\r\n.cardTag {\r\n width: 75px;\r\n height: 30px;\r\n flex-grow: 0;\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-start;\r\n align-items: center;\r\n gap: 6px;\r\n padding: 0 24px;\r\n border-radius: 16px;\r\n border: solid 1px #313131;\r\n background-color: #fff;\r\n}\r\n.Grundriss {\r\n width: 120px;\r\n height: 30px;\r\n flex-grow: 0;\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 10px;\r\n font-size: 14px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n background: linear-gradient(to top, #000, #666);\r\n}\r\n.Frame-136 {\r\n height: 119px;\r\n align-self: stretch;\r\n flex-grow: 0;\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: flex-start;\r\n align-items: center;\r\n gap: 16px;\r\n padding: 10px 16px;\r\n border-radius: 16px;\r\n border: solid 1px rgba(0, 0, 0, 0.1);\r\n background-color: #fff;\r\n}\r\n.kontactbutton {\r\n width: 180px;\r\n height: 43px;\r\n flex-grow: 0;\r\n display: flex;\r\n flex-direction: row;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 10px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n background: linear-gradient(to top, #000, #666);\r\n}\r\n.kontact-button-text {\r\n flex-grow: 0;\r\n font-family: Inter;\r\n font-size: 16px;\r\n font-weight: 500;\r\n font-stretch: normal;\r\n font-style: normal;\r\n line-height: normal;\r\n letter-spacing: normal;\r\n text-align: center;\r\n color: #fff;\r\n}\r\n.propertyTitle {\r\n display: flex;\r\n flex-grow: 0;\r\n font-size: 24px;\r\n font-weight: 580;\r\n font-stretch: normal;\r\n font-style: normal;\r\n line-height: normal;\r\n letter-spacing: normal;\r\n text-align: start;\r\n color: #313131;\r\n}\r\n.firstLabel {\r\n width: 100px;\r\n height: 25px;\r\n gap: 6px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n border: solid 1px #031012 !important;\r\n background-color: var(--main-yellow);\r\n}\r\n\r\n.secondLabel {\r\n width: 85px;\r\n height: 25px;\r\n padding: 0 7px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n border: solid 1px #000;\r\n background-color: #fff;\r\n display: flex;\r\n}\r\n\r\n.thirdLabels {\r\n width: 110px;\r\n padding: 0 7px;\r\n height: 25px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n border: solid 1px #000;\r\n background-color: #fff;\r\n display: flex;\r\n}\r\n\r\n.fourthLabels {\r\n padding: 2px;\r\n\r\n width: 100px;\r\n height: 25px;\r\n border-radius: 16px;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n border: solid 1px #000;\r\n background-color: #fff;\r\n}\r\n\r\n.layersVector {\r\n width: 15.1px;\r\n height: 16px;\r\n}\r\n\r\n.layersText {\r\n font-size: 14px;\r\n color: #1b1b1b;\r\n}\r\n\r\n.style-img {\r\n object-fit: cover;\r\n border-radius: 30px !important;\r\n}\r\n\r\n.Vector {\r\n width: 12px;\r\n height: 16.1px;\r\n flex-grow: 0;\r\n margin: 0.4px 6px 0.4px 0;\r\n}\r\n\r\n.customButton {\r\n width: 262px;\r\n height: 43px;\r\n color: #000;\r\n cursor: pointer;\r\n border-color: #161410;\r\n background-color: #181716;\r\n box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);\r\n}\r\n.button_text {\r\n font-size: 16px;\r\n font-weight: 500;\r\n color: #1b1b1b;\r\n}\r\n\r\n.heartVector {\r\n width: 23px;\r\n height: 26.7px;\r\n cursor: pointer;\r\n}\r\n\r\n.heartVector.liked {\r\n fill: rgb(255, 255, 255) !important;\r\n}\r\n.locationTexts {\r\n font-size: 14px;\r\n color: #344041;\r\n text-align: center;\r\n}\r\n\r\n.arrowVector {\r\n width: 23px;\r\n height: 23px;\r\n flex-grow: 0;\r\n object-fit: contain;\r\n}\r\n\r\n.Price {\r\n font-size: 26px;\r\n font-weight: 500;\r\n font-stretch: normal;\r\n font-style: normal;\r\n line-height: normal;\r\n letter-spacing: normal;\r\n text-align: center;\r\n color: #ffffff;\r\n}\r\n\r\n.details {\r\n font-size: 14px;\r\n text-align: center;\r\n color: #344041;\r\n}\r\n.value {\r\n font-size: 20px;\r\n text-align: center;\r\n font-weight: 500;\r\n}\r\n\r\n.class {\r\n background-color: #1b1b1b;\r\n}\r\n\r\n.header {\r\n height: 64px;\r\n justify-content: center;\r\n}\r\n\r\n.rightConer {\r\n width: 200px;\r\n}\r\n@media all and (min-width: 2560px) {\r\n .header {\r\n font-size: 38px;\r\n\r\n display: flex;\r\n }\r\n .cardStyle {\r\n gap: 0px;\r\n width: 350px;\r\n height: 300px;\r\n /* margin-left: 250px; */\r\n }\r\n}\r\n@media (max-width: 1399px) {\r\n .header {\r\n font-size: 38px;\r\n align-self: center;\r\n margin-left: 150px;\r\n }\r\n .cardStyle {\r\n gap: 0px;\r\n width: 350px;\r\n height: 300px;\r\n }\r\n}\r\n\r\n@media (max-width: 1199px) {\r\n .header {\r\n font-size: 38px;\r\n }\r\n .cardStyle {\r\n width: 300px;\r\n height: 250px;\r\n }\r\n}\r\n\r\n@media (max-width: 575px) {\r\n .detail {\r\n font-size: 11px;\r\n padding: 2px;\r\n }\r\n .Price {\r\n font-size: 19px;\r\n }\r\n .header {\r\n font-size: 28px;\r\n }\r\n .locationText {\r\n font-size: 12px;\r\n }\r\n .customButton {\r\n width: 200px !important;\r\n }\r\n .button_text {\r\n font-size: 13px;\r\n }\r\n}\r\n\r\n@media (max-width: 375px) {\r\n .labelTopClass {\r\n width: 105px !important;\r\n }\r\n .layersText {\r\n font-size: 9px;\r\n }\r\n .firstLabel {\r\n gap: 2px;\r\n }\r\n .layersVector {\r\n width: 9px;\r\n height: 10px;\r\n gap: 0px;\r\n }\r\n .cardStyle {\r\n width: 320px !important;\r\n height: 220px !important;\r\n }\r\n .header {\r\n font-size: 24px;\r\n }\r\n .detail {\r\n font-size: 10px;\r\n padding: 2px;\r\n }\r\n .Price {\r\n font-size: 18px;\r\n }\r\n .locationText {\r\n font-size: 10px;\r\n }\r\n .Vector {\r\n width: 8px;\r\n height: 16px;\r\n margin: 0px 2px 0.4px;\r\n }\r\n}\r\n\r\n@media (max-width: 280px) {\r\n .cardStyle {\r\n width: 260px !important;\r\n height: 160px !important;\r\n }\r\n .detail {\r\n margin-bottom: 5px;\r\n font-size: 0.6ch;\r\n }\r\n .Price {\r\n font-size: 9px;\r\n }\r\n .locationText {\r\n font-size: 6px;\r\n }\r\n .Vector {\r\n width: 7px;\r\n height: 10px;\r\n margin: 0px 2px 4px;\r\n }\r\n .heartVector {\r\n width: 15px;\r\n height: 20px;\r\n }\r\n}\r\n";
|
|
442
442
|
styleInject(css_248z$3);
|
|
443
443
|
|
|
444
444
|
var noImageIcon = "/static/media/default-property.9987f19670be82b6.jpg";
|
|
@@ -503,13 +503,12 @@ function PropertyCard(props) {
|
|
|
503
503
|
console.warn("imageListRef is not set");
|
|
504
504
|
}
|
|
505
505
|
};
|
|
506
|
-
return (React.createElement("div", { className: "d-flex flex-row " },
|
|
507
|
-
React.createElement("div", { className: "d-flex flex-column col-md-6
|
|
508
|
-
React.createElement("div", { key: props.property.id, className: "card-bod position-relative cardStyles h-100
|
|
506
|
+
return (React.createElement("div", { className: "d-flex flex-row property-card" },
|
|
507
|
+
React.createElement("div", { className: "d-flex flex-column col-md-6", onClick: props.onClick },
|
|
508
|
+
React.createElement("div", { key: props.property.id, className: "card-bod position-relative cardStyles h-100 w-100", style: {
|
|
509
509
|
backgroundImage: "url(".concat(mainImage || pictureUrls[0], ")"),
|
|
510
510
|
backgroundSize: "cover",
|
|
511
511
|
backgroundPosition: "center",
|
|
512
|
-
maxWidth: "740px",
|
|
513
512
|
} },
|
|
514
513
|
React.createElement("div", { className: "d-flex flex-row justify-content-between gap-5" },
|
|
515
514
|
React.createElement("div", { className: "d-flex ms-2", style: { position: "absolute", left: "0" }, onClick: function () { return handleArrowClickInMainImage("left"); }, role: "button" },
|
|
@@ -523,8 +522,8 @@ function PropertyCard(props) {
|
|
|
523
522
|
React.createElement("img", { src: iconLayers, className: "", style: { width: "18px" } }),
|
|
524
523
|
" ",
|
|
525
524
|
"Grundriss")))),
|
|
526
|
-
React.createElement("div", { className: "d-flex flex-column listing-compacts col-md-6
|
|
527
|
-
React.createElement("div", { className: "d-flex align-self-end justify-content-end gap-2"
|
|
525
|
+
React.createElement("div", { className: "d-flex flex-column listing-compacts col-md-6" },
|
|
526
|
+
React.createElement("div", { className: "d-flex align-self-end justify-content-end gap-2" },
|
|
528
527
|
React.createElement("img", { src: shareIcon, alt: "Location Icon", className: "w-50 ", onClick: handleSharePopUp }),
|
|
529
528
|
React.createElement("img", { src: moreIcon, alt: "Location Icon", className: "" })),
|
|
530
529
|
React.createElement("div", null,
|