nestiq-component-library 1.1.93 → 1.1.95

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 (49) hide show
  1. package/dist/assets/images/Icon_rightArrow.svg +3 -0
  2. package/dist/assets/images/LayersIcon.svg +5 -0
  3. package/dist/assets/images/blackarrow-Right.svg +3 -0
  4. package/dist/assets/images/blckarrow-Left.svg +3 -0
  5. package/dist/assets/images/{card-arrow-left.55343410142dad3f.svg → card-arrow-left.28090aba4b4f2006.svg} +4 -4
  6. package/dist/assets/images/{card-arrow-right.60b3bf0e34c1800d.svg → card-arrow-right.c60af4cbbd49f3aa.svg} +4 -4
  7. package/dist/assets/images/chevron-left.svg +3 -0
  8. package/dist/assets/images/default-property.jpg +0 -0
  9. package/dist/assets/images/heartIcon.svg +3 -0
  10. package/dist/assets/images/icon-close-white.webp +0 -0
  11. package/dist/assets/images/icon_close 2.e41bb9a4db48e048.png +0 -0
  12. package/dist/assets/images/icon_close_2.png +0 -0
  13. package/dist/assets/images/icon_gallery.svg +4 -0
  14. package/dist/assets/images/icon_map.svg +10 -0
  15. package/dist/assets/images/icon_share_1.svg +3 -0
  16. package/dist/assets/images/{imooly.b46514ac970e6052.svg → imooly.890e3dd01ea33574.svg} +7 -7
  17. package/dist/assets/images/layer_icon.svg +5 -0
  18. package/dist/assets/images/locationIcon.0af399c78e0cdc20.svg +4 -0
  19. package/dist/assets/images/locationIcon.svg +4 -0
  20. package/dist/assets/images/locationIconBlack.svg +4 -0
  21. package/dist/assets/images/{more.ce14789c8d37e327.svg → more.1e158adc48fbb406.svg} +12 -12
  22. package/dist/assets/images/no-image-icon.png +0 -0
  23. package/dist/components/Button/Button.js +6 -0
  24. package/dist/components/ImageListPopup/ImageListPopup.js +26 -0
  25. package/dist/components/MessagePopup/ErrorPopup.d.ts +7 -0
  26. package/dist/components/Popup/Popup.js +12 -0
  27. package/dist/components/SharePopup/PopUp.d.ts +7 -0
  28. package/dist/index.es.js +9 -9
  29. package/dist/index.es.js.map +1 -1
  30. package/dist/index.js +9 -9
  31. package/dist/index.js.map +1 -1
  32. package/package.json +1 -1
  33. package/rollup.config.mjs +36 -36
  34. package/src/assets/images/card-arrow-left.svg +4 -4
  35. package/src/assets/images/card-arrow-right.svg +4 -4
  36. package/src/assets/images/imooly.svg +7 -7
  37. package/src/assets/images/more.svg +12 -12
  38. package/src/components/FloorPlanPopup/FloorPlanPopup.css +3 -3
  39. package/src/components/FloorPlanPopup/FloorPlanPopup.tsx +83 -83
  40. package/src/components/ImageListPopup/ImageListPopup.css +83 -83
  41. package/src/components/ImageListPopup/ImageListPopup.tsx +141 -141
  42. package/src/components/MessagePopup/MessagePopUp.tsx +156 -156
  43. package/src/components/NewPropertyCard/NewPropertyCard.css +370 -370
  44. package/src/components/NewPropertyCard/NewPropertyCard.tsx +280 -280
  45. package/src/components/Popup/Popup.tsx +29 -29
  46. package/src/components/PropertyImageList/PropertyImageList.css +1 -0
  47. package/src/components/PropertyImageList/PropertyImageList.tsx +2 -2
  48. package/src/components/ToastWrapper/ToastWrapper.tsx +25 -25
  49. package/src/models/message.model.ts +7 -7
