@ptcwebops/ptcw-design 6.2.20 → 6.2.21

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 (103) hide show
  1. package/dist/cjs/event-jumbotron-example_15.cjs.entry.js +5 -3
  2. package/dist/cjs/event-podcast-slider-example.cjs.entry.js +34 -50
  3. package/dist/cjs/featured-list.cjs.entry.js +1 -1
  4. package/dist/cjs/innovator-toggle-container.cjs.entry.js +1 -1
  5. package/dist/cjs/ptc-bio-card.cjs.entry.js +1 -1
  6. package/dist/cjs/ptc-card_2.cjs.entry.js +6 -1
  7. package/dist/cjs/ptc-case-studies-slider.cjs.entry.js +1 -1
  8. package/dist/cjs/ptc-featured-list.cjs.entry.js +1 -1
  9. package/dist/cjs/ptc-filter-level-theater.cjs.entry.js +1 -1
  10. package/dist/cjs/ptc-icon-component.cjs.entry.js +39 -2
  11. package/dist/cjs/ptc-jumbotron.cjs.entry.js +1 -1
  12. package/dist/cjs/ptc-podcast-card.cjs.entry.js +1 -1
  13. package/dist/cjs/ptc-product-card.cjs.entry.js +1 -1
  14. package/dist/cjs/ptc-product-category.cjs.entry.js +1 -1
  15. package/dist/cjs/ptc-product-highlight-card.cjs.entry.js +1 -1
  16. package/dist/cjs/ptc-readmore-char.cjs.entry.js +1 -1
  17. package/dist/cjs/ptc-readmore-v3.cjs.entry.js +1 -1
  18. package/dist/cjs/ptc-tooltip-v2.cjs.entry.js +1 -1
  19. package/dist/cjs/ptc-value-led-speed-bump.cjs.entry.js +1 -1
  20. package/dist/cjs/ptc-white-paper.cjs.entry.js +1 -1
  21. package/dist/collection/components/innovator-toggle-container/innovator-toggle-container.css +12 -5
  22. package/dist/collection/components/organism-bundles/bundle-featured-list/featured-list.css +9 -2
  23. package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.css +25 -3
  24. package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.js +3 -1
  25. package/dist/collection/components/organism-bundles/event-podcast-slider-example/event-podcast-slider-example.js +34 -50
  26. package/dist/collection/components/ptc-bio-card/ptc-bio-card.css +12 -5
  27. package/dist/collection/components/ptc-case-studies-slider/ptc-case-studies-slider.css +12 -5
  28. package/dist/collection/components/ptc-featured-list/ptc-featured-list.css +12 -5
  29. package/dist/collection/components/ptc-filter-level-theater/ptc-filter-level-theater.css +12 -5
  30. package/dist/collection/components/ptc-icon-component/ptc-icon-component.css +12 -0
  31. package/dist/collection/components/ptc-icon-component/ptc-icon-component.js +38 -1
  32. package/dist/collection/components/ptc-jumbotron/ptc-jumbotron.css +12 -5
  33. package/dist/collection/components/ptc-modal/ptc-modal.css +13 -2
  34. package/dist/collection/components/ptc-podcast-card/ptc-podcast-card.css +12 -5
  35. package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.css +68 -0
  36. package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.js +5 -0
  37. package/dist/collection/components/ptc-product-card/ptc-product-card.css +12 -5
  38. package/dist/collection/components/ptc-product-category/ptc-product-category.css +12 -5
  39. package/dist/collection/components/ptc-product-highlight-card/ptc-product-highlight-card.css +12 -5
  40. package/dist/collection/components/ptc-readmore-char/ptc-readmore-char.css +12 -5
  41. package/dist/collection/components/ptc-readmore-v3/ptc-readmore-v3.css +12 -5
  42. package/dist/collection/components/ptc-tooltip-v2/ptc-tooltip-v2.css +12 -5
  43. package/dist/collection/components/ptc-value-led-speed-bump/ptc-value-led-speed-bump.css +12 -5
  44. package/dist/collection/components/ptc-white-paper/ptc-white-paper.css +12 -5
  45. package/dist/custom-elements/index.js +100 -72
  46. package/dist/esm/event-jumbotron-example_15.entry.js +5 -3
  47. package/dist/esm/event-podcast-slider-example.entry.js +34 -50
  48. package/dist/esm/featured-list.entry.js +1 -1
  49. package/dist/esm/innovator-toggle-container.entry.js +1 -1
  50. package/dist/esm/ptc-bio-card.entry.js +1 -1
  51. package/dist/esm/ptc-card_2.entry.js +6 -1
  52. package/dist/esm/ptc-case-studies-slider.entry.js +1 -1
  53. package/dist/esm/ptc-featured-list.entry.js +1 -1
  54. package/dist/esm/ptc-filter-level-theater.entry.js +1 -1
  55. package/dist/esm/ptc-icon-component.entry.js +39 -2
  56. package/dist/esm/ptc-jumbotron.entry.js +1 -1
  57. package/dist/esm/ptc-podcast-card.entry.js +1 -1
  58. package/dist/esm/ptc-product-card.entry.js +1 -1
  59. package/dist/esm/ptc-product-category.entry.js +1 -1
  60. package/dist/esm/ptc-product-highlight-card.entry.js +1 -1
  61. package/dist/esm/ptc-readmore-char.entry.js +1 -1
  62. package/dist/esm/ptc-readmore-v3.entry.js +1 -1
  63. package/dist/esm/ptc-tooltip-v2.entry.js +1 -1
  64. package/dist/esm/ptc-value-led-speed-bump.entry.js +1 -1
  65. package/dist/esm/ptc-white-paper.entry.js +1 -1
  66. package/dist/ptcw-design/p-0cf5bc9e.entry.js +1 -0
  67. package/dist/ptcw-design/{p-1cff585f.entry.js → p-12e61bb5.entry.js} +1 -1
  68. package/dist/ptcw-design/p-17c3f01a.entry.js +1 -0
  69. package/dist/ptcw-design/p-1a0bf166.entry.js +1 -0
  70. package/dist/ptcw-design/{p-a3a04f4e.entry.js → p-25178331.entry.js} +1 -1
  71. package/dist/ptcw-design/p-2f7ea1a6.entry.js +1 -0
  72. package/dist/ptcw-design/p-398d2ca5.entry.js +1 -0
  73. package/dist/ptcw-design/p-426715a4.entry.js +1 -0
  74. package/dist/ptcw-design/{p-dc488936.entry.js → p-58bb25e6.entry.js} +1 -1
  75. package/dist/ptcw-design/p-5feaea80.entry.js +1 -0
  76. package/dist/ptcw-design/p-759f6457.entry.js +1 -0
  77. package/dist/ptcw-design/{p-d3e5b65c.entry.js → p-815848f6.entry.js} +1 -1
  78. package/dist/ptcw-design/p-885b3428.entry.js +1 -0
  79. package/dist/ptcw-design/p-a114198f.entry.js +1 -0
  80. package/dist/ptcw-design/{p-7eda2750.entry.js → p-a8f30586.entry.js} +1 -1
  81. package/dist/ptcw-design/{p-fce2bd81.entry.js → p-b59f30d5.entry.js} +1 -1
  82. package/dist/ptcw-design/p-dc54b2b0.entry.js +1 -0
  83. package/dist/ptcw-design/p-e4b034b9.entry.js +1 -0
  84. package/dist/ptcw-design/{p-48183365.entry.js → p-e9cb2483.entry.js} +1 -1
  85. package/dist/ptcw-design/p-fd8f2c86.entry.js +1 -0
  86. package/dist/ptcw-design/ptcw-design.css +1 -1
  87. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  88. package/dist/types/components/ptc-icon-component/ptc-icon-component.d.ts +5 -0
  89. package/package.json +1 -1
  90. package/readme.md +1 -1
  91. package/dist/ptcw-design/p-1022ad8b.entry.js +0 -1
  92. package/dist/ptcw-design/p-10623bac.entry.js +0 -1
  93. package/dist/ptcw-design/p-136a91bf.entry.js +0 -1
  94. package/dist/ptcw-design/p-1b7087e7.entry.js +0 -1
  95. package/dist/ptcw-design/p-3f71553e.entry.js +0 -1
  96. package/dist/ptcw-design/p-583608d9.entry.js +0 -1
  97. package/dist/ptcw-design/p-85c29073.entry.js +0 -1
  98. package/dist/ptcw-design/p-876aec1e.entry.js +0 -1
  99. package/dist/ptcw-design/p-8daf00ae.entry.js +0 -1
  100. package/dist/ptcw-design/p-d734b373.entry.js +0 -1
  101. package/dist/ptcw-design/p-dd73c4d1.entry.js +0 -1
  102. package/dist/ptcw-design/p-e9a7475b.entry.js +0 -1
  103. package/dist/ptcw-design/p-eb85c019.entry.js +0 -1
