@ptcwebops/ptcw-design 6.2.27-beta → 6.2.29-beta

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 (124) hide show
  1. package/dist/cjs/{component-6a178a16.js → component-4dd13907.js} +1 -1
  2. package/dist/cjs/event-jumbotron-example_15.cjs.entry.js +1433 -0
  3. package/dist/cjs/event-podcast-slider-example.cjs.entry.js +54 -32
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/ptc-card-bottom.cjs.entry.js +67 -0
  6. package/dist/cjs/ptc-card_2.cjs.entry.js +9 -3
  7. package/dist/cjs/ptc-data-lookup.cjs.entry.js +1 -1
  8. package/dist/cjs/ptc-form-checkbox_4.cjs.entry.js +1 -1
  9. package/dist/cjs/ptc-icon-minimize.cjs.entry.js +2 -2
  10. package/dist/cjs/ptcw-design.cjs.js +1 -1
  11. package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.css +25 -3
  12. package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.js +3 -1
  13. package/dist/collection/components/organism-bundles/event-podcast-slider-example/event-podcast-slider-example.css +18 -15
  14. package/dist/collection/components/organism-bundles/event-podcast-slider-example/event-podcast-slider-example.js +53 -55
  15. package/dist/collection/components/ptc-card/ptc-card.css +1 -0
  16. package/dist/collection/components/ptc-icon-minimize/ptc-icon-minimize.css +8 -1
  17. package/dist/collection/components/ptc-icon-minimize/ptc-icon-minimize.js +1 -1
  18. package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.css +168 -21
  19. package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.js +7 -1
  20. package/dist/custom-elements/index.js +71 -41
  21. package/dist/esm/blog-detail-content_2.entry.js +1 -1
  22. package/dist/esm/blog-detail-layout.entry.js +1 -1
  23. package/dist/esm/blogs-search-section.entry.js +1 -1
  24. package/dist/esm/{component-80f298b4.js → component-9c921cc6.js} +1 -1
  25. package/dist/esm/event-jumbotron-example_15.entry.js +1415 -0
  26. package/dist/esm/event-podcast-slider-example.entry.js +54 -32
  27. package/dist/esm/homepage-jumbotron.entry.js +1 -1
  28. package/dist/esm/homepage-toggled-content.entry.js +1 -1
  29. package/dist/esm/loader.js +1 -1
  30. package/dist/esm/most-popular-news.entry.js +1 -1
  31. package/dist/esm/my-component.entry.js +1 -1
  32. package/dist/esm/ptc-accordion-item.entry.js +1 -1
  33. package/dist/esm/ptc-background-video.entry.js +1 -1
  34. package/dist/esm/ptc-card-bottom.entry.js +63 -0
  35. package/dist/esm/ptc-card_2.entry.js +9 -3
  36. package/dist/esm/ptc-collapse-list.entry.js +1 -1
  37. package/dist/esm/ptc-data-lookup.entry.js +1 -1
  38. package/dist/esm/ptc-form-checkbox_4.entry.js +2 -2
  39. package/dist/esm/ptc-homepage-image-feature.entry.js +1 -1
  40. package/dist/esm/ptc-homepage-video-background.entry.js +1 -1
  41. package/dist/esm/ptc-icon-card.entry.js +1 -1
  42. package/dist/esm/ptc-icon-minimize.entry.js +2 -2
  43. package/dist/esm/ptc-media-card.entry.js +1 -1
  44. package/dist/esm/ptc-pricing-packaging-table.entry.js +1 -1
  45. package/dist/esm/ptc-pricing-tabs.entry.js +1 -1
  46. package/dist/esm/ptc-social-icons-footer.entry.js +1 -1
  47. package/dist/esm/ptcw-design.js +1 -1
  48. package/dist/esm/{utils-63eab4bd.js → utils-ff65c75b.js} +1 -1
  49. package/dist/ptcw-design/{p-fc0348a7.entry.js → p-0fdfd4ad.entry.js} +1 -1
  50. package/dist/ptcw-design/p-11ee8673.entry.js +1 -0
  51. package/dist/ptcw-design/{p-c01ea76f.entry.js → p-1b257420.entry.js} +1 -1
  52. package/dist/ptcw-design/p-23d64153.entry.js +1 -0
  53. package/dist/ptcw-design/{p-4ee98a3e.entry.js → p-2c6fc745.entry.js} +1 -1
  54. package/dist/ptcw-design/{p-fd394e84.entry.js → p-36007a57.entry.js} +1 -1
  55. package/dist/ptcw-design/{p-cbee4653.entry.js → p-6d3326da.entry.js} +1 -1
  56. package/dist/ptcw-design/{p-6f5fecae.entry.js → p-7a9611b4.entry.js} +1 -1
  57. package/dist/ptcw-design/{p-eec2f3da.entry.js → p-808ec62a.entry.js} +1 -1
  58. package/dist/ptcw-design/{p-77b1221e.js → p-8872161f.js} +1 -1
  59. package/dist/ptcw-design/p-9fe0c27d.entry.js +1 -0
  60. package/dist/ptcw-design/{p-291072b4.entry.js → p-a3b57ede.entry.js} +1 -1
  61. package/dist/ptcw-design/{p-d361afd1.entry.js → p-a5c2584e.entry.js} +1 -1
  62. package/dist/ptcw-design/{p-17f6e145.entry.js → p-ae970a60.entry.js} +1 -1
  63. package/dist/ptcw-design/p-b436f56d.entry.js +1 -0
  64. package/dist/ptcw-design/{p-821f0ff9.entry.js → p-c37a3bd2.entry.js} +1 -1
  65. package/dist/ptcw-design/{p-d3229458.entry.js → p-c66b8926.entry.js} +1 -1
  66. package/dist/ptcw-design/{p-6a3caf2b.entry.js → p-c95f423e.entry.js} +1 -1
  67. package/dist/ptcw-design/{p-627103d8.entry.js → p-d10cb999.entry.js} +1 -1
  68. package/dist/ptcw-design/p-d899dd7c.entry.js +1 -0
  69. package/dist/ptcw-design/{p-48c33817.entry.js → p-d9abe7e8.entry.js} +1 -1
  70. package/dist/ptcw-design/{p-e577ad62.entry.js → p-da82dc93.entry.js} +1 -1
  71. package/dist/ptcw-design/{p-16e70f20.entry.js → p-e0b873d0.entry.js} +1 -1
  72. package/dist/ptcw-design/{p-49e54079.entry.js → p-e3f8e5d5.entry.js} +1 -1
  73. package/dist/ptcw-design/{p-28be539b.entry.js → p-e4000363.entry.js} +1 -1
  74. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  75. package/dist/types/components/organism-bundles/event-podcast-slider-example/event-podcast-slider-example.d.ts +0 -1
  76. package/dist/types/components.d.ts +0 -2
  77. package/package.json +1 -1
  78. package/readme.md +1 -1
  79. package/dist/cjs/event-jumbotron-example.cjs.entry.js +0 -146
  80. package/dist/cjs/icon-asset.cjs.entry.js +0 -65
  81. package/dist/cjs/list-item.cjs.entry.js +0 -48
  82. package/dist/cjs/ptc-breadcrumb.cjs.entry.js +0 -47
  83. package/dist/cjs/ptc-button.cjs.entry.js +0 -87
  84. package/dist/cjs/ptc-card-bottom_2.cjs.entry.js +0 -156
  85. package/dist/cjs/ptc-card-content.cjs.entry.js +0 -76
  86. package/dist/cjs/ptc-close-icon_2.cjs.entry.js +0 -275
  87. package/dist/cjs/ptc-img.cjs.entry.js +0 -133
  88. package/dist/cjs/ptc-link.cjs.entry.js +0 -87
  89. package/dist/cjs/ptc-para.cjs.entry.js +0 -127
  90. package/dist/cjs/ptc-scroll-button.cjs.entry.js +0 -136
  91. package/dist/cjs/ptc-spacer.cjs.entry.js +0 -38
  92. package/dist/cjs/ptc-title.cjs.entry.js +0 -152
  93. package/dist/esm/event-jumbotron-example.entry.js +0 -142
  94. package/dist/esm/icon-asset.entry.js +0 -61
  95. package/dist/esm/list-item.entry.js +0 -44
  96. package/dist/esm/ptc-breadcrumb.entry.js +0 -43
  97. package/dist/esm/ptc-button.entry.js +0 -83
  98. package/dist/esm/ptc-card-bottom_2.entry.js +0 -151
  99. package/dist/esm/ptc-card-content.entry.js +0 -72
  100. package/dist/esm/ptc-close-icon_2.entry.js +0 -270
  101. package/dist/esm/ptc-img.entry.js +0 -129
  102. package/dist/esm/ptc-link.entry.js +0 -83
  103. package/dist/esm/ptc-para.entry.js +0 -123
  104. package/dist/esm/ptc-scroll-button.entry.js +0 -132
  105. package/dist/esm/ptc-spacer.entry.js +0 -34
  106. package/dist/esm/ptc-title.entry.js +0 -148
  107. package/dist/ptcw-design/p-01075feb.entry.js +0 -1
  108. package/dist/ptcw-design/p-0c69ea52.entry.js +0 -1
  109. package/dist/ptcw-design/p-1070f8a3.entry.js +0 -1
  110. package/dist/ptcw-design/p-25a25451.entry.js +0 -1
  111. package/dist/ptcw-design/p-28371371.entry.js +0 -1
  112. package/dist/ptcw-design/p-2d70b4a8.entry.js +0 -1
  113. package/dist/ptcw-design/p-7793babb.entry.js +0 -1
  114. package/dist/ptcw-design/p-7fe4d383.entry.js +0 -1
  115. package/dist/ptcw-design/p-8fbe5eed.entry.js +0 -1
  116. package/dist/ptcw-design/p-92d22c78.entry.js +0 -1
  117. package/dist/ptcw-design/p-99355e65.entry.js +0 -1
  118. package/dist/ptcw-design/p-b651c1cb.entry.js +0 -1
  119. package/dist/ptcw-design/p-b8ee8699.entry.js +0 -1
  120. package/dist/ptcw-design/p-bf18b622.entry.js +0 -1
  121. package/dist/ptcw-design/p-d3e2a446.entry.js +0 -1
  122. package/dist/ptcw-design/p-e2a935fa.entry.js +0 -1
  123. package/dist/ptcw-design/p-f335cb2b.entry.js +0 -1
  124. /package/dist/ptcw-design/{p-672a349f.js → p-bcab66bf.js} +0 -0