@@ -1,370 +1,370 @@
1
- .property-card {
2
- width: 100%;
3
- max-width: 1280px;
4
-
5
- @media (min-width: 1500px) {
6
- max-width: 1280px;
7
- margin: 0 auto;
8
- }
9
- }
10
-
11
- .listing-compacts {
12
- max-width: 750px;
13
- align-self: stretch;
14
- flex-grow: 1;
15
- display: flex;
16
- flex-direction: column;
17
- justify-content: flex-start;
18
- align-items: flex-start;
19
- gap: 16px;
20
- border-radius: 0px 32px 32px 0px;
21
- /* box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); */
22
- background-color: rgba(58, 58, 58, 0.068);
23
- height: 460px;
24
- padding: 32px;
25
- }
26
- .cardStyles {
27
- width: 100%;
28
- display: flex;
29
- align-items: center;
30
- justify-content: center;
31
- height: 460px;
32
- border-radius: 32px 0px 0px 32px !important;
33
- }
34
- .cardTag {
35
- width: 75px;
36
- height: 30px;
37
- flex-grow: 0;
38
- display: flex;
39
- flex-direction: row;
40
- justify-content: flex-start;
41
- align-items: center;
42
- gap: 6px;
43
- padding: 0 24px;
44
- border-radius: 16px;
45
- border: solid 1px #313131;
46
- background-color: #fff;
47
- }
48
- .Grundriss {
49
- width: 120px;
50
- height: 30px;
51
- flex-grow: 0;
52
- display: flex;
53
- flex-direction: row;
54
- justify-content: center;
55
- align-items: center;
56
- gap: 10px;
57
- font-size: 14px;
58
- border-radius: 16px;
59
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
60
- background: linear-gradient(to top, #000, #666);
61
- }
62
- .Frame-136 {
63
- height: 119px;
64
- align-self: stretch;
65
- flex-grow: 0;
66
- display: flex;
67
- flex-direction: row;
68
- justify-content: flex-start;
69
- align-items: center;
70
- gap: 16px;
71
- padding: 10px 16px;
72
- border-radius: 16px;
73
- border: solid 1px rgba(0, 0, 0, 0.1);
74
- background-color: #fff;
75
- }
76
- .kontactbutton {
77
- width: 180px;
78
- height: 43px;
79
- flex-grow: 0;
80
- display: flex;
81
- flex-direction: row;
82
- justify-content: center;
83
- align-items: center;
84
- gap: 10px;
85
- border-radius: 16px;
86
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
87
- background: linear-gradient(to top, #000, #666);
88
- }
89
- .kontact-button-text {
90
- flex-grow: 0;
91
- font-family: Inter;
92
- font-size: 16px;
93
- font-weight: 500;
94
- font-stretch: normal;
95
- font-style: normal;
96
- line-height: normal;
97
- letter-spacing: normal;
98
- text-align: center;
99
- color: #fff;
100
- }
101
- .propertyTitle {
102
- display: flex;
103
- flex-grow: 0;
104
- font-size: 24px;
105
- font-weight: 580;
106
- font-stretch: normal;
107
- font-style: normal;
108
- line-height: normal;
109
- letter-spacing: normal;
110
- text-align: start;
111
- color: #313131;
112
- }
113
- .firstLabel {
114
- width: 100px;
115
- height: 25px;
116
- gap: 6px;
117
- border-radius: 16px;
118
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
119
- border: solid 1px #031012 !important;
120
- background-color: var(--main-yellow);
121
- }
122
-
123
- .secondLabel {
124
- width: 85px;
125
- height: 25px;
126
- padding: 0 7px;
127
- border-radius: 16px;
128
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
129
- border: solid 1px #000;
130
- background-color: #fff;
131
- display: flex;
132
- }
133
-
134
- .thirdLabels {
135
- width: 110px;
136
- padding: 0 7px;
137
- height: 25px;
138
- border-radius: 16px;
139
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
140
- border: solid 1px #000;
141
- background-color: #fff;
142
- display: flex;
143
- }
144
-
145
- .fourthLabels {
146
- padding: 2px;
147
-
148
- width: 100px;
149
- height: 25px;
150
- border-radius: 16px;
151
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
152
- border: solid 1px #000;
153
- background-color: #fff;
154
- }
155
-
156
- .layersVector {
157
- width: 15.1px;
158
- height: 16px;
159
- }
160
-
161
- .layersText {
162
- font-size: 14px;
163
- color: #1b1b1b;
164
- }
165
-
166
- .style-img {
167
- object-fit: cover;
168
- border-radius: 30px !important;
169
- }
170
-
171
- .Vector {
172
- width: 12px;
173
- height: 16.1px;
174
- flex-grow: 0;
175
- margin: 0.4px 6px 0.4px 0;
176
- }
177
-
178
- .customButton {
179
- width: 262px;
180
- height: 43px;
181
- color: #000;
182
- cursor: pointer;
183
- border-color: #161410;
184
- background-color: #181716;
185
- box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
186
- }
187
- .button_text {
188
- font-size: 16px;
189
- font-weight: 500;
190
- color: #1b1b1b;
191
- }
192
-
193
- .heartVector {
194
- width: 23px;
195
- height: 26.7px;
196
- cursor: pointer;
197
- }
198
-
199
- .heartVector.liked {
200
- fill: rgb(255, 255, 255) !important;
201
- }
202
- .locationTexts {
203
- font-size: 14px;
204
- color: #344041;
205
- text-align: center;
206
- }
207
-
208
- .arrowVector {
209
- width: 23px;
210
- height: 23px;
211
- flex-grow: 0;
212
- object-fit: contain;
213
- }
214
-
215
- .Price {
216
- font-size: 26px;
217
- font-weight: 500;
218
- font-stretch: normal;
219
- font-style: normal;
220
- line-height: normal;
221
- letter-spacing: normal;
222
- text-align: center;
223
- color: #ffffff;
224
- }
225
-
226
- .details {
227
- font-size: 14px;
228
- text-align: center;
229
- color: #344041;
230
- }
231
- .value {
232
- font-size: 20px;
233
- text-align: center;
234
- font-weight: 500;
235
- }
236
-
237
- .class {
238
- background-color: #1b1b1b;
239
- }
240
-
241
- .header {
242
- height: 64px;
243
- justify-content: center;
244
- }
245
-
246
- .rightConer {
247
- width: 200px;
248
- }
249
- @media all and (min-width: 2560px) {
250
- .header {
251
- font-size: 38px;
252
-
253
- display: flex;
254
- }
255
- .cardStyle {
256
- gap: 0px;
257
- width: 350px;
258
- height: 300px;
259
- /* margin-left: 250px; */
260
- }
261
- }
262
- @media (max-width: 1399px) {
263
- .header {
264
- font-size: 38px;
265
- align-self: center;
266
- margin-left: 150px;
267
- }
268
- .cardStyle {
269
- gap: 0px;
270
- width: 350px;
271
- height: 300px;
272
- }
273
- }
274
-
275
- @media (max-width: 1199px) {
276
- .header {
277
- font-size: 38px;
278
- }
279
- .cardStyle {
280
- width: 300px;
281
- height: 250px;
282
- }
283
- }
284
-
285
- @media (max-width: 575px) {
286
- .detail {
287
- font-size: 11px;
288
- padding: 2px;
289
- }
290
- .Price {
291
- font-size: 19px;
292
- }
293
- .header {
294
- font-size: 28px;
295
- }
296
- .locationText {
297
- font-size: 12px;
298
- }
299
- .customButton {
300
- width: 200px !important;
301
- }
302
- .button_text {
303
- font-size: 13px;
304
- }
305
- }
306
-
307
- @media (max-width: 375px) {
308
- .labelTopClass {
309
- width: 105px !important;
310
- }
311
- .layersText {
312
- font-size: 9px;
313
- }
314
- .firstLabel {
315
- gap: 2px;
316
- }
317
- .layersVector {
318
- width: 9px;
319
- height: 10px;
320
- gap: 0px;
321
- }
322
- .cardStyle {
323
- width: 320px !important;
324
- height: 220px !important;
325
- }
326
- .header {
327
- font-size: 24px;
328
- }
329
- .detail {
330
- font-size: 10px;
331
- padding: 2px;
332
- }
333
- .Price {
334
- font-size: 18px;
335
- }
336
- .locationText {
337
- font-size: 10px;
338
- }
339
- .Vector {
340
- width: 8px;
341
- height: 16px;
342
- margin: 0px 2px 0.4px;
343
- }
344
- }
345
-
346
- @media (max-width: 280px) {
347
- .cardStyle {
348
- width: 260px !important;
349
- height: 160px !important;
350
- }
351
- .detail {
352
- margin-bottom: 5px;
353
- font-size: 0.6ch;
354
- }
355
- .Price {
356
- font-size: 9px;
357
- }
358
- .locationText {
359
- font-size: 6px;
360
- }
361
- .Vector {
362
- width: 7px;
363
- height: 10px;
364
- margin: 0px 2px 4px;
365
- }
366
- .heartVector {
367
- width: 15px;
368
- height: 20px;
369
- }
370
- }
1
+ .property-card {
2
+ width: 100%;
3
+ max-width: 1280px;
4
+
5
+ @media (min-width: 1500px) {
6
+ max-width: 1280px;
7
+ margin: 0 auto;
8
+ }
9
+ }
10
+
11
+ .listing-compacts {
12
+ max-width: 750px;
13
+ align-self: stretch;
14
+ flex-grow: 1;
15
+ display: flex;
16
+ flex-direction: column;
17
+ justify-content: flex-start;
18
+ align-items: flex-start;
19
+ gap: 16px;
20
+ border-radius: 0px 32px 32px 0px;
21
+ /* box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25); */
22
+ background-color: rgba(58, 58, 58, 0.068);
23
+ height: 460px;
24
+ padding: 32px;
25
+ }
26
+ .cardStyles {
27
+ width: 100%;
28
+ display: flex;
29
+ align-items: center;
30
+ justify-content: center;
31
+ height: 460px;
32
+ border-radius: 32px 0px 0px 32px !important;
33
+ }
34
+ .cardTag {
35
+ width: 75px;
36
+ height: 30px;
37
+ flex-grow: 0;
38
+ display: flex;
39
+ flex-direction: row;
40
+ justify-content: flex-start;
41
+ align-items: center;
42
+ gap: 6px;
43
+ padding: 0 24px;
44
+ border-radius: 16px;
45
+ border: solid 1px #313131;
46
+ background-color: #fff;
47
+ }
48
+ .Grundriss {
49
+ width: 120px;
50
+ height: 30px;
51
+ flex-grow: 0;
52
+ display: flex;
53
+ flex-direction: row;
54
+ justify-content: center;
55
+ align-items: center;
56
+ gap: 10px;
57
+ font-size: 14px;
58
+ border-radius: 16px;
59
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
60
+ background: linear-gradient(to top, #000, #666);
61
+ }
62
+ .Frame-136 {
63
+ height: 119px;
64
+ align-self: stretch;
65
+ flex-grow: 0;
66
+ display: flex;
67
+ flex-direction: row;
68
+ justify-content: flex-start;
69
+ align-items: center;
70
+ gap: 16px;
71
+ padding: 10px 16px;
72
+ border-radius: 16px;
73
+ border: solid 1px rgba(0, 0, 0, 0.1);
74
+ background-color: #fff;
75
+ }
76
+ .kontactbutton {
77
+ width: 180px;
78
+ height: 43px;
79
+ flex-grow: 0;
80
+ display: flex;
81
+ flex-direction: row;
82
+ justify-content: center;
83
+ align-items: center;
84
+ gap: 10px;
85
+ border-radius: 16px;
86
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
87
+ background: linear-gradient(to top, #000, #666);
88
+ }
89
+ .kontact-button-text {
90
+ flex-grow: 0;
91
+ font-family: Inter;
92
+ font-size: 16px;
93
+ font-weight: 500;
94
+ font-stretch: normal;
95
+ font-style: normal;
96
+ line-height: normal;
97
+ letter-spacing: normal;
98
+ text-align: center;
99
+ color: #fff;
100
+ }
101
+ .propertyTitle {
102
+ display: flex;
103
+ flex-grow: 0;
104
+ font-size: 24px;
105
+ font-weight: 580;
106
+ font-stretch: normal;
107
+ font-style: normal;
108
+ line-height: normal;
109
+ letter-spacing: normal;
110
+ text-align: start;
111
+ color: #313131;
112
+ }
113
+ .firstLabel {
114
+ width: 100px;
115
+ height: 25px;
116
+ gap: 6px;
117
+ border-radius: 16px;
118
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
119
+ border: solid 1px #031012 !important;
120
+ background-color: var(--main-yellow);
121
+ }
122
+
123
+ .secondLabel {
124
+ width: 85px;
125
+ height: 25px;
126
+ padding: 0 7px;
127
+ border-radius: 16px;
128
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
129
+ border: solid 1px #000;
130
+ background-color: #fff;
131
+ display: flex;
132
+ }
133
+
134
+ .thirdLabels {
135
+ width: 110px;
136
+ padding: 0 7px;
137
+ height: 25px;
138
+ border-radius: 16px;
139
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
140
+ border: solid 1px #000;
141
+ background-color: #fff;
142
+ display: flex;
143
+ }
144
+
145
+ .fourthLabels {
146
+ padding: 2px;
147
+
148
+ width: 100px;
149
+ height: 25px;
150
+ border-radius: 16px;
151
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
152
+ border: solid 1px #000;
153
+ background-color: #fff;
154
+ }
155
+
156
+ .layersVector {
157
+ width: 15.1px;
158
+ height: 16px;
159
+ }
160
+
161
+ .layersText {
162
+ font-size: 14px;
163
+ color: #1b1b1b;
164
+ }
165
+
166
+ .style-img {
167
+ object-fit: cover;
168
+ border-radius: 30px !important;
169
+ }
170
+
171
+ .Vector {
172
+ width: 12px;
173
+ height: 16.1px;
174
+ flex-grow: 0;
175
+ margin: 0.4px 6px 0.4px 0;
176
+ }
177
+
178
+ .customButton {
179
+ width: 262px;
180
+ height: 43px;
181
+ color: #000;
182
+ cursor: pointer;
183
+ border-color: #161410;
184
+ background-color: #181716;
185
+ box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
186
+ }
187
+ .button_text {
188
+ font-size: 16px;
189
+ font-weight: 500;
190
+ color: #1b1b1b;
191
+ }
192
+
193
+ .heartVector {
194
+ width: 23px;
195
+ height: 26.7px;
196
+ cursor: pointer;
197
+ }
198
+
199
+ .heartVector.liked {
200
+ fill: rgb(255, 255, 255) !important;
201
+ }
202
+ .locationTexts {
203
+ font-size: 14px;
204
+ color: #344041;
205
+ text-align: center;
206
+ }
207
+
208
+ .arrowVector {
209
+ width: 23px;
210
+ height: 23px;
211
+ flex-grow: 0;
212
+ object-fit: contain;
213
+ }
214
+
215
+ .Price {
216
+ font-size: 26px;
217
+ font-weight: 500;
218
+ font-stretch: normal;
219
+ font-style: normal;
220
+ line-height: normal;
221
+ letter-spacing: normal;
222
+ text-align: center;
223
+ color: #ffffff;
224
+ }
225
+
226
+ .details {
227
+ font-size: 14px;
228
+ text-align: center;
229
+ color: #344041;
230
+ }
231
+ .value {
232
+ font-size: 20px;
233
+ text-align: center;
234
+ font-weight: 500;
235
+ }
236
+
237
+ .class {
238
+ background-color: #1b1b1b;
239
+ }
240
+
241
+ .header {
242
+ height: 64px;
243
+ justify-content: center;
244
+ }
245
+
246
+ .rightConer {
247
+ width: 200px;
248
+ }
249
+ @media all and (min-width: 2560px) {
250
+ .header {
251
+ font-size: 38px;
252
+
253
+ display: flex;
254
+ }
255
+ .cardStyle {
256
+ gap: 0px;
257
+ width: 350px;
258
+ height: 300px;
259
+ /* margin-left: 250px; */
260
+ }
261
+ }
262
+ @media (max-width: 1399px) {
263
+ .header {
264
+ font-size: 38px;
265
+ align-self: center;
266
+ margin-left: 150px;
267
+ }
268
+ .cardStyle {
269
+ gap: 0px;
270
+ width: 350px;
271
+ height: 300px;
272
+ }
273
+ }
274
+
275
+ @media (max-width: 1199px) {
276
+ .header {
277
+ font-size: 38px;
278
+ }
279
+ .cardStyle {
280
+ width: 300px;
281
+ height: 250px;
282
+ }
283
+ }
284
+
285
+ @media (max-width: 575px) {
286
+ .detail {
287
+ font-size: 11px;
288
+ padding: 2px;
289
+ }
290
+ .Price {
291
+ font-size: 19px;
292
+ }
293
+ .header {
294
+ font-size: 28px;
295
+ }
296
+ .locationText {
297
+ font-size: 12px;
298
+ }
299
+ .customButton {
300
+ width: 200px !important;
301
+ }
302
+ .button_text {
303
+ font-size: 13px;
304
+ }
305
+ }
306
+
307
+ @media (max-width: 375px) {
308
+ .labelTopClass {
309
+ width: 105px !important;
310
+ }
311
+ .layersText {
312
+ font-size: 9px;
313
+ }
314
+ .firstLabel {
315
+ gap: 2px;
316
+ }
317
+ .layersVector {
318
+ width: 9px;
319
+ height: 10px;
320
+ gap: 0px;
321
+ }
322
+ .cardStyle {
323
+ width: 320px !important;
324
+ height: 220px !important;
325
+ }
326
+ .header {
327
+ font-size: 24px;
328
+ }
329
+ .detail {
330
+ font-size: 10px;
331
+ padding: 2px;
332
+ }
333
+ .Price {
334
+ font-size: 18px;
335
+ }
336
+ .locationText {
337
+ font-size: 10px;
338
+ }
339
+ .Vector {
340
+ width: 8px;
341
+ height: 16px;
342
+ margin: 0px 2px 0.4px;
343
+ }
344
+ }
345
+
346
+ @media (max-width: 280px) {
347
+ .cardStyle {
348
+ width: 260px !important;
349
+ height: 160px !important;
350
+ }
351
+ .detail {
352
+ margin-bottom: 5px;
353
+ font-size: 0.6ch;
354
+ }
355
+ .Price {
356
+ font-size: 9px;
357
+ }
358
+ .locationText {
359
+ font-size: 6px;
360
+ }
361
+ .Vector {
362
+ width: 7px;
363
+ height: 10px;
364
+ margin: 0px 2px 4px;
365
+ }
366
+ .heartVector {
367
+ width: 15px;
368
+ height: 20px;
369
+ }
370
+ }