@@ -2,62 +2,46 @@ import { Host, h } from '@stencil/core';
2
2
  import Swiper, { Navigation, Pagination, Scrollbar, Mousewheel } from 'swiper';
3
3
  export class EventPodcastSliderExample {
4
4
  componentDidLoad() {
5
- const swiperContainer = this.el.querySelector('.swiper-container');
6
- const slides = swiperContainer.querySelectorAll('.swiper-slide');
5
+ //const swiperContainer = this.el.querySelector('.swiper-container');
6
+ //const slides = swiperContainer.querySelectorAll('.swiper-slide');
7
7
  // Define a desktop breakpoint
8
- const isDesktop = window.matchMedia('(min-width: 992px)').matches;
8
+ //const isDesktop = window.matchMedia('(min-width: 992px)').matches;
9
9
  setTimeout(() => {
10
10
  let list = this.el.querySelector('.event-slider-cards');
11
- if (!isDesktop || slides.length >= 4) {
12
- this.listSwp = new Swiper(list, {
13
- // Customize options here
14
- modules: [Navigation, Pagination, Scrollbar, Mousewheel],
15
- slidesPerView: 'auto',
16
- spaceBetween: 24,
17
- //centeredSlides: true,
18
- centeredSlidesBounds: true,
19
- initialSlide: 0,
20
- centerInsufficientSlides: false,
21
- freeMode: true,
22
- scrollbar: {
23
- el: this.swiperPaginationRef,
24
- draggable: true,
11
+ this.listSwp = new Swiper(list, {
12
+ // Customize options here
13
+ modules: [Navigation, Pagination, Scrollbar, Mousewheel],
14
+ slidesPerView: 'auto',
15
+ spaceBetween: 24,
16
+ //centeredSlides: true,
17
+ centeredSlidesBounds: true,
18
+ initialSlide: 0,
19
+ centerInsufficientSlides: false,
20
+ freeMode: true,
21
+ scrollbar: {
22
+ el: this.swiperPaginationRef,
23
+ draggable: true,
24
+ },
25
+ navigation: {
26
+ nextEl: this.swiperButtonNextRef,
27
+ prevEl: this.swiperButtonPrevRef,
28
+ },
29
+ mousewheel: {
30
+ forceToAxis: true,
31
+ sensitivity: 100,
32
+ },
33
+ breakpoints: {
34
+ 992: {
35
+ slidesPerView: 4,
25
36
  },
26
- navigation: {
27
- nextEl: this.swiperButtonNextRef,
28
- prevEl: this.swiperButtonPrevRef,
37
+ 1200: {
38
+ spaceBetween: 32,
29
39
  },
30
- mousewheel: {
31
- forceToAxis: true,
32
- sensitivity: 100,
40
+ 1400: {
41
+ spaceBetween: 40,
33
42
  },
34
- breakpoints: {
35
- 992: {
36
- slidesPerView: 4,
37
- },
38
- 1200: {
39
- spaceBetween: 32,
40
- },
41
- 1400: {
42
- spaceBetween: 40,
43
- },
44
- },
45
- });
46
- }
47
- else {
48
- const nextBtn = this.el.querySelector('.swiper-button-next');
49
- const prevBtn = this.el.querySelector('.swiper-button-prev');
50
- const scrollbar = this.el.querySelector('.swiper-scrollbar');
51
- if (nextBtn) {
52
- nextBtn.setAttribute('style', 'display: none;');
53
- }
54
- if (prevBtn) {
55
- prevBtn.setAttribute('style', 'display: none;');
56
- }
57
- if (scrollbar) {
58
- scrollbar.setAttribute('style', 'display: none;');
59
- }
60
- }
43
+ },
44
+ });
61
45
  }, 100);
62
46
  }
63
47
  render() {
@@ -82,20 +82,20 @@ a:focus-visible {
82
82
  border-radius: var(--ptc-border-radius-standard);
83
83
  }
84
84
 
85
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-plm-grey a.light-link {
85
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
86
86
  color: var(--color-blue-04);
87
87
  }
88
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-plm-grey a.light-link:visited {
88
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
89
89
  color: var(--color-blue-06);
90
90
  }
91
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
91
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
92
92
  transition: none;
93
93
  color: var(--color-blue-07);
94
94
  }
95
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
95
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
96
96
  color: var(--color-blue-05);
97
97
  }
98
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-plm-grey a.light-link.disabled {
98
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
99
99
  color: var(--color-gray-04) !important;
100
100
  cursor: not-allowed;
101
101
  }
@@ -144,6 +144,13 @@ a:focus-visible {
144
144
  color: var(--color-green-06);
145
145
  }
146
146
 
147
+ .vjs-social-share-links a {
148
+ color: var(--color-white);
149
+ }
150
+ .vjs-social-share-links a:hover {
151
+ color: var(--color-white);
152
+ }
153
+
147
154
  :host {
148
155
  display: block;
149
156
  color: var(--color-gray-10);
@@ -781,20 +781,20 @@ a:focus-visible {
781
781
  border-radius: var(--ptc-border-radius-standard);
782
782
  }
783
783
 
784
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-plm-grey a.light-link {
784
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
785
785
  color: var(--color-blue-04);
786
786
  }
787
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-plm-grey a.light-link:visited {
787
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
788
788
  color: var(--color-blue-06);
789
789
  }
790
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
790
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
791
791
  transition: none;
792
792
  color: var(--color-blue-07);
793
793
  }
794
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
794
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
795
795
  color: var(--color-blue-05);
796
796
  }
797
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-plm-grey a.light-link.disabled {
797
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
798
798
  color: var(--color-gray-04) !important;
799
799
  cursor: not-allowed;
800
800
  }
@@ -843,6 +843,13 @@ a:focus-visible {
843
843
  color: var(--color-green-06);
844
844
  }
845
845
 
846
+ .vjs-social-share-links a {
847
+ color: var(--color-white);
848
+ }
849
+ .vjs-social-share-links a:hover {
850
+ color: var(--color-white);
851
+ }
852
+
846
853
  :host {
847
854
  display: block;
848
855
  overflow: hidden;
@@ -82,20 +82,20 @@ a:focus-visible {
82
82
  border-radius: var(--ptc-border-radius-standard);
83
83
  }
84
84
 
85
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-plm-grey a.light-link {
85
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
86
86
  color: var(--color-blue-04);
87
87
  }
88
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-plm-grey a.light-link:visited {
88
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
89
89
  color: var(--color-blue-06);
90
90
  }
91
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
91
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
92
92
  transition: none;
93
93
  color: var(--color-blue-07);
94
94
  }
95
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
95
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
96
96
  color: var(--color-blue-05);
97
97
  }
98
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-plm-grey a.light-link.disabled {
98
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
99
99
  color: var(--color-gray-04) !important;
100
100
  cursor: not-allowed;
101
101
  }
@@ -144,6 +144,13 @@ a:focus-visible {
144
144
  color: var(--color-green-06);
145
145
  }
146
146
 
147
+ .vjs-social-share-links a {
148
+ color: var(--color-white);
149
+ }
150
+ .vjs-social-share-links a:hover {
151
+ color: var(--color-white);
152
+ }
153
+
147
154
  :host {
148
155
  display: block;
149
156
  box-sizing: border-box;
@@ -139,20 +139,20 @@ a:focus-visible {
139
139
  border-radius: var(--ptc-border-radius-standard);
140
140
  }
141
141
 
142
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-plm-grey a.light-link {
142
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
143
143
  color: var(--color-blue-04);
144
144
  }
145
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-plm-grey a.light-link:visited {
145
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
146
146
  color: var(--color-blue-06);
147
147
  }
148
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
148
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
149
149
  transition: none;
150
150
  color: var(--color-blue-07);
151
151
  }
152
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
152
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
153
153
  color: var(--color-blue-05);
154
154
  }
