@digital-b2c/coreui-kit 0.20.0 → 0.21.1

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.css CHANGED
@@ -1010,6 +1010,50 @@ a:hover.Card_module_card {
1010
1010
  color: var(--color-lenscrafter-blue);
1011
1011
  }
1012
1012
 
1013
+ /* src/components/Modal/Modal.module.scss */
1014
+ .Modal_module_modal {
1015
+ position: fixed;
1016
+ top: 50%;
1017
+ left: 50%;
1018
+ transform: translate(-50%, -50%);
1019
+ margin: 0;
1020
+ border: none;
1021
+ padding: 0;
1022
+ width: 90vw;
1023
+ max-width: 1080px;
1024
+ background: transparent;
1025
+ overflow: hidden;
1026
+ }
1027
+ .Modal_module_modal::backdrop {
1028
+ background: rgba(0, 0, 0, 0.75);
1029
+ }
1030
+ .Modal_module_modal .Modal_module_inner {
1031
+ display: flex;
1032
+ flex-direction: column;
1033
+ gap: var(--spacing-md);
1034
+ padding: var(--spacing-md);
1035
+ background: var(--color-white);
1036
+ border-radius: 16px 16px 0 0;
1037
+ box-shadow: 0 4px 2px rgba(0, 0, 0, 0.25);
1038
+ }
1039
+ .Modal_module_modal .Modal_module_header {
1040
+ display: flex;
1041
+ justify-content: flex-end;
1042
+ }
1043
+ .Modal_module_modal .Modal_module_close {
1044
+ width: 44px;
1045
+ height: 44px;
1046
+ padding: 0;
1047
+ }
1048
+ @media (max-width: 768px) {
1049
+ .Modal_module_modal {
1050
+ width: 100vw;
1051
+ }
1052
+ .Modal_module_modal .Modal_module_inner {
1053
+ border-radius: 0;
1054
+ }
1055
+ }
1056
+
1013
1057
  /* src/components/Pagination/Pagination.module.scss */
1014
1058
  .Pagination_module_pagination {
1015
1059
  display: flex;
@@ -2567,6 +2611,74 @@ a:hover {
2567
2611
  background: var(--color-gradient-white);
2568
2612
  }
2569
2613
 
2614
+ /* src/widgets/CardCarousel/CardCarousel.module.scss */
2615
+ .CardCarousel_module_cardCarousel {
2616
+ background-color: var(--color-white);
2617
+ }
2618
+ .CardCarousel_module_cardCarousel .CardCarousel_module_header {
2619
+ display: flex;
2620
+ align-items: flex-end;
2621
+ justify-content: space-between;
2622
+ gap: var(--spacing-xl);
2623
+ margin-bottom: var(--spacing-xl);
2624
+ }
2625
+ .CardCarousel_module_cardCarousel .CardCarousel_module_texts {
2626
+ display: flex;
2627
+ flex-direction: column;
2628
+ gap: var(--spacing-sm);
2629
+ max-width: 900px;
2630
+ }
2631
+ .CardCarousel_module_cardCarousel .CardCarousel_module_texts h2 {
2632
+ color: var(--color-black);
2633
+ }
2634
+ .CardCarousel_module_cardCarousel .CardCarousel_module_texts .CardCarousel_module_subtitle {
2635
+ color: var(--color-gray);
2636
+ }
2637
+ .CardCarousel_module_cardCarousel .CardCarousel_module_pagination {
2638
+ flex-shrink: 0;
2639
+ }
2640
+ .CardCarousel_module_cardCarousel .CardCarousel_module_pagination > button:disabled {
2641
+ opacity: 0.3;
2642
+ cursor: default;
2643
+ }
2644
+ .CardCarousel_module_cardCarousel .CardCarousel_module_swiper .swiper-slide {
2645
+ width: calc((100% - 32px) / 2.5);
2646
+ height: auto;
2647
+ }
2648
+ .CardCarousel_module_cardCarousel .CardCarousel_module_video {
2649
+ display: block;
2650
+ width: 100%;
2651
+ aspect-ratio: 16/9;
2652
+ }
2653
+ .CardCarousel_module_cardCarousel .CardCarousel_module_footnote {
2654
+ margin-top: var(--spacing-xl);
2655
+ color: var(--color-gray);
2656
+ }
2657
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card {
2658
+ height: 100%;
2659
+ }
2660
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card > a,
2661
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card > button {
2662
+ margin-top: auto;
2663
+ }
2664
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card > div:empty {
2665
+ display: none;
2666
+ }
2667
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card.CardCarousel_module_locked > div {
2668
+ filter: blur(9.8px);
2669
+ pointer-events: none;
2670
+ user-select: none;
2671
+ }
2672
+ @media (max-width: 768px) {
2673
+ .CardCarousel_module_cardCarousel .CardCarousel_module_swiper .swiper-slide {
2674
+ width: 88%;
2675
+ }
2676
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card > a,
2677
+ .CardCarousel_module_cardCarousel .CardCarousel_module_card > button {
2678
+ width: 100%;
2679
+ }
2680
+ }
2681
+
2570
2682
  /* src/widgets/CardCollection/CardCollection.module.scss */
2571
2683
  .CardCollection_module_card-collection {
2572
2684
  display: block;
@@ -6665,56 +6777,6 @@ a:hover {
6665
6777
  .TextCenterWithMedia_module_playButton img {
6666
6778
  display: block;
6667
6779
  }
6668
- .TextCenterWithMedia_module_modal {
6669
- position: fixed;
6670
- top: 50%;
6671
- left: 50%;
6672
- transform: translate(-50%, -50%);
6673
- margin: 0;
6674
- border: none;
6675
- padding: 0;
6676
- width: 90vw;
6677
- max-width: 1080px;
6678
- background: transparent;
6679
- overflow: hidden;
6680
- }
6681
- .TextCenterWithMedia_module_modal::backdrop {
6682
- background: rgba(0, 0, 0, 0.75);
6683
- }
6684
- @media (max-width: 768px) {
6685
- .TextCenterWithMedia_module_modal {
6686
- width: 100vw;
6687
- }
6688
- }
6689
- .TextCenterWithMedia_module_modalInner {
6690
- display: flex;
6691
- flex-direction: column;
6692
- gap: var(--spacing-md);
6693
- padding: var(--spacing-md);
6694
- background: var(--color-white);
6695
- border-radius: 16px 16px 0 0;
6696
- box-shadow: 0 4px 2px rgba(0, 0, 0, 0.25);
6697
- }
6698
- @media (max-width: 768px) {
6699
- .TextCenterWithMedia_module_modalInner {
6700
- border-radius: 0;
6701
- }
6702
- }
6703
- .TextCenterWithMedia_module_modalHeader {
6704
- display: flex;
6705
- justify-content: flex-end;
6706
- }
6707
- .TextCenterWithMedia_module_closeButton {
6708
- display: flex;
6709
- align-items: center;
6710
- justify-content: center;
6711
- width: 44px;
6712
- height: 44px;
6713
- background: none;
6714
- border: none;
6715
- cursor: pointer;
6716
- padding: 0;
6717
- }
6718
6780
  .TextCenterWithMedia_module_video {
6719
6781
  display: block;
6720
6782
  width: 100%;