@nok-integration/storefront-react 0.29.8 → 0.29.11

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.
@@ -4684,20 +4684,20 @@
4684
4684
  display: block;
4685
4685
  }
4686
4686
  }
4687
- ._hero_dctyt_1 {
4687
+ ._hero_15sq4_1 {
4688
4688
  position: relative;
4689
4689
  display: flex;
4690
4690
  flex-direction: column;
4691
4691
  justify-content: flex-end;
4692
- min-height: clamp(480px, calc(100svh - var(--vip-hero-top, 0px)), 812px);
4692
+ min-height: max(480px, calc(100svh - var(--vip-hero-top, 0px)));
4693
4693
  overflow: hidden;
4694
4694
  background: var(--color-surface-default);
4695
4695
  }
4696
- ._image_dctyt_11 {
4696
+ ._image_15sq4_11 {
4697
4697
  position: absolute;
4698
4698
  inset: 0;
4699
4699
  }
4700
- ._image_dctyt_11::after {
4700
+ ._image_15sq4_11::after {
4701
4701
  content: "";
4702
4702
  position: absolute;
4703
4703
  inset: 0;
@@ -4709,27 +4709,27 @@
4709
4709
  rgba(8, 14, 18, 0) 382px);
4710
4710
  pointer-events: none;
4711
4711
  }
4712
- ._image_dctyt_11 img {
4712
+ ._image_15sq4_11 img {
4713
4713
  object-fit: cover;
4714
4714
  object-position: top center;
4715
4715
  }
4716
- ._foot_dctyt_34 {
4716
+ ._foot_15sq4_34 {
4717
4717
  position: relative;
4718
4718
  display: flex;
4719
4719
  flex-direction: column;
4720
4720
  }
4721
- ._text_dctyt_40 {
4721
+ ._text_15sq4_40 {
4722
4722
  display: flex;
4723
4723
  flex-direction: column;
4724
4724
  align-items: center;
4725
4725
  gap: var(--space-16);
4726
4726
  padding: 0 var(--space-16) var(--space-8);
4727
4727
  }
4728
- ._text_dctyt_40 ._logo_dctyt_48 {
4728
+ ._text_15sq4_40 ._logo_15sq4_48 {
4729
4729
  width: 48px;
4730
4730
  height: 48px;
4731
4731
  }
4732
- ._copy_dctyt_53 {
4732
+ ._copy_15sq4_53 {
4733
4733
  display: flex;
4734
4734
  flex-direction: column;
4735
4735
  gap: 6px;
@@ -4737,14 +4737,14 @@
4737
4737
  text-align: center;
4738
4738
  overflow-wrap: break-word;
4739
4739
  }
4740
- ._headline_dctyt_62 {
4740
+ ._headline_15sq4_62 {
4741
4741
  margin: 0;
4742
4742
  font-size: 36px;
4743
4743
  line-height: 1.1;
4744
4744
  font-weight: var(--font-weight-bold);
4745
4745
  color: var(--color-text-default);
4746
4746
  }
4747
- ._body_dctyt_70 {
4747
+ ._body_15sq4_70 {
4748
4748
  margin: 0;
4749
4749
  font-size: var(--type-paragraph-size);
4750
4750
  line-height: var(--type-paragraph-line);
@@ -4752,69 +4752,69 @@
4752
4752
  color: var(--color-text-default);
4753
4753
  white-space: pre-line;
4754
4754
  }
4755
- ._cta_dctyt_79 {
4755
+ ._cta_15sq4_79 {
4756
4756
  padding: var(--space-16) var(--space-16) var(--space-24);
4757
4757
  }
4758
- ._video_dctyt_83 {
4758
+ ._video_15sq4_83 {
4759
4759
  object-fit: cover;
4760
4760
  }
4761
- ._desktopOnly_dctyt_87 {
4761
+ ._desktopOnly_15sq4_87 {
4762
4762
  display: none;
4763
4763
  }
4764
4764
  @media (min-width: 1200px) {
4765
- ._hero_dctyt_1 {
4765
+ ._hero_15sq4_1 {
4766
4766
  justify-content: center;
4767
4767
  min-height: max(480px, calc(100svh - var(--vip-hero-top, 0px)));
4768
4768
  }
4769
- ._phoneOnly_dctyt_97 {
4769
+ ._phoneOnly_15sq4_97 {
4770
4770
  display: none;
4771
4771
  }
4772
- ._desktopOnly_dctyt_87 {
4772
+ ._desktopOnly_15sq4_87 {
4773
4773
  display: block;
4774
4774
  }
4775
- ._image_dctyt_11::after {
4775
+ ._image_15sq4_11::after {
4776
4776
  background:
4777
4777
  linear-gradient(
4778
4778
  to right,
4779
4779
  rgba(8, 14, 18, 0.9) 0,
4780
4780
  rgba(8, 14, 18, 0) 53.33%);
4781
4781
  }
4782
- ._image_dctyt_11 img,
4783
- ._video_dctyt_83 {
4782
+ ._image_15sq4_11 img,
4783
+ ._video_15sq4_83 {
4784
4784
  object-position: center;
4785
4785
  }
4786
- ._foot_dctyt_34 {
4786
+ ._foot_15sq4_34 {
4787
4787
  gap: var(--space-16);
4788
4788
  width: 100%;
4789
4789
  max-width: 624px;
4790
4790
  padding-left: 64px;
4791
4791
  }
4792
- ._text_dctyt_40 {
4792
+ ._text_15sq4_40 {
4793
4793
  align-items: flex-start;
4794
4794
  padding: 0;
4795
4795
  }
4796
- ._text_dctyt_40 ._logo_dctyt_48 {
4796
+ ._text_15sq4_40 ._logo_15sq4_48 {
4797
4797
  display: none;
4798
4798
  }
4799
- ._copy_dctyt_53 {
4799
+ ._copy_15sq4_53 {
4800
4800
  gap: var(--space-16);
4801
4801
  text-align: left;
4802
4802
  }
4803
- ._headline_dctyt_62 {
4803
+ ._headline_15sq4_62 {
4804
4804
  font-size: 64px;
4805
4805
  line-height: 0.9375;
4806
4806
  letter-spacing: -0.64px;
4807
4807
  }
4808
- ._body_dctyt_70 {
4808
+ ._body_15sq4_70 {
4809
4809
  max-width: 520px;
4810
4810
  font-size: 20px;
4811
4811
  line-height: 1.4;
4812
4812
  white-space: normal;
4813
4813
  }
4814
- ._cta_dctyt_79 {
4814
+ ._cta_15sq4_79 {
4815
4815
  padding: var(--space-8) 0 0;
4816
4816
  }
4817
- ._cta_dctyt_79 > * {
4817
+ ._cta_15sq4_79 > * {
4818
4818
  width: auto;
4819
4819
  min-width: 173px;
4820
4820
  }
@@ -5370,124 +5370,6 @@
5370
5370
  opacity: 0.8;
5371
5371
  }
5372
5372
  }
5373
- ._header_r9jjq_14 {
5374
- position: sticky;
5375
- top: 0;
5376
- z-index: 40;
5377
- display: flex;
5378
- align-items: center;
5379
- justify-content: space-between;
5380
- height: var(--header-height);
5381
- padding: 0 var(--space-16);
5382
- background: #f9fafa;
5383
- color: #0c161c;
5384
- box-shadow: inset 0 -1px 0 #dddedf;
5385
- }
5386
- ._floating_r9jjq_39 {
5387
- position: sticky;
5388
- top: 0;
5389
- margin-bottom: calc(-1 * var(--header-height));
5390
- z-index: 5;
5391
- background: none;
5392
- color: #f9fafa;
5393
- transition: background-color 160ms ease;
5394
- box-shadow: none;
5395
- }
5396
- ._floating_r9jjq_39._scrolled_r9jjq_47 {
5397
- background: rgba(8, 14, 18, 0.6);
5398
- }
5399
- @media (prefers-reduced-motion: reduce) {
5400
- ._floating_r9jjq_39 {
5401
- transition: none;
5402
- }
5403
- }
5404
- ._title_r9jjq_121 {
5405
- flex: 0 0 auto;
5406
- width: 222px;
5407
- min-width: 0;
5408
- font-size: var(--type-caption-sm-size);
5409
- line-height: var(--type-caption-sm-line);
5410
- font-weight: var(--font-weight-bold);
5411
- color: inherit;
5412
- overflow: hidden;
5413
- text-overflow: ellipsis;
5414
- white-space: nowrap;
5415
- }
5416
- ._title_r9jjq_121._leading_r9jjq_134 {
5417
- flex: 1 1 auto;
5418
- width: auto;
5419
- margin-left: var(--space-16);
5420
- }
5421
- ._right_r9jjq_140 {
5422
- display: flex;
5423
- align-items: center;
5424
- gap: var(--space-16);
5425
- }
5426
- ._spacer_r9jjq_153 {
5427
- width: 24px;
5428
- height: 24px;
5429
- }
5430
- ._iconBtn_r9jjq_158 {
5431
- position: relative;
5432
- display: inline-flex;
5433
- align-items: center;
5434
- justify-content: center;
5435
- width: 24px;
5436
- height: 24px;
5437
- padding: 0;
5438
- border: none;
5439
- background: none;
5440
- color: inherit;
5441
- cursor: pointer;
5442
- text-decoration: none;
5443
- }
5444
- ._iconBtn_r9jjq_158::after {
5445
- content: "";
5446
- position: absolute;
5447
- inset: -10px;
5448
- }
5449
- ._menuBtn_r9jjq_185 {
5450
- width: 32px;
5451
- height: 32px;
5452
- }
5453
- ._menuBtn_r9jjq_185::after {
5454
- inset: -6px;
5455
- }
5456
- ._badge_r9jjq_194 {
5457
- position: absolute;
5458
- top: -6px;
5459
- left: 14px;
5460
- z-index: 1;
5461
- min-width: 16px;
5462
- height: 16px;
5463
- padding: 0 var(--space-4);
5464
- box-sizing: border-box;
5465
- display: inline-flex;
5466
- align-items: center;
5467
- justify-content: center;
5468
- border-radius: var(--radius-full);
5469
- background: #d12424;
5470
- color: #ffffff;
5471
- font-size: var(--type-trimmed-xs-size);
5472
- line-height: 1;
5473
- letter-spacing: 0.12px;
5474
- font-weight: var(--font-weight-bold);
5475
- font-variant-numeric: tabular-nums;
5476
- pointer-events: none;
5477
- }
5478
- ._closeSlot_r9jjq_221 {
5479
- flex: 0 0 auto;
5480
- width: 32px;
5481
- height: 32px;
5482
- }
5483
- ._closeSlot_r9jjq_221._iconBtn_r9jjq_158::after {
5484
- inset: -6px;
5485
- }
5486
- ._centred_r9jjq_236 {
5487
- flex: 1 1 auto;
5488
- width: auto;
5489
- text-align: center;
5490
- }
5491
5373
  ._overlay_y4mxb_5 {
5492
5374
  position: fixed;
5493
5375
  inset: 0;
@@ -5774,3 +5656,126 @@
5774
5656
  font-variant-numeric: tabular-nums;
5775
5657
  pointer-events: none;
5776
5658
  }
5659
+ ._header_iwoi3_14 {
5660
+ position: sticky;
5661
+ top: 0;
5662
+ z-index: 40;
5663
+ display: flex;
5664
+ align-items: center;
5665
+ justify-content: space-between;
5666
+ height: var(--header-height);
5667
+ padding: 0 var(--space-16);
5668
+ background: #f9fafa;
5669
+ color: #0c161c;
5670
+ box-shadow: inset 0 -1px 0 #dddedf;
5671
+ }
5672
+ ._floating_iwoi3_39 {
5673
+ position: sticky;
5674
+ top: 0;
5675
+ margin-bottom: calc(-1 * var(--header-height));
5676
+ z-index: 5;
5677
+ background: none;
5678
+ color: #f9fafa;
5679
+ transition: background-color 160ms ease;
5680
+ box-shadow: none;
5681
+ }
5682
+ ._floating_iwoi3_39._scrolled_iwoi3_47 {
5683
+ background: rgba(8, 14, 18, 0.6);
5684
+ }
5685
+ @media (prefers-reduced-motion: reduce) {
5686
+ ._floating_iwoi3_39 {
5687
+ transition: none;
5688
+ }
5689
+ }
5690
+ ._title_iwoi3_121 {
5691
+ flex: 0 0 auto;
5692
+ width: 222px;
5693
+ min-width: 0;
5694
+ font-size: var(--type-caption-sm-size);
5695
+ line-height: var(--type-caption-sm-line);
5696
+ font-weight: var(--font-weight-bold);
5697
+ color: inherit;
5698
+ overflow: hidden;
5699
+ text-overflow: ellipsis;
5700
+ white-space: nowrap;
5701
+ }
5702
+ ._title_iwoi3_121._leading_iwoi3_134 {
5703
+ flex: 1 1 auto;
5704
+ width: auto;
5705
+ margin-left: var(--space-16);
5706
+ }
5707
+ ._right_iwoi3_140 {
5708
+ display: flex;
5709
+ align-items: center;
5710
+ gap: var(--space-16);
5711
+ }
5712
+ ._spacer_iwoi3_153 {
5713
+ width: 24px;
5714
+ height: 24px;
5715
+ }
5716
+ ._iconBtn_iwoi3_158 {
5717
+ position: relative;
5718
+ display: inline-flex;
5719
+ align-items: center;
5720
+ justify-content: center;
5721
+ width: 24px;
5722
+ height: 24px;
5723
+ padding: 0;
5724
+ border: none;
5725
+ background: none;
5726
+ color: inherit;
5727
+ cursor: pointer;
5728
+ text-decoration: none;
5729
+ }
5730
+ ._iconBtn_iwoi3_158::after {
5731
+ content: "";
5732
+ position: absolute;
5733
+ inset: -10px;
5734
+ }
5735
+ ._menuBtn_iwoi3_185 {
5736
+ width: 32px;
5737
+ height: 32px;
5738
+ }
5739
+ ._menuBtn_iwoi3_185::after {
5740
+ inset: -6px;
5741
+ }
5742
+ ._badge_iwoi3_194 {
5743
+ position: absolute;
5744
+ top: -6px;
5745
+ left: 14px;
5746
+ z-index: 1;
5747
+ min-width: 16px;
5748
+ height: 16px;
5749
+ padding: 0 var(--space-4);
5750
+ box-sizing: border-box;
5751
+ display: inline-flex;
5752
+ align-items: center;
5753
+ justify-content: center;
5754
+ border-radius: var(--radius-full);
5755
+ background: #d12424;
5756
+ color: #ffffff;
5757
+ font-size: var(--type-trimmed-xs-size);
5758
+ line-height: 1;
5759
+ letter-spacing: 0.12px;
5760
+ font-weight: var(--font-weight-bold);
5761
+ font-variant-numeric: tabular-nums;
5762
+ pointer-events: none;
5763
+ }
5764
+ ._closeSlot_iwoi3_221 {
5765
+ flex: 0 0 auto;
5766
+ width: 32px;
5767
+ height: 32px;
5768
+ }
5769
+ ._closeSlot_iwoi3_221._iconBtn_iwoi3_158::after {
5770
+ inset: -6px;
5771
+ }
5772
+ ._centred_iwoi3_236 {
5773
+ flex: 1 1 auto;
5774
+ width: auto;
5775
+ text-align: center;
5776
+ }
5777
+ @media (min-width: 1200px) {
5778
+ ._narrowOnly_iwoi3_243 {
5779
+ display: none;
5780
+ }
5781
+ }