155
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-plm-grey a.light-link.disabled {
155
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
156
156
  color: var(--color-gray-04) !important;
157
157
  cursor: not-allowed;
158
158
  }
@@ -201,6 +201,13 @@ a:focus-visible {
201
201
  color: var(--color-green-06);
202
202
  }
203
203
 
204
+ .vjs-social-share-links a {
205
+ color: var(--color-white);
206
+ }
207
+ .vjs-social-share-links a:hover {
208
+ color: var(--color-white);
209
+ }
210
+
204
211
  :host {
205
212
  display: block;
206
213
  position: relative;
@@ -875,12 +875,20 @@ ptc-link, ptc-square-card,
875
875
  width: 44px;
876
876
  height: 44px;
877
877
  }
878
+ :host .swiper-container .swiper-button-next:focus-visible {
879
+ border-radius: var(--ptc-border-radius-standard);
880
+ outline: 5px solid var(--keyboard-nav-outline);
881
+ }
878
882
  :host .swiper-container .swiper-button-prev {
879
883
  left: 0;
880
884
  top: 84px;
881
885
  height: 44px;
882
886
  width: 44px;
883
887
  }
888
+ :host .swiper-container .swiper-button-prev:focus-visible {
889
+ border-radius: var(--ptc-border-radius-standard);
890
+ outline: 5px solid var(--keyboard-nav-outline);
891
+ }
884
892
  :host .ptc-link {
885
893
  font-size: var(--ptc-font-size-small);
886
894
  font-weight: var(--ptc-font-weight-extrabold);
@@ -895,6 +903,10 @@ ptc-link, ptc-square-card,
895
903
  :host .ptc-link:hover {
896
904
  color: var(--color-green-06);
897
905
  }
906
+ :host .ptc-link:focus-visible {
907
+ border-radius: var(--ptc-border-radius-standard);
908
+ outline: 5px solid var(--keyboard-nav-outline);
909
+ }
898
910
  :host .ptc-link:visited {
899
911
  color: var(--color-gray-10);
900
912
  }
@@ -15,11 +15,13 @@ export class PtcIconComponent {
15
15
  this.renderSlides();
16
16
  setTimeout(() => {
17
17
  this.initSlider();
18
+ this.setUpTabIndex();
18
19
  }, 200);
19
20
  }
20
21
  componentDidUpdate() {
21
22
  setTimeout(() => {
22
23
  this.initSlider();
24
+ this.setUpTabIndex();
23
25
  }, 200);
24
26
  }
25
27
  renderSlides() {
@@ -29,6 +31,7 @@ export class PtcIconComponent {
29
31
  slidesList.forEach((node) => {
30
32
  const slideElement = document.createElement('div');
31
33
  slideElement.classList.add('swiper-slide');
34
+ slideElement.querySelectorAll("a").forEach(item => item.tabIndex = -1);
32
35
  let cloneNode = node.cloneNode(true);
33
36
  slideElement.appendChild(cloneNode);
34
37
  swiperWrapper.appendChild(slideElement);
@@ -53,6 +56,10 @@ export class PtcIconComponent {
53
56
  nextEl: this.swiperButtonNextRef,
54
57
  prevEl: this.swiperButtonPrevRef,
55
58
  },
59
+ // keyboard: {
60
+ // enabled: true,
61
+ // onlyInViewport: true
62
+ // }
56
63
  });
57
64
  }
58
65
  }
@@ -71,8 +78,38 @@ export class PtcIconComponent {
71
78
  this.iconSwiper = null;
72
79
  }
73
80
  }
