@qite/tide-booking-component 1.4.85 → 1.4.86
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/build/build-cjs/index.js +566 -286
- package/build/build-cjs/src/qsm/components/item-picker/index.d.ts +4 -4
- package/build/build-cjs/src/qsm/store/qsm-slice.d.ts +5 -5
- package/build/build-cjs/src/qsm/types.d.ts +4 -9
- package/build/build-cjs/src/search-results/components/item-picker/index.d.ts +2 -2
- package/build/build-cjs/src/search-results/store/search-results-slice.d.ts +5 -0
- package/build/build-cjs/src/shared/types.d.ts +2 -7
- package/build/build-esm/index.js +566 -286
- package/build/build-esm/src/qsm/components/item-picker/index.d.ts +4 -4
- package/build/build-esm/src/qsm/store/qsm-slice.d.ts +5 -5
- package/build/build-esm/src/qsm/types.d.ts +4 -9
- package/build/build-esm/src/search-results/components/item-picker/index.d.ts +2 -2
- package/build/build-esm/src/search-results/store/search-results-slice.d.ts +5 -0
- package/build/build-esm/src/shared/types.d.ts +2 -7
- package/package.json +2 -2
- package/src/content/features/content-page/content-page-self-contained.tsx +17 -17
- package/src/qsm/components/item-picker/index.tsx +10 -13
- package/src/qsm/components/travel-class-picker/index.tsx +3 -2
- package/src/qsm/components/travel-nationality-picker/index.tsx +3 -2
- package/src/qsm/components/travel-type-picker/index.tsx +3 -2
- package/src/qsm/store/qsm-slice.ts +5 -5
- package/src/qsm/types.ts +5 -10
- package/src/search-results/components/item-picker/index.tsx +2 -2
- package/src/search-results/components/search-results-container/flight-search-results.tsx +5 -5
- package/src/search-results/components/search-results-container/search-results-container.tsx +96 -4
- package/src/search-results/store/search-results-slice.ts +6 -0
- package/src/shared/components/flyin/accommodation-flyin.tsx +373 -157
- package/src/shared/types.ts +13 -7
- package/styles/components/_flyin.scss +187 -158
|
@@ -271,160 +271,171 @@
|
|
|
271
271
|
}
|
|
272
272
|
|
|
273
273
|
&-card {
|
|
274
|
-
// height: 522px;
|
|
275
|
-
width: 100%;
|
|
276
|
-
max-width: 315px;
|
|
277
|
-
min-width: 315px;
|
|
278
|
-
|
|
279
|
-
border-radius: 16px;
|
|
280
|
-
box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
|
|
281
274
|
display: flex;
|
|
282
275
|
flex-direction: column;
|
|
283
|
-
|
|
284
|
-
|
|
276
|
+
padding-bottom: 20px;
|
|
277
|
+
border-radius: 24px;
|
|
285
278
|
background: var(--tide-booking-white);
|
|
286
|
-
|
|
287
|
-
cursor: pointer;
|
|
288
|
-
|
|
289
|
-
@include mixins.media-sm {
|
|
290
|
-
max-width: 345px;
|
|
291
|
-
min-width: 345px;
|
|
292
|
-
}
|
|
293
|
-
|
|
294
|
-
&:hover {
|
|
295
|
-
.flyin__content-card-top {
|
|
296
|
-
background: var(--tide-booking-color-primary-fade);
|
|
297
|
-
}
|
|
298
|
-
|
|
299
|
-
.flyin__content-card-button {
|
|
300
|
-
// background: var(--tide-booking-color-primary);
|
|
301
|
-
color: var(--tide-booking-white);
|
|
302
|
-
|
|
303
|
-
.cta--select {
|
|
304
|
-
background: var(--tide-booking-cta-background-select-hover);
|
|
305
|
-
}
|
|
306
|
-
}
|
|
307
|
-
}
|
|
308
|
-
|
|
309
|
-
&--selected {
|
|
310
|
-
.flyin__content-card-top {
|
|
311
|
-
background: var(--tide-booking-color-primary-gradient);
|
|
312
|
-
border-bottom: none;
|
|
313
|
-
}
|
|
314
|
-
|
|
315
|
-
.flyin__content-card-top-price {
|
|
316
|
-
color: var(--tide-booking-white);
|
|
317
|
-
}
|
|
318
|
-
|
|
319
|
-
.flyin__content-card-top-tag {
|
|
320
|
-
color: var(--tide-booking-white);
|
|
321
|
-
}
|
|
322
|
-
|
|
323
|
-
.flyin__content-card-middle {
|
|
324
|
-
// border-left: 4px solid var(--tide-booking-color-primary);
|
|
325
|
-
// border-right: 4px solid var(--tide-booking-color-primary);
|
|
326
|
-
}
|
|
327
|
-
|
|
328
|
-
&:hover {
|
|
329
|
-
.flyin__content {
|
|
330
|
-
cursor: default;
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
.flyin__content-card-top {
|
|
334
|
-
background: var(--tide-booking-color-primary-gradient);
|
|
335
|
-
}
|
|
336
|
-
}
|
|
337
|
-
}
|
|
338
|
-
|
|
339
|
-
&-top {
|
|
340
|
-
min-height: 60px;
|
|
341
|
-
width: 100%;
|
|
342
|
-
background: var(--tide-booking-color-primary);
|
|
343
|
-
display: flex;
|
|
344
|
-
justify-content: space-between;
|
|
345
|
-
align-items: end;
|
|
346
|
-
padding: 0 15px 12px 15px;
|
|
347
|
-
background: var(--tide-booking-white);
|
|
348
|
-
transition: all 0.4s ease;
|
|
349
|
-
|
|
350
|
-
&-price {
|
|
351
|
-
font-size: 18px;
|
|
352
|
-
font-weight: 700;
|
|
353
|
-
color: var(--tide-booking-black);
|
|
354
|
-
|
|
355
|
-
&--decrease {
|
|
356
|
-
color: green;
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
&--increase {
|
|
360
|
-
color: red;
|
|
361
|
-
}
|
|
362
|
-
}
|
|
363
|
-
|
|
364
|
-
&-tag {
|
|
365
|
-
font-size: 24px;
|
|
366
|
-
color: var(--tide-booking-black);
|
|
367
|
-
/* color: variables.$white; */
|
|
368
|
-
font-weight: 700;
|
|
369
|
-
}
|
|
370
|
-
}
|
|
371
|
-
|
|
372
|
-
&-middle {
|
|
373
|
-
height: 430px;
|
|
374
|
-
background: var(--tide-booking-white);
|
|
375
|
-
transition: all 0.4s ease;
|
|
376
|
-
|
|
377
|
-
&-rows {
|
|
378
|
-
display: flex;
|
|
379
|
-
flex-direction: column;
|
|
380
|
-
gap: 10px;
|
|
381
|
-
padding: 15px 15px 0 15px;
|
|
382
|
-
max-height: 430px;
|
|
383
|
-
}
|
|
384
|
-
|
|
385
|
-
&-row {
|
|
386
|
-
display: flex;
|
|
387
|
-
justify-content: space-between;
|
|
388
|
-
align-items: center;
|
|
389
|
-
padding-bottom: 5px;
|
|
390
|
-
border-bottom: 1px dashed var(--tide-booking-color-primary-light);
|
|
391
|
-
|
|
392
|
-
&-left {
|
|
393
|
-
font-weight: 500;
|
|
394
|
-
color: var(--tide-booking-black);
|
|
395
|
-
}
|
|
396
|
-
|
|
397
|
-
&-right {
|
|
398
|
-
font-weight: 300;
|
|
399
|
-
}
|
|
400
|
-
}
|
|
401
|
-
}
|
|
402
|
-
|
|
403
|
-
&-bottom {
|
|
404
|
-
height: 30px;
|
|
405
|
-
background: var(--tide-booking-color-primary);
|
|
406
|
-
display: flex;
|
|
407
|
-
justify-content: center;
|
|
408
|
-
align-items: center;
|
|
409
|
-
color: var(--tide-booking-white);
|
|
410
|
-
font-size: 14px;
|
|
411
|
-
transition: all 0.4s ease;
|
|
412
|
-
}
|
|
413
|
-
|
|
414
|
-
&-button {
|
|
415
|
-
// border: 1.25px solid var(--tide-booking-color-primary);
|
|
416
|
-
border-radius: 3px;
|
|
417
|
-
display: flex;
|
|
418
|
-
justify-content: center;
|
|
419
|
-
align-items: center;
|
|
420
|
-
color: var(--tide-booking-color-primary);
|
|
421
|
-
padding: 15px;
|
|
422
|
-
cursor: pointer;
|
|
423
|
-
font-size: 14px;
|
|
424
|
-
transition: all 0.2s ease;
|
|
425
|
-
}
|
|
279
|
+
box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
|
|
426
280
|
}
|
|
427
281
|
|
|
282
|
+
// Slicing with image and usps,
|
|
283
|
+
// not available in the current API response.
|
|
284
|
+
// &-card {
|
|
285
|
+
// // height: 522px;
|
|
286
|
+
// width: 100%;
|
|
287
|
+
// max-width: 315px;
|
|
288
|
+
// min-width: 315px;
|
|
289
|
+
|
|
290
|
+
// border-radius: 16px;
|
|
291
|
+
// box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
|
|
292
|
+
// display: flex;
|
|
293
|
+
// flex-direction: column;
|
|
294
|
+
// justify-content: space-between;
|
|
295
|
+
// overflow: hidden;
|
|
296
|
+
// background: var(--tide-booking-white);
|
|
297
|
+
// transition: all 0.4s ease;
|
|
298
|
+
// cursor: pointer;
|
|
299
|
+
|
|
300
|
+
// @include mixins.media-sm {
|
|
301
|
+
// max-width: 345px;
|
|
302
|
+
// min-width: 345px;
|
|
303
|
+
// }
|
|
304
|
+
|
|
305
|
+
// &:hover {
|
|
306
|
+
// .flyin__content-card-top {
|
|
307
|
+
// background: var(--tide-booking-color-primary-fade);
|
|
308
|
+
// }
|
|
309
|
+
|
|
310
|
+
// .flyin__content-card-button {
|
|
311
|
+
// // background: var(--tide-booking-color-primary);
|
|
312
|
+
// color: var(--tide-booking-white);
|
|
313
|
+
|
|
314
|
+
// .cta--select {
|
|
315
|
+
// background: var(--tide-booking-cta-background-select-hover);
|
|
316
|
+
// }
|
|
317
|
+
// }
|
|
318
|
+
// }
|
|
319
|
+
|
|
320
|
+
// &--selected {
|
|
321
|
+
// .flyin__content-card-top {
|
|
322
|
+
// background: var(--tide-booking-color-primary-gradient);
|
|
323
|
+
// border-bottom: none;
|
|
324
|
+
// }
|
|
325
|
+
|
|
326
|
+
// .flyin__content-card-top-price {
|
|
327
|
+
// color: var(--tide-booking-white);
|
|
328
|
+
// }
|
|
329
|
+
|
|
330
|
+
// .flyin__content-card-top-tag {
|
|
331
|
+
// color: var(--tide-booking-white);
|
|
332
|
+
// }
|
|
333
|
+
|
|
334
|
+
// .flyin__content-card-middle {
|
|
335
|
+
// // border-left: 4px solid var(--tide-booking-color-primary);
|
|
336
|
+
// // border-right: 4px solid var(--tide-booking-color-primary);
|
|
337
|
+
// }
|
|
338
|
+
|
|
339
|
+
// &:hover {
|
|
340
|
+
// .flyin__content {
|
|
341
|
+
// cursor: default;
|
|
342
|
+
// }
|
|
343
|
+
|
|
344
|
+
// .flyin__content-card-top {
|
|
345
|
+
// background: var(--tide-booking-color-primary-gradient);
|
|
346
|
+
// }
|
|
347
|
+
// }
|
|
348
|
+
// }
|
|
349
|
+
|
|
350
|
+
// &-top {
|
|
351
|
+
// min-height: 60px;
|
|
352
|
+
// width: 100%;
|
|
353
|
+
// background: var(--tide-booking-color-primary);
|
|
354
|
+
// display: flex;
|
|
355
|
+
// justify-content: space-between;
|
|
356
|
+
// align-items: end;
|
|
357
|
+
// padding: 0 15px 12px 15px;
|
|
358
|
+
// background: var(--tide-booking-white);
|
|
359
|
+
// transition: all 0.4s ease;
|
|
360
|
+
|
|
361
|
+
// &-price {
|
|
362
|
+
// font-size: 18px;
|
|
363
|
+
// font-weight: 700;
|
|
364
|
+
// color: var(--tide-booking-black);
|
|
365
|
+
|
|
366
|
+
// &--decrease {
|
|
367
|
+
// color: green;
|
|
368
|
+
// }
|
|
369
|
+
|
|
370
|
+
// &--increase {
|
|
371
|
+
// color: red;
|
|
372
|
+
// }
|
|
373
|
+
// }
|
|
374
|
+
|
|
375
|
+
// &-tag {
|
|
376
|
+
// font-size: 24px;
|
|
377
|
+
// color: var(--tide-booking-black);
|
|
378
|
+
// /* color: variables.$white; */
|
|
379
|
+
// font-weight: 700;
|
|
380
|
+
// }
|
|
381
|
+
// }
|
|
382
|
+
|
|
383
|
+
// &-middle {
|
|
384
|
+
// height: 430px;
|
|
385
|
+
// background: var(--tide-booking-white);
|
|
386
|
+
// transition: all 0.4s ease;
|
|
387
|
+
|
|
388
|
+
// &-rows {
|
|
389
|
+
// display: flex;
|
|
390
|
+
// flex-direction: column;
|
|
391
|
+
// gap: 10px;
|
|
392
|
+
// padding: 15px 15px 0 15px;
|
|
393
|
+
// max-height: 430px;
|
|
394
|
+
// }
|
|
395
|
+
|
|
396
|
+
// &-row {
|
|
397
|
+
// display: flex;
|
|
398
|
+
// justify-content: space-between;
|
|
399
|
+
// align-items: center;
|
|
400
|
+
// padding-bottom: 5px;
|
|
401
|
+
// border-bottom: 1px dashed var(--tide-booking-color-primary-light);
|
|
402
|
+
|
|
403
|
+
// &-left {
|
|
404
|
+
// font-weight: 500;
|
|
405
|
+
// color: var(--tide-booking-black);
|
|
406
|
+
// }
|
|
407
|
+
|
|
408
|
+
// &-right {
|
|
409
|
+
// font-weight: 300;
|
|
410
|
+
// }
|
|
411
|
+
// }
|
|
412
|
+
// }
|
|
413
|
+
|
|
414
|
+
// &-bottom {
|
|
415
|
+
// height: 30px;
|
|
416
|
+
// background: var(--tide-booking-color-primary);
|
|
417
|
+
// display: flex;
|
|
418
|
+
// justify-content: center;
|
|
419
|
+
// align-items: center;
|
|
420
|
+
// color: var(--tide-booking-white);
|
|
421
|
+
// font-size: 14px;
|
|
422
|
+
// transition: all 0.4s ease;
|
|
423
|
+
// }
|
|
424
|
+
|
|
425
|
+
// &-button {
|
|
426
|
+
// // border: 1.25px solid var(--tide-booking-color-primary);
|
|
427
|
+
// border-radius: 3px;
|
|
428
|
+
// display: flex;
|
|
429
|
+
// justify-content: center;
|
|
430
|
+
// align-items: center;
|
|
431
|
+
// color: var(--tide-booking-color-primary);
|
|
432
|
+
// padding: 15px;
|
|
433
|
+
// cursor: pointer;
|
|
434
|
+
// font-size: 14px;
|
|
435
|
+
// transition: all 0.2s ease;
|
|
436
|
+
// }
|
|
437
|
+
// }
|
|
438
|
+
|
|
428
439
|
&-data {
|
|
429
440
|
display: flex;
|
|
430
441
|
flex-direction: column;
|
|
@@ -579,6 +590,7 @@
|
|
|
579
590
|
|
|
580
591
|
&__acco {
|
|
581
592
|
padding-bottom: 30px;
|
|
593
|
+
|
|
582
594
|
&__cards {
|
|
583
595
|
display: grid;
|
|
584
596
|
grid-template-columns: repeat(1, 1fr);
|
|
@@ -635,20 +647,28 @@
|
|
|
635
647
|
font-weight: var(--tide-booking-search-hotel-card-price-font-weight);
|
|
636
648
|
color: var(--tide-booking-search-hotel-card-price-color);
|
|
637
649
|
font-size: 20px;
|
|
638
|
-
|
|
650
|
+
white-space: nowrap;
|
|
651
|
+
|
|
652
|
+
// &__wrapper {
|
|
653
|
+
// position: absolute;
|
|
654
|
+
// bottom: 0px;
|
|
655
|
+
// right: 0px;
|
|
656
|
+
// background: var(--tide-booking-search-hotel-card-price-background-color);
|
|
657
|
+
// display: flex;
|
|
658
|
+
// flex-flow: column nowrap;
|
|
659
|
+
// align-items: center;
|
|
660
|
+
// justify-content: center;
|
|
661
|
+
// gap: 5px;
|
|
662
|
+
// padding: 5px 20px;
|
|
663
|
+
// border-radius: 5px 0 0 0;
|
|
664
|
+
// box-shadow: var(--tide-booking-search-hotel-card-price-box-shadow);
|
|
665
|
+
// }
|
|
639
666
|
&__wrapper {
|
|
640
|
-
position: absolute;
|
|
641
|
-
bottom: 0px;
|
|
642
|
-
right: 0px;
|
|
643
|
-
background: var(--tide-booking-search-hotel-card-price-background-color);
|
|
644
667
|
display: flex;
|
|
645
668
|
flex-flow: column nowrap;
|
|
646
669
|
align-items: center;
|
|
647
670
|
justify-content: center;
|
|
648
671
|
gap: 5px;
|
|
649
|
-
padding: 5px 20px;
|
|
650
|
-
border-radius: 5px 0 0 0;
|
|
651
|
-
box-shadow: var(--tide-booking-search-hotel-card-price-box-shadow);
|
|
652
672
|
}
|
|
653
673
|
|
|
654
674
|
&__label {
|
|
@@ -667,7 +687,7 @@
|
|
|
667
687
|
}
|
|
668
688
|
|
|
669
689
|
&__content {
|
|
670
|
-
padding: 0px 20px;
|
|
690
|
+
padding: 20px 20px 0px 20px;
|
|
671
691
|
display: flex;
|
|
672
692
|
flex-direction: column;
|
|
673
693
|
justify-content: space-between;
|
|
@@ -680,6 +700,11 @@
|
|
|
680
700
|
display: flex;
|
|
681
701
|
flex-direction: column;
|
|
682
702
|
gap: 10px;
|
|
703
|
+
|
|
704
|
+
&__actions {
|
|
705
|
+
display: flex;
|
|
706
|
+
gap: 15px;
|
|
707
|
+
}
|
|
683
708
|
}
|
|
684
709
|
|
|
685
710
|
.dropdown {
|
|
@@ -693,6 +718,10 @@
|
|
|
693
718
|
content: '';
|
|
694
719
|
display: none;
|
|
695
720
|
}
|
|
721
|
+
|
|
722
|
+
&__input {
|
|
723
|
+
gap: 0;
|
|
724
|
+
}
|
|
696
725
|
}
|
|
697
726
|
}
|
|
698
727
|
}
|