nestiq-component-library 1.1.63 → 1.1.65

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.js CHANGED
@@ -382,7 +382,7 @@ var layerIcon = "/static/media/LayersIcon.34c085c352a2c9c8.svg";
382
382
 
383
383
  var locationIcon = "/static/media/locationIcon.961de080757bda41.svg";
384
384
 
385
- var css_248z$3 = ".padding-global {\r\n height: 737px !important;\r\n padding: 0 40px;\r\n}\r\n.header {\r\n font-size: 48px;\r\n font-weight: 600;\r\n color: #1b1b1b;\r\n}\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}\r\n\r\n/* .thirdLabels {\r\n padding: 4px;\r\n width: 110px;\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.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: var(--main-yellow);\r\n background-color: var(--main-yellow);\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.locationText {\r\n font-size: 14px;\r\n color: white;\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: #fff;\r\n}\r\n\r\n.detail {\r\n font-size: 12px;\r\n text-align: center;\r\n color: #fff;\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.cardStyle {\r\n width: 405px;\r\n max-width: 2405px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 350px;\r\n border-radius: 30px !important;\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";
385
+ var css_248z$3 = ".padding-global {\r\n height: 737px !important;\r\n padding: 0 40px;\r\n}\r\n.header {\r\n font-size: 48px;\r\n font-weight: 600;\r\n color: #1b1b1b;\r\n}\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: fit-content;\r\n height: 25px;\r\n padding: 0 17px;\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/* .thirdLabels {\r\n padding: 4px;\r\n width: 110px;\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.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: var(--main-yellow);\r\n background-color: var(--main-yellow);\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.locationText {\r\n font-size: 14px;\r\n color: white;\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: #fff;\r\n}\r\n\r\n.detail {\r\n font-size: 12px;\r\n text-align: center;\r\n color: #fff;\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.cardStyle {\r\n width: 405px;\r\n max-width: 2405px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n height: 350px;\r\n border-radius: 30px !important;\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";
386
386
  styleInject(css_248z$3);
387
387
 
388
388
  var noImageIcon$1 = "/static/media/default-property.9987f19670be82b6.jpg";
@@ -453,6 +453,8 @@ var arrowRight = "/static/media/card-arrow-right.c60af4cbbd49f3aa.svg";
453
453
 
454
454
  var iconLayers = "/static/media/layer_icon.9b56c187199c44b5.svg";
455
455
 
456
+ var immooly = "/static/media/imooly.890e3dd01ea33574.svg";
457
+
456
458
  function PropertyCard(props) {
457
459
  var _a, _b, _c, _d, _e, _f;
458
460
  var _g = React.useState(false); _g[0]; _g[1];
@@ -531,13 +533,12 @@ function PropertyCard(props) {
531
533
  React.createElement("div", { className: "d-flex " },
532
534
  React.createElement("img", { src: locationIcon, alt: "Location Icon", className: "Vector" }),
533
535
  React.createElement("span", { className: "locationTexts " }, props.property.city || "N/A"))),
534
- React.createElement("div", { className: "d-flex flex-row gap-4" },
535
- React.createElement("div", { className: "d-flex col-10" },
536
- React.createElement("span", { className: "value " },
537
- formatPrice((_f = (_e = (_d = props.property) === null || _d === void 0 ? void 0 : _d.evaluation) === null || _e === void 0 ? void 0 : _e.askingPrice) !== null && _f !== void 0 ? _f : 0),
538
- " \u20AC",
539
- React.createElement("br", null),
540
- React.createElement("span", { className: "details" }, "Kaufpreis"))),
536
+ React.createElement("div", { className: "d-flex flex-row gap-lg-5 col-6 col-lg-8 gap-md-2 " },
537
+ React.createElement("span", { className: "value col-lg-3 col-md-4 col-sm-6 " },
538
+ formatPrice((_f = (_e = (_d = props.property) === null || _d === void 0 ? void 0 : _d.evaluation) === null || _e === void 0 ? void 0 : _e.askingPrice) !== null && _f !== void 0 ? _f : 0),
539
+ " \u20AC",
540
+ React.createElement("br", null),
541
+ React.createElement("span", { className: "details" }, "Kaufpreis")),
541
542
  React.createElement("span", { className: "text-dark value col-lg-4 col-md-4 col-sm-6 text-truncate " },
542
543
  +props.property.rooms,
543
544
  React.createElement("br", null),
@@ -562,21 +563,16 @@ function PropertyCard(props) {
562
563
  props.property.basement && (React.createElement("label", { className: "secondLabel justify-content-center align-items-center" },
563
564
  React.createElement("span", { className: "layersText " }, "Keller"))),
564
565
  props.property.balcony && (React.createElement("label", { className: "secondLabel justify-content-center align-items-center" },
565
- React.createElement("span", { className: "layersText " }, "Balkon")))),
566
- props.property.terrace && (React.createElement("label", { className: "thirdLabels justify-content-center align-items-center " },
567
- React.createElement("span", { className: "layersText" }, "Terrace"))),
568
- React.createElement("div", { className: "d-flex " }, props.property.guestBathroom && (React.createElement("label", { className: "col-1 thirdLabels justify-content-center align-items-center " },
569
- React.createElement("span", { className: "layersText " }, "Gäste-WC"))))),
566
+ React.createElement("span", { className: "layersText " }, "Balkon"))),
567
+ props.property.terrace && (React.createElement("label", { className: "thirdLabels justify-content-center align-items-center " },
568
+ React.createElement("span", { className: "layersText" }, "Terrace"))),
569
+ props.property.guestBathroom && (React.createElement("label", { className: "col-1 thirdLabels justify-content-center align-items-center " },
570
+ React.createElement("span", { className: "layersText " }, "Gäste-WC"))))),
570
571
  React.createElement("div", { className: "Frame-136 d-flex flex-row" },
571
- React.createElement("div", { className: "d-flex flex-column col-5 justify-content-between" },
572
- React.createElement("span", { className: "h4" },
573
- React.createElement("strong", null, "McGrath"),
574
- " ")),
575
- React.createElement("div", { className: "d-flex flex-column justify-content-between" },
576
- React.createElement("span", null,
577
- React.createElement("strong", null, "Herr John McGrath"),
578
- " "),
579
- React.createElement("span", null, "McGrath"),
572
+ React.createElement("div", { className: "d-flex flex-column flex-lg-row col-4 justify-content-between " },
573
+ React.createElement("img", { src: immooly, alt: "Logo", className: "immooly" })),
574
+ React.createElement("div", { className: "d-flex flex-column flex-lg-row justify-content-between" },
575
+ React.createElement("span", { className: "d-flex col-5" }, "Herr Florian Gauss Immogart UGh"),
580
576
  React.createElement("button", { className: "kontactbutton text-light ", onClick: handleMessagPopUp, role: "button" },
581
577
  React.createElement("span", { className: "kontact-button-text" }, "Kontakt aufnehmen "))))),
582
578
  floorPlan && (React.createElement(FloorPlanPopup, { contentUrl: props.floorPlanUrl, onCloseClick: function () { return setFloorPlan(false); } })),