81
+ onNextBtnClick(e) {
82
+ let btn = e.currentTarget;
83
+ e.preventDefault();
84
+ if (btn && !btn.classList.contains('disabled')) {
85
+ this.iconSwiper.slideNext();
86
+ this.setUpTabIndex();
87
+ }
88
+ }
89
+ onPrevBtnClick(e) {
90
+ let btn = e.currentTarget;
91
+ e.preventDefault();
92
+ if (btn && !btn.classList.contains('disabled')) {
93
+ this.iconSwiper.slidePrev();
94
+ this.setUpTabIndex();
95
+ }
96
+ }
97
+ onPrevBtnKeydown(e) {
98
+ if (e.key === "Enter") {
99
+ this.onPrevBtnClick(e);
100
+ }
101
+ }
102
+ onNextBtnKeydown(e) {
103
+ if (e.key === "Enter") {
104
+ this.onNextBtnClick(e);
105
+ }
106
+ }
107
+ setUpTabIndex() {
108
+ this.iconSwiper.slides.forEach(i => i.querySelectorAll("a").forEach(item => item.tabIndex = -1));
109
+ this.iconSwiper.slides[this.iconSwiper.activeIndex].querySelectorAll("a").forEach(item => item.tabIndex = 0);
110
+ }
74
111
  render() {
75
- return (h(Host, { class: this.isMobile ? 'mobileView' : 'desktopView' }, h("div", { class: "icon-component-row" }, h("slot", null)), h("div", { class: "swiper-container", ref: el => this.swiperWrapperRef = el }, h("div", { class: "swiper-wrapper" }), h("div", { class: "swiper-pagination", ref: el => this.swiperPaginationRef = el }), h("div", { class: "swiper-button-next", ref: el => this.swiperButtonNextRef = el }, h("svg", { width: "20", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.75 17.25L8 10L0.75 2.75L3.375 0.125L13.25 10L3.375 19.875L0.75 17.25Z", fill: "#323B42" }))), h("div", { class: "swiper-button-prev", ref: el => this.swiperButtonPrevRef = el }, h("svg", { width: "20", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M13.25 2.75L6 10L13.25 17.25L10.625 19.875L0.749999 10L10.625 0.125L13.25 2.75Z", fill: "#323B42" }))))));
112
+ return (h(Host, { class: this.isMobile ? 'mobileView' : 'desktopView' }, h("div", { class: "icon-component-row" }, h("slot", null)), h("div", { class: "swiper-container", ref: el => this.swiperWrapperRef = el }, h("div", { class: "swiper-button-prev", ref: el => this.swiperButtonPrevRef = el, tabindex: 0, onClick: (e) => this.onPrevBtnClick(e), onKeyDown: (e) => this.onPrevBtnKeydown(e) }, h("svg", { width: "20", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M13.25 2.75L6 10L13.25 17.25L10.625 19.875L0.749999 10L10.625 0.125L13.25 2.75Z", fill: "#323B42" }))), h("div", { class: "swiper-button-next", ref: el => this.swiperButtonNextRef = el, tabindex: 0, onClick: (e) => this.onNextBtnClick(e), onKeyDown: (e) => this.onNextBtnKeydown(e) }, h("svg", { width: "20", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.75 17.25L8 10L0.75 2.75L3.375 0.125L13.25 10L3.375 19.875L0.75 17.25Z", fill: "#323B42" }))), h("div", { class: "swiper-wrapper" }), h("div", { class: "swiper-pagination", ref: el => this.swiperPaginationRef = el }))));
76
113
  }
77
114
  static get is() { return "ptc-icon-component"; }
78
115
  static get encapsulation() { return "shadow"; }
@@ -1178,20 +1178,20 @@ a:focus-visible {
1178
1178
  border-radius: var(--ptc-border-radius-standard);
1179
1179
  }
1180
1180
 
1181
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-plm-grey a.light-link {
1181
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
1182
1182
  color: var(--color-blue-04);
1183
1183
  }
1184
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-plm-grey a.light-link:visited {
1184
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
1185
1185
  color: var(--color-blue-06);
1186
1186
  }
1187
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
1187
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
1188
1188
  transition: none;
1189
1189
  color: var(--color-blue-07);
1190
1190
  }
1191
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
1191
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
1192
1192
  color: var(--color-blue-05);
1193
1193
  }
1194
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-plm-grey a.light-link.disabled {
1194
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
1195
1195
  color: var(--color-gray-04) !important;
1196
1196
  cursor: not-allowed;
1197
1197
  }
@@ -1240,6 +1240,13 @@ a:focus-visible {
1240
1240
  color: var(--color-green-06);
1241
1241
  }
1242
1242
 
1243
+ .vjs-social-share-links a {
1244
+ color: var(--color-white);
1245
+ }
1246
+ .vjs-social-share-links a:hover {
1247
+ color: var(--color-white);
1248
+ }
1249
+
1243
1250
  :host {
1244
1251
  display: block;
1245
1252
  }
@@ -425,6 +425,8 @@ ptc-link, ptc-square-card,
425
425
  transform: translateY(-100%);
426
426
  border-radius: var(--ptc-border-radius-standard) var(--ptc-border-radius-standard) 0px 0px;
427
427
  align-items: center;
428
+ padding: var(--ptc-element-spacing-06);
429
+ box-sizing: border-box;
428
430
  }
429
431
  :host .wrapper .event-list-header::before {
430
432
  content: "";
@@ -436,10 +438,19 @@ ptc-link, ptc-square-card,
436
438
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
437
439
  z-index: 1;
438
440
  }
441
+ :host .wrapper .event-list-header + .close {
442
+ margin-top: 0px;
443
+ margin-right: 0px;
444
+ width: 40px;
445
+ height: 40px;
446
+ display: flex;
447
+ justify-content: center;
448
+ align-items: center;
449
+ }
439
450
  :host .wrapper .event-list-header .text-wrapper {
440
451
  display: flex;
441
- padding: var(--ptc-element-spacing-06);
442
- gap: 0.5em;
452
+ flex-wrap: wrap;
453
+ column-gap: 0.5em;
443
454
  }
444
455
  :host .wrapper .event-list-header .text-wrapper span {
445
456
  display: inline-block;
@@ -5602,20 +5602,20 @@ a:focus-visible {
5602
5602
  border-radius: var(--ptc-border-radius-standard);
5603
5603
  }
5604
5604
 
5605
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a), .background-plm-grey a.light-link {
5605
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
5606
5606
  color: var(--color-blue-04);
5607
5607
  }
5608
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited, .background-plm-grey a.light-link:visited {
5608
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
5609
5609
  color: var(--color-blue-06);
5610
5610
  }
5611
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
5611
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
5612
5612
  transition: none;
5613
5613
  color: var(--color-blue-07);
5614
5614
  }
5615
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
5615
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
5616
5616
  color: var(--color-blue-05);
5617
5617
  }
5618
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a).disabled, .background-plm-grey a.light-link.disabled {
5618
+ .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
5619
5619
  color: var(--color-gray-04) !important;
5620
5620
  cursor: not-allowed;
5621
5621
  }
@@ -5664,6 +5664,13 @@ a:focus-visible {
5664
5664
  color: var(--color-green-06);
5665
5665
  }
5666
5666
 
5667
+ .vjs-social-share-links a {
5668
+ color: var(--color-white);
5669
+ }
5670
+ .vjs-social-share-links a:hover {
5671
+ color: var(--color-white);
5672
+ }
5673
+
5667
5674
  :host {
5668
5675
  display: block;
5669
5676
  padding: 2rem 0;
@@ -246,6 +246,11 @@ ptc-link, ptc-square-card,
246
246
  .skeleton-block.medium {
247
247
  width: 50%;
248
248
  }
249
+ @media only screen and (min-width: 992px) {
250
+ .skeleton-block.medium-md {
251
+ width: 50%;
252
+ }
253
+ }
249
254
  .skeleton-block.short {
250
255
  width: 30%;
251
256
  }
@@ -2683,6 +2688,69 @@ ptc-link, ptc-square-card,
2683
2688
  }
2684
2689
  }
2685
2690
 
2691
+ .news-skeleton-preloader .thick-on-mobile {
2692
+ height: 94px;
2693
+ }
2694
+ @media only screen and (min-width: 768px) {
2695
+ .news-skeleton-preloader .thick-on-mobile {
2696
+ height: 48px;
2697
+ }
2698
+ }
2699
+ .news-skeleton-preloader .big-block {
2700
+ height: 700px;
2701
+ }
2702
+ @media only screen and (min-width: 992px) {
2703
+ .news-skeleton-preloader .big-block {
2704
+ height: 547px;
2705
+ }
2706
+ }
2707
+ .news-skeleton-preloader .card-block {
2708
+ height: 500px;
2709
+ }
2710
+ .news-skeleton-preloader .big-card-block {
2711
+ height: calc(100% - 8px);
2712
+ display: none;
2713
+ }
2714
+ @media only screen and (min-width: 992px) {
2715
+ .news-skeleton-preloader .big-card-block {
2716
+ display: block;
2717
+ }
2718
+ }
2719
+
2720
+ .resource-center-skeleton-preloader .skeleton-jumbotron {
2721
+ background-color: var(--color-gray-02);
2722
+ padding-top: 24px;
2723
+ padding-bottom: 24px;
2724
+ margin-bottom: 24px;
2725
+ }
2726
+ @media only screen and (min-width: 992px) {
2727
+ .resource-center-skeleton-preloader .skeleton-jumbotron {
2728
+ background-color: var(--color-gray-01);
2729
+ padding-top: 106px;
2730
+ padding-bottom: 106px;
2731
+ }
2732
+ }
2733
+ @media only screen and (min-width: 768px) {
2734
+ .resource-center-skeleton-preloader .skeleton-jumbotron {
2735
+ margin-bottom: 48px;
2736
+ }
2737
+ }
2738
+ .resource-center-skeleton-preloader .jumbo-image-mobile {
2739
+ display: block;
2740
+ background-color: var(--color-gray-01);
2741
+ height: 300px;
2742
+ }
2743
+ @media only screen and (min-width: 992px) {
2744
+ .resource-center-skeleton-preloader .jumbo-image-mobile {
2745
+ display: none;
2746
+ }
2747
+ }
2748
+ .resource-center-skeleton-preloader .card-block {
2749
+ width: 100%;
2750
+ height: 347px;
2751
+ margin: 0;
2752
+ }
2753
+
2686
2754
  @keyframes pulse {
2687
2755
  0% {
2688
2756
  opacity: 0.5;
@@ -78,6 +78,11 @@ export class PtcPreloaderSection {
78
78
  case 'ppc-skeleton': {
79
79
  return (h("div", { class: "preloader-wrapper" }, h("div", { class: "ppc-skeleton-preloader" }, h("div", { class: "ptc-container " }, h("div", { class: "dots-loader" })))));
80
80
  }
81
+ case 'news': {
82
+ return (h("div", { class: "preloader-wrapper" }, h("div", { class: "news-skeleton-preloader" }, h("div", { class: "ptc-container ptc-section-standard" }, h("ptc-spacer", { breakpoint: "large", size: "medium" }), h("div", { class: "is-grid has-row-gap-md" }, h("div", { class: "is-col-6-lg skeleton-block thick thick-on-mobile" }), h("div", { class: "is-col-6-lg skeleton-block thick medium-md right" })), h("ptc-spacer", { size: "xxx-large" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block narrow thick center" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block short thin center" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block big-block" }), h("ptc-spacer", { size: "xxx-large" }), h("div", { class: "skeleton-block bold medium" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "is-grid has-row-gap-md has-col-gap-lg" }, h("div", { class: "is-col-8-lg" }, h("div", { class: "is-grid has-col-gap-lg" }, h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }))), h("div", { class: "is-col-4-lg skeleton-block big-card-block" })), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block cta thick center" }), h("ptc-spacer", { size: "xxx-large" }), h("div", { class: "skeleton-block bold medium" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "is-grid has-row-gap-md has-col-gap-lg" }, h("div", { class: "is-col-8-lg" }, h("div", { class: "is-grid has-col-gap-lg" }, h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }))), h("div", { class: "is-col-4-lg skeleton-block big-card-block" })), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block cta thick center" })))));
83
+ }
84
+ case 'resource-center':
85
+ return (h("div", { class: "preloader-wrapper resource-center-skeleton-preloader" }, h("div", { class: "skeleton jumbo-image-mobile" }), h("div", { class: "skeleton-jumbotron" }, h("div", { class: "ptc-container" }, h("div", { class: "is-grid has-no-row-gap has-col-gap-lg" }, h("div", { class: "is-col-12 is-col-8-lg" }, h("div", { class: "sekleton" }, h("div", { class: "skeleton-block thin short" }), h("div", { class: "skeleton-block thick" }), h("div", { class: "skeleton-block thick" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "cta-wrap" }, h("div", { class: "skeleton-block cta" }), h("div", { class: "skeleton-block cta" }))))))), h("div", { class: 'ptc-container' }, h("div", { class: "is-grid desktop-cards" }, h("div", { class: "is-col-12-xs is-col-3-lg" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin medium" }), h("div", { class: "skeleton-block bold long" }), h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block bold" }))), h("div", { class: "is-col-12-xs is-col-9-lg" }, h("div", { class: "is-grid" }, Array.from({ length: 15 }).map(() => (h("div", { class: "is-col-6-sm is-col-4-xl skeleton-block card-block" })))))))));
81
86
  default:
82
87
  return (h("div", { class: "ptc-section-standard preload-min-height" }, h("div", { class: "ptc-container" }, h("max-width-container", { "max-width": "960", breakpoint: 1200 }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-header" }, h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block wide bold" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block medium" }), h("div", { class: "skeleton-block narrow" }), h("div", { class: "skeleton-block short" })), h("div", { class: "skeleton-image" }), h("div", { class: "skeleton-text" }, h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block narrow" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block short bold" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" })))))));
83
88
  }