@@ -1,47 +1,67 @@
1
1
  import { Host, h } from '@stencil/core';
2
2
  import Swiper, { Navigation, Pagination, Scrollbar, Mousewheel } from 'swiper';
3
3
  export class EventPodcastSliderExample {
4
- constructor() {
5
- this.sliderType = 'event-slider-cards';
6
- }
7
4
  componentDidLoad() {
5
+ const swiperContainer = this.el.querySelector('.swiper-container');
6
+ const slides = swiperContainer.querySelectorAll('.swiper-slide');
7
+ // Define a desktop breakpoint
8
+ const isDesktop = window.matchMedia('(min-width: 992px)').matches;
8
9
  setTimeout(() => {
9
10
  let list = this.el.querySelector('.event-slider-cards');
10
- this.listSwp = new Swiper(list, {
11
- // Customize options here
12
- modules: [Navigation, Pagination, Scrollbar, Mousewheel],
13
- slidesPerView: 'auto',
14
- spaceBetween: 24,
15
- centeredSlides: true,
16
- centeredSlidesBounds: true,
17
- initialSlide: 0,
18
- centerInsufficientSlides: true,
19
- freeMode: true,
20
- scrollbar: {
21
- el: this.swiperPaginationRef,
22
- draggable: true,
23
- },
24
- navigation: {
25
- nextEl: this.swiperButtonNextRef,
26
- prevEl: this.swiperButtonPrevRef,
27
- },
28
- mousewheel: {
29
- forceToAxis: true,
30
- sensitivity: 100,
31
- },
32
- breakpoints: {
33
- 1200: {
34
- spaceBetween: 32,
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,
25
+ },
26
+ navigation: {
27
+ nextEl: this.swiperButtonNextRef,
28
+ prevEl: this.swiperButtonPrevRef,
29
+ },
30
+ mousewheel: {
31
+ forceToAxis: true,
32
+ sensitivity: 100,
35
33
  },
36
- 1400: {
37
- spaceBetween: 40,
38
- }
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;');
39
56
  }
40
- });
57
+ if (scrollbar) {
58
+ scrollbar.setAttribute('style', 'display: none;');
59
+ }
60
+ }
41
61
  }, 100);
42
62
  }
