nestiq-component-library 1.1.151 → 1.1.152

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.es.js +43 -34
  2. package/dist/index.es.js.map +1 -1
  3. package/dist/index.js +43 -34
  4. package/dist/index.js.map +1 -1
  5. package/package.json +1 -1
  6. package/src/components/ImageListPopup/ImageListPopup.tsx +12 -7
  7. package/src/components/NewPropertyCard/NewPropertyCard.tsx +38 -31
package/src/components/ImageListPopup/ImageListPopup.tsx CHANGED
@@ -42,12 +42,12 @@ export default function ImageListPopup(props: PopupProps) {
42
42
  <div>
43
43
  {showPopUp && (
44
44
  <div className="popup-overlay">
45
- <div className=" d-flex w-50 flex-column col-6 ">
46
- <div className="d-flex align-self-end me-5 mt-5">
45
+ <div className=" d-flex flex-column ">
46
+ <div className="d-flex align-self-end me-5 ">
47
47
  <img
48
48
  src={iconClose}
49
49
  alt="close"
50
- className="closeIcon mt-5"
50
+ className="closeIcon"
51
51
  onClick={handleClose}
52
52
  />
53
53
  </div>
@@ -73,8 +73,8 @@ export default function ImageListPopup(props: PopupProps) {
73
73
  className=" rounded-5 mainImage "
74
74
  style={{
75
75
  backgroundImage: `url(${props.pictureUrls[currentImageIndex].url})`,
76
- height: "350px",
77
- width: "600px",
76
+ height: "465px",
77
+ width: "880px",
78
78
  backgroundSize: "cover",
79
79
  backgroundPosition: "center",
80
80
  }}
@@ -106,11 +106,11 @@ export default function ImageListPopup(props: PopupProps) {
106
106
  ref={imageListRef}
107
107
  >
108
108
  {props.pictureUrls.length > 0 && (
109
- <div className="col-lg-5 h-100 w-25 d-flex gap-4 flex-row rounded-3">
109
+ <div className="col-lg-5 d-flex gap-4 flex-row rounded-3">
110
110
  {props.pictureUrls.map((picture, index) => (
111
111
  <div
112
112
  key={index}
113
- className="col-lg-12 h-100 d-flex"
113
+ className="col-lg-12 d-flex"
114
114
  onClick={() => {
115
115
  setCurrentImageIndex(index);
116
116
  imageListRef.current!.scrollTo({
@@ -119,6 +119,11 @@ export default function ImageListPopup(props: PopupProps) {
119
119
  });
120
120
  }}
121
121
  role="button"
122
+ style={{
123
+ cursor: "pointer",
124
+ width: "150px",
125
+ height: "150px",
126
+ }}
122
127
  >
123
128
  <img
124
129
  src={picture.url}
package/src/components/NewPropertyCard/NewPropertyCard.tsx CHANGED
@@ -156,11 +156,14 @@ export default function PropertyCard(props: PopupProps) {
156
156
  </div>
157
157
  </div>
158
158
  <div
159
- className={`listing-compact d-flex flex-column col-6 ${
159
+ className={`listing-compact_test d-flex flex-column align-self-end col-6 ${
160
160
  props.Impliment ? "cc-height" : "listing-height"
161
161
  }`}
162
162
  >
163
- <div className="d-flex flex-column gap-3">
163
+ <div
164
+ className="d-flex flex-column gap-3 justify-content-between mb-4"
165
+ style={{ height: "104px" }}
166
+ >
164
167
  <div className="d-flex flex-row justify-content-between gap-2">
165
168
  <span
166
169
  className="propertyTitle align-items-start "
@@ -172,8 +175,8 @@ export default function PropertyCard(props: PopupProps) {
172
175
  role="button"
173
176
  >
174
177
  {props.property.expose?.title}
175
- {/*Einziehen ohne einen Pinselstrich - Kernsanierte Eigentumswohnung*/}
176
- {/*in top Lage*/}
178
+ {/* Einziehen ohne einen Pinselstrich - Kernsanierte Eigentumswohnung
179
+ in top Lage */}
177
180
  </span>
178
181
  <div
179
182
  className="d-flex gap-2"
@@ -185,7 +188,7 @@ export default function PropertyCard(props: PopupProps) {
185
188
  >
186
189
  <img
187
190
  src={shareIcon}
188
- alt="Share Icon"
191
+ alt="Location Icon"
189
192
  className=" "
190
193
  onClick={handleSharePopUp}
191
194
  style={{ maxHeight: "24px", maxWidth: "24px" }}
@@ -193,7 +196,7 @@ export default function PropertyCard(props: PopupProps) {
193
196
  />
194
197
  <img
195
198
  src={moreIcon}
196
- alt="More Icon"
199
+ alt="Location Icon"
197
200
  className=""
198
201
  style={{ maxHeight: "24px", maxWidth: "24px" }}
199
202
  role="button"
@@ -208,13 +211,13 @@ export default function PropertyCard(props: PopupProps) {
208
211
  }}
209
212
  >
210
213
  {" "}
211
- <div className="location-wrapper">
214
+ <div className="location-wrapper mb-1">
212
215
  <img
213
216
  src={locationIcon}
214
217
  alt="Location Icon"
215
- className="location-icon"
218
+ className="Vector-test"
216
219
  />
217
- <span className="locationTexts ">
220
+ <span className="locationTexts-test">
218
221
  {props.property.city || "N/A"}
219
222
  </span>
220
223
  </div>
@@ -227,52 +230,55 @@ export default function PropertyCard(props: PopupProps) {
227
230
  paddingRight: "32px",
228
231
  }}
229
232
  >
230
- <span className="priceValue col-lg-4 col-md-4 col-sm-6 ">
233
+ <span className="priceValue-test col-lg-4 col-md-4 col-sm-6 ">
231
234
  {formatPrice(props.property?.evaluation?.askingPrice ?? 0)} €
232
- <div className="price_label">Kaufpreis</div>
235
+ <div className="price_label-test">Kaufpreis</div>
233
236
  </span>
234
- <span className="text-dark value col-lg-5 col-md-5 col-sm-7">
237
+ <span className="text-dark value-test col-lg-5 col-md-5 col-sm-7">
235
238
  {props.property.constructedArea} m²
236
- <div className="details">Wohnfläche</div>
239
+ <div className="details-test">Wohnfläche</div>
237
240
  </span>
238
- <span className="text-dark value col-lg-4 col-md-3 col-sm-6 text-truncate ">
241
+ <span className="text-dark value-test col-lg-4 col-md-3 col-sm-6 text-truncate ">
239
242
  {+props.property?.rooms}
240
- <div className="details">Zimmer</div>
243
+ <div className="details-test">Zimmer</div>
241
244
  </span>
242
- <span className="text-dark value col-lg-4 col-md-3 col-sm-4 text-truncate ">
245
+ <span className="text-dark value-test col-lg-4 col-md-3 col-sm-4 text-truncate ">
243
246
  {+props.property.propertyArea} m²
244
- <div className="details">Grundstück</div>
247
+ <div className="details-test">Grundstück</div>
245
248
  </span>
246
249
  </div>
247
250
  <div
248
251
  className="labelTopClass d-flex start-0 col-sm-5 col-lg-8 "
249
252
  style={{ padding: "0 28px" }}
250
253
  >
251
- <div className=" align-items-center d-flex flex-row gap-3">
254
+ <div
255
+ className=" align-items-center d-flex flex-row gap-3"
256
+ style={{ marginBottom: "" }}
257
+ >
252
258
  {props.property.historicalProtection && (
253
259
  <label className="chipLabel justify-content-center align-items-center">
254
- <span className="layersText">{"Denkmalschutz"}</span>
260
+ <span className="layersText_Test ">{"Denkmalschutz"}</span>
255
261
  </label>
256
262
  )}
257
263
 
258
264
  {props.property.basement && (
259
- <label className="chipLabel justify-content-center align-items-center">
260
- <span className="layersText">{"Keller"}</span>
265
+ <label className="chipLabel justify-content-center align-items-center">
266
+ <span className="layersText_Test ">{"Keller"}</span>
261
267
  </label>
262
268
  )}
263
269
  {props.property.balcony && (
264
- <label className="chipLabel justify-content-center align-items-center">
265
- <span className="layersText">{"Balkon"}</span>
270
+ <label className="secondLabel justify-content-center align-items-center">
271
+ <span className="layersText_Test ">{"Balkon"}</span>
266
272
  </label>
267
273
  )}
268
274
  {props.property.terrace && (
269
275
  <label className="chipLabel justify-content-center align-items-center ">
270
- <span className="layersText">{"Terrace"}</span>
276
+ <span className="layersText_Test">{"Terrace"}</span>
271
277
  </label>
272
278
  )}
273
279
  {props.property.guestBathroom && (
274
280
  <label className="chipLabel">
275
- <span className="layersText">{"Gäste-WC"}</span>
281
+ <span className="layersText_Test">{"Gäste-WC"}</span>
276
282
  </label>
277
283
  )}
278
284
  </div>
@@ -292,28 +298,29 @@ export default function PropertyCard(props: PopupProps) {
292
298
  <div className="ms-2 d-flex flex-column col-8 justify-content-center align-self-center text-center">
293
299
  <span className="fw-bold">Herr Florian Gauss</span>
294
300
  <span>Immogart UGh</span>
295
- {/* <button
296
- className="kontactbutton text-light align-self-center"
301
+ <button
302
+ className="kontactbutton_test text-light align-self-center"
297
303
  onClick={handleMessagPopUp}
298
304
  role="button"
299
305
  >
300
306
  <span className="kontact-button-text">
301
307
  Kontakt aufnehmen{" "}
302
308
  </span>
303
- </button> */}
309
+ </button>
304
310
  </div>
305
311
  </div>
306
312
  </div>
307
313
  )}
308
314
  {!props.Impliment && (
309
315
  <div
310
- className=""
316
+ className="d-lex flex-column "
311
317
  style={{
312
318
  paddingLeft: "32px",
313
319
  paddingRight: "32px",
320
+ // marginBottom: "32px",
314
321
  }}
315
322
  >
316
- <div className="Frame-136 d-flex flex-row">
323
+ <div className="Frame-136-test d-flex flex-row">
317
324
  <div className="d-flex flex-column flex-lg-row col-4 justify-content-between ">
318
325
  <img src={immooly} alt="Logo" className="immooly" />
319
326
  </div>
@@ -323,7 +330,7 @@ export default function PropertyCard(props: PopupProps) {
323
330
  <span>Immogart UGh</span>
324
331
  </div>
325
332
  <button
326
- className="kontactbutton text-light "
333
+ className="kontactbutton_test text-light "
327
334
  onClick={handleMessagPopUp}
328
335
  role="button"
329
336
  >