43
63
  render() {
44
- return (h(Host, null, h("div", { class: "event-slider-cards" }, h("div", { class: "swiper-wrapper" }, h("slot", null)), h("div", { class: "swiper-scrollbar", ref: el => (this.swiperPaginationRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.swiperButtonNextRef = el) }, h("svg", { width: "14", 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: "14", 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" }))))));
64
+ return (h(Host, { class: "host-ele" }, h("div", { class: "event-slider-cards swiper-container" }, h("div", { class: "swiper-wrapper" }, h("slot", null)), h("div", { class: "swiper-scrollbar", ref: el => (this.swiperPaginationRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.swiperButtonNextRef = el) }, h("svg", { width: "14", 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: "14", 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" }))))));
45
65
  }
46
66
  static get is() { return "event-podcast-slider-example"; }
47
67
  static get originalStyleUrls() {
@@ -54,27 +74,5 @@ export class EventPodcastSliderExample {
54
74
  "$": ["event-podcast-slider-example.css"]
55
75
  };
56
76
  }
57
- static get properties() {
58
- return {
59
- "sliderType": {
60
- "type": "string",
61
- "mutable": false,
62
- "complexType": {
63
- "original": "'homepage-case-study-cards' | 'event-slider-cards'",
64
- "resolved": "\"event-slider-cards\" | \"homepage-case-study-cards\"",
65
- "references": {}
66
- },
67
- "required": false,
68
- "optional": false,
69
- "docs": {
70
- "tags": [],
71
- "text": ""
72
- },
73
- "attribute": "slider-type",
74
- "reflect": false,
75
- "defaultValue": "'event-slider-cards'"
76
- }
77
- };
78
- }
79
77
  static get elementRef() { return "el"; }
80
78
  }
@@ -366,6 +366,7 @@ ptc-link, ptc-square-card,
366
366
  }
367
367
  :host(.horizontal-card) .card-layout {
368
368
  position: relative;
369
+ display: block;
369
370
  }
370
371
  @media only screen and (min-width: 768px) {
371
372
  :host(.horizontal-card) .card-layout {
@@ -119,11 +119,18 @@ ptc-link, ptc-square-card,
119
119
  .ptc-icon-minimize .header .icon:focus-visible {
120
120
  border-radius: var(--ptc-border-radius-standard);
121
121
  outline: 5px solid var(--keyboard-nav-outline);
122
- margin-right: 5px;
123
122
  }
124
123
  .ptc-icon-minimize .header .icon:focus-visible icon-asset {
125
124
  outline: none !important;
126
125
  }
127
126
  .ptc-icon-minimize .header .icon:active icon-asset {
128
127
  outline: none !important;
128
+ }
129
+ .ptc-icon-minimize .checkbox-icon .icon:focus-visible {
130
+ border-radius: var(--ptc-border-radius-standard);
131
+ outline: 5px solid var(--keyboard-nav-outline);
132
+ margin-right: 5px;
133
+ }
134
+ .ptc-icon-minimize .checkbox-icon .icon:focus-visible icon-asset {
135
+ outline: none !important;
129
136
  }
@@ -140,7 +140,7 @@ export class PtcIconMinimize {
140
140
  return (h("div", { class: 'ptc-icon-minimize' }, this.listType == "default" ?
141
141
  h("div", { class: "header" }, h("div", { class: "title" }, this.heading), h("div", { class: "icon mf-listen", id: this.trackerId, onClick: () => this.dropdownToggle(), onKeyDown: this.handleKeyDown, tabIndex: this.tabIndexValue }, h("icon-asset", { type: "ptc", color: "black", size: "xxx-small", name: icon })))
142
142
  : this.listType == "checkbox" ?
143
- h("div", { class: "header" }, h("div", { class: "title" }, h("ptc-checkbox", { checked: "unchecked", "data-refine": this.dataRefineValue, "input-name": "", value: this.heading, tabIndex: this.tabIndexValue }, this.heading)), h("div", { class: "icon mf-listen", id: this.trackerId, onClick: () => this.dropdownToggle(), onKeyDown: this.handleKeyDown, tabIndex: this.tabIndexValue }, h("icon-asset", { type: "ptc", color: "black", size: "xxx-small", name: icon })))
143
+ h("div", { class: "header checkbox-icon" }, h("div", { class: "title" }, h("ptc-checkbox", { checked: "unchecked", "data-refine": this.dataRefineValue, "input-name": "", value: this.heading, tabIndex: this.tabIndexValue }, this.heading)), h("div", { class: "icon mf-listen", id: this.trackerId, onClick: () => this.dropdownToggle(), onKeyDown: this.handleKeyDown, tabIndex: this.tabIndexValue }, h("icon-asset", { type: "ptc", color: "black", size: "xxx-small", name: icon })))
144
144
  : null, h("div", { class: "content", style: scrollHeight }, h("slot", null))));
145
145
  }
146
146
  static get is() { return "ptc-icon-minimize"; }
@@ -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
  .preloader-search-results {
2687
2755
  position: relative;
2688
2756
  width: 100%;
@@ -2694,8 +2762,6 @@ ptc-link, ptc-square-card,
2694
2762
  position: relative;
2695
2763
  }
2696
2764
  .preloader-search-results .content-container .content-container-child {
2697
- top: 80px;
2698
- margin-bottom: 70px;
2699
2765
  background-color: --color-standard-gray;
2700
2766
  position: relative;
2701
2767
  }
@@ -2705,45 +2771,126 @@ ptc-link, ptc-square-card,
2705
2771
  .preloader-search-results .content-container .row-margin-btm {
2706
2772
  margin-bottom: 10px;
2707
2773
  }
2708
- .preloader-search-results .content-container .grid-mrgn {
2709
- margin: 0;
2774
+ .preloader-search-results .content-container .grid-top-2 {
2775
+ margin-bottom: 20px;
2776
+ }
2777
+ .preloader-search-results .content-container .block-1 {
2778
+ height: 527px;
2779
+ }
2780
+ .preloader-search-results .content-container .skeleton {
2781
+ padding: 4px 0 0 0;
2782
+ }
2783
+ .preloader-search-results .content-container .skeleton .skeleton-block {
2784
+ margin-bottom: 6px;
2785
+ }
2786
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2787
+ width: 568px;
2788
+ }
2789
+ @media only screen and (min-width: 360px) {
2790
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2791
+ width: 199px;
2792
+ }
2793
+ }
2794
+ @media only screen and (min-width: 480px) {
2795
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2796
+ width: 275px;
2797
+ }
2798
+ }
2799
+ @media only screen and (min-width: 768px) {
2800
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2801
+ width: 459px;
2802
+ }
2710
2803
  }
2711
2804
  @media only screen and (min-width: 992px) {
2712
- .preloader-search-results .content-container .grid-mrgn {
2713
- margin: 0 18px;
2805
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2806
+ width: 393px;
2714
2807
  }
2715
2808
  }
2716
2809
  @media only screen and (min-width: 1200px) {
2717
- .preloader-search-results .content-container .grid-mrgn {
2718
- margin: 0 26px;
2810
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2811
+ width: 538px;
2719
2812
  }
2720
2813
  }
2721
2814
  @media only screen and (min-width: 1440px) {
2722
- .preloader-search-results .content-container .grid-mrgn {
2723
- margin: 0 29px;
2815
+ .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2816
+ width: 568px;
2724
2817
  }
2725
2818
  }
2726
- .preloader-search-results .content-container .grid-top-2 {
2727
- margin-bottom: 20px;
2819
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2820
+ width: 754px;
2728
2821
  }
2729
- .preloader-search-results .content-container .block-1 {
2730
- height: 527px;
2822
+ @media only screen and (min-width: 360px) {
2823
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2824
+ width: 264px;
2825
+ }
2731
2826
  }
2732
- .preloader-search-results .content-container .skeleton .skeleton-block {
2733
- margin-bottom: 6px;
2827
+ @media only screen and (min-width: 480px) {
2828
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2829
+ width: 366px;
2830
+ }
2734
2831
  }
2735
- .preloader-search-results .content-container .skeleton .skeleton-block.longer {
2736
- width: 75%;
2832
+ @media only screen and (min-width: 768px) {
2833
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2834
+ width: 611px;
2835
+ }
2737
2836
  }
2738
- .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2739
- width: 97%;
2837
+ @media only screen and (min-width: 992px) {
2838
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2839
+ width: 523px;
2840
+ }
2841
+ }
2842
+ @media only screen and (min-width: 1200px) {
2843
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2844
+ width: 714px;
2845
+ }
2846
+ }
2847
+ @media only screen and (min-width: 1440px) {
2848
+ .preloader-search-results .content-container .skeleton .skeleton-block.longest {
2849
+ width: 754px;
2850
+ }
2740
2851
  }
2741
2852
  .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2742
- width: 45%;
2853
+ width: 366px;
2854
+ }
2855
+ @media only screen and (min-width: 360px) {
2856
+ .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2857
+ width: 129px;
2858
+ }
2859
+ }
2860
+ @media only screen and (min-width: 480px) {
2861
+ .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2862
+ width: 179px;
2863
+ }
2864
+ }
2865
+ @media only screen and (min-width: 768px) {
2866
+ .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2867
+ width: 297px;
2868
+ }
2869
+ }
2870
+ @media only screen and (min-width: 992px) {
2871
+ .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2872
+ width: 254px;
2873
+ }
2874
+ }
2875
+ @media only screen and (min-width: 1200px) {
2876
+ .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2877
+ width: 347px;
2878
+ }
2879
+ }
2880
+ @media only screen and (min-width: 1440px) {
2881
+ .preloader-search-results .content-container .skeleton .skeleton-block.medium {
2882
+ width: 366px;
2883
+ }
2884
+ }
2885
+ .preloader-search-results .content-container .skeleton .skeleton-block.small {
2886
+ width: 100%;
2743
2887
  }
2744
2888
  .preloader-search-results .content-container .skeleton .skeleton-block.thin {
2745
2889
  height: 16px;
2746
2890
  }
2891
+ .preloader-search-results .content-container .skeleton .skeleton-block.thinner {
2892
+ height: 1px;
2893
+ }
2747
2894
  .preloader-search-results .content-container .skeleton .skeleton-block.bold {
2748
2895
  height: 26px;
2749
2896
  }
@@ -79,7 +79,13 @@ export class PtcPreloaderSection {
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
81
  case 'search-results': {
82
- return (h("div", { class: "preloader-wrapper" }, h("div", { class: "preloader-search-results" }, h("div", { class: "ptc-container content-container" }, h("div", { class: "content-container-child" }, h("div", { class: "skeleton" }, h("div", { class: "grid-mrgn" }, h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))));
82
+ return (h("div", { class: "preloader-wrapper" }, h("div", { class: "preloader-search-results" }, h("div", { class: "ptc-container content-container" }, h("div", { class: "content-container-child" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block medium bold" }), h("div", { class: "skeleton-block thin longest" }), h("div", { class: "skeleton-block thin longer" }), h("div", { class: "skeleton-block thinner small" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }))), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))));
83
+ }
84
+ case 'news': {
85
+ 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-6-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-6-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-6-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-6-lg skeleton-block big-card-block" })), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block cta thick center" })))));
86
+ }
87
+ case 'resource-center': {
88
+ 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" })))))))));
83
89
  }
84
90
  default:
85
91
  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" })))))));