@ptcwebops/ptcw-design 6.2.9-beta → 6.2.9

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 (225) hide show
  1. package/dist/cjs/blog-detail-content_2.cjs.entry.js +1 -1
  2. package/dist/cjs/blog-detail-layout.cjs.entry.js +1 -1
  3. package/dist/cjs/blogs-search-section.cjs.entry.js +1 -1
  4. package/dist/cjs/{component-4dd13907.js → component-06dda623.js} +1494 -3305
  5. package/dist/cjs/component-5b5b6a98.js +1819 -0
  6. package/dist/cjs/{event-jumbotron-example_15.cjs.entry.js → event-jumbotron-example_16.cjs.entry.js} +37 -68
  7. package/dist/cjs/featured-list.cjs.entry.js +1 -1
  8. package/dist/cjs/homepage-jumbotron.cjs.entry.js +1 -1
  9. package/dist/cjs/homepage-toggled-content.cjs.entry.js +1 -1
  10. package/dist/cjs/innovator-toggle-container.cjs.entry.js +1 -1
  11. package/dist/cjs/loader.cjs.js +1 -1
  12. package/dist/cjs/most-popular-news.cjs.entry.js +1 -1
  13. package/dist/cjs/my-component.cjs.entry.js +1 -1
  14. package/dist/cjs/ptc-accordion-item.cjs.entry.js +1 -1
  15. package/dist/cjs/ptc-background-video.cjs.entry.js +1 -1
  16. package/dist/cjs/ptc-bio-card.cjs.entry.js +1 -1
  17. package/dist/cjs/ptc-case-studies-slider.cjs.entry.js +1 -1
  18. package/dist/cjs/ptc-collapse-list.cjs.entry.js +1 -1
  19. package/dist/cjs/ptc-data-lookup.cjs.entry.js +2 -1
  20. package/dist/cjs/ptc-featured-list.cjs.entry.js +1 -1
  21. package/dist/cjs/ptc-filter-level-theater.cjs.entry.js +1 -1
  22. package/dist/cjs/ptc-footer.cjs.entry.js +1 -1
  23. package/dist/cjs/{ptc-form-checkbox_4.cjs.entry.js → ptc-form-checkbox_2.cjs.entry.js} +10 -795
  24. package/dist/cjs/ptc-homepage-image-feature.cjs.entry.js +1 -1
  25. package/dist/cjs/ptc-homepage-video-background.cjs.entry.js +1 -1
  26. package/dist/cjs/ptc-icon-card.cjs.entry.js +2 -8
  27. package/dist/cjs/ptc-jumbotron.cjs.entry.js +1 -1
  28. package/dist/cjs/ptc-media-card.cjs.entry.js +1 -1
  29. package/dist/cjs/ptc-multi-select_2.cjs.entry.js +670 -0
  30. package/dist/cjs/ptc-nav-submenu.cjs.entry.js +1 -1
  31. package/dist/cjs/ptc-podcast-card.cjs.entry.js +1 -1
  32. package/dist/cjs/ptc-previous-url.cjs.entry.js +2 -10
  33. package/dist/cjs/ptc-pricing-packaging-table.cjs.entry.js +1 -1
  34. package/dist/cjs/ptc-pricing-tabs.cjs.entry.js +1 -1
  35. package/dist/cjs/ptc-product-card.cjs.entry.js +1 -1
  36. package/dist/cjs/ptc-product-category.cjs.entry.js +1 -1
  37. package/dist/cjs/ptc-product-highlight-card.cjs.entry.js +1 -1
  38. package/dist/cjs/ptc-readmore-char.cjs.entry.js +1 -1
  39. package/dist/cjs/ptc-readmore-v3.cjs.entry.js +1 -1
  40. package/dist/cjs/ptc-social-icons-footer.cjs.entry.js +2 -7
  41. package/dist/cjs/ptc-tooltip-v2.cjs.entry.js +1 -1
  42. package/dist/cjs/ptc-value-led-speed-bump.cjs.entry.js +1 -1
  43. package/dist/cjs/ptc-white-paper.cjs.entry.js +1 -1
  44. package/dist/cjs/ptcw-design.cjs.js +1 -1
  45. package/dist/cjs/{utils-ad441b07.js → utils-87d7b99f.js} +0 -9
  46. package/dist/cjs/validation-messages-33a4f26b.js +126 -0
  47. package/dist/collection/collection-manifest.json +0 -1
  48. package/dist/collection/components/icon-asset/media/designer-v6.0.6.svg +2 -30
  49. package/dist/collection/components/innovator-toggle-container/innovator-toggle-container.css +5 -20
  50. package/dist/collection/components/organism-bundles/bundle-featured-list/featured-list.css +1 -19
  51. package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.css +0 -21
  52. package/dist/collection/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.js +1 -23
  53. package/dist/collection/components/ptc-bio-card/ptc-bio-card.css +5 -20
  54. package/dist/collection/components/ptc-button/ptc-button.js +1 -4
  55. package/dist/collection/components/ptc-case-studies-slider/ptc-case-studies-slider.css +5 -20
  56. package/dist/collection/components/ptc-featured-list/ptc-featured-list.css +5 -20
  57. package/dist/collection/components/ptc-filter-level-theater/ptc-filter-level-theater.css +5 -20
  58. package/dist/collection/components/ptc-footer/ptc-footer-v2.css +1 -14
  59. package/dist/collection/components/ptc-icon-card/ptc-icon-card.css +0 -10
  60. package/dist/collection/components/ptc-icon-card/ptc-icon-card.js +1 -25
  61. package/dist/collection/components/ptc-jumbotron/ptc-jumbotron.css +5 -20
  62. package/dist/collection/components/ptc-link/ptc-link.css +0 -8
  63. package/dist/collection/components/ptc-link/ptc-link.js +1 -4
  64. package/dist/collection/components/ptc-modal/ptc-modal.css +0 -94
  65. package/dist/collection/components/ptc-modal/ptc-modal.js +7 -104
  66. package/dist/collection/components/ptc-para/ptc-para.css +0 -3
  67. package/dist/collection/components/ptc-para/ptc-para.js +2 -2
  68. package/dist/collection/components/ptc-podcast-card/ptc-podcast-card.css +5 -20
  69. package/dist/collection/components/ptc-previous-url/ptc-previous-url.css +0 -16
  70. package/dist/collection/components/ptc-previous-url/ptc-previous-url.js +1 -27
  71. package/dist/collection/components/ptc-product-card/ptc-product-card.css +5 -20
  72. package/dist/collection/components/ptc-product-category/ptc-product-category.css +5 -20
  73. package/dist/collection/components/ptc-product-highlight-card/ptc-product-highlight-card.css +5 -20
  74. package/dist/collection/components/ptc-readmore-char/ptc-readmore-char.css +5 -20
  75. package/dist/collection/components/ptc-readmore-v3/ptc-readmore-v3.css +5 -20
  76. package/dist/collection/components/ptc-scroll-button/ptc-scroll-button.js +1 -41
  77. package/dist/collection/components/ptc-social-icons-footer/ptc-social-icons-footer.css +0 -10
  78. package/dist/collection/components/ptc-social-icons-footer/ptc-social-icons-footer.js +1 -24
  79. package/dist/collection/components/ptc-textfield/ptc-textfield.css +0 -51
  80. package/dist/collection/components/ptc-textfield/ptc-textfield.js +4 -59
  81. package/dist/collection/components/ptc-tooltip-v2/ptc-tooltip-v2.css +5 -20
  82. package/dist/collection/components/ptc-value-led-speed-bump/ptc-value-led-speed-bump.css +5 -20
  83. package/dist/collection/components/ptc-white-paper/ptc-white-paper.css +5 -20
  84. package/dist/collection/components/subnav/ptc-nav-submenu/ptc-nav-submenu.css +0 -7
  85. package/dist/collection/utils/utils.js +0 -8
  86. package/dist/custom-elements/index.d.ts +0 -6
  87. package/dist/custom-elements/index.js +45 -222
  88. package/dist/esm/blog-detail-content_2.entry.js +1 -1
  89. package/dist/esm/blog-detail-layout.entry.js +1 -1
  90. package/dist/esm/blogs-search-section.entry.js +1 -1
  91. package/dist/esm/{component-9c921cc6.js → component-274da230.js} +1482 -3281
  92. package/dist/esm/component-341e4eaa.js +1802 -0
  93. package/dist/esm/{event-jumbotron-example_15.entry.js → event-jumbotron-example_16.entry.js} +37 -69
  94. package/dist/esm/featured-list.entry.js +1 -1
  95. package/dist/esm/homepage-jumbotron.entry.js +1 -1
  96. package/dist/esm/homepage-toggled-content.entry.js +1 -1
  97. package/dist/esm/innovator-toggle-container.entry.js +1 -1
  98. package/dist/esm/loader.js +1 -1
  99. package/dist/esm/most-popular-news.entry.js +1 -1
  100. package/dist/esm/my-component.entry.js +1 -1
  101. package/dist/esm/ptc-accordion-item.entry.js +1 -1
  102. package/dist/esm/ptc-background-video.entry.js +1 -1
  103. package/dist/esm/ptc-bio-card.entry.js +1 -1
  104. package/dist/esm/ptc-case-studies-slider.entry.js +1 -1
  105. package/dist/esm/ptc-collapse-list.entry.js +1 -1
  106. package/dist/esm/ptc-data-lookup.entry.js +2 -1
  107. package/dist/esm/ptc-featured-list.entry.js +1 -1
  108. package/dist/esm/ptc-filter-level-theater.entry.js +1 -1
  109. package/dist/esm/ptc-footer.entry.js +1 -1
  110. package/dist/esm/{ptc-form-checkbox_4.entry.js → ptc-form-checkbox_2.entry.js} +9 -792
  111. package/dist/esm/ptc-homepage-image-feature.entry.js +1 -1
  112. package/dist/esm/ptc-homepage-video-background.entry.js +1 -1
  113. package/dist/esm/ptc-icon-card.entry.js +3 -9
  114. package/dist/esm/ptc-jumbotron.entry.js +1 -1
  115. package/dist/esm/ptc-media-card.entry.js +1 -1
  116. package/dist/esm/ptc-multi-select_2.entry.js +665 -0
  117. package/dist/esm/ptc-nav-submenu.entry.js +1 -1
  118. package/dist/esm/ptc-podcast-card.entry.js +1 -1
  119. package/dist/esm/ptc-previous-url.entry.js +2 -10
  120. package/dist/esm/ptc-pricing-packaging-table.entry.js +1 -1
  121. package/dist/esm/ptc-pricing-tabs.entry.js +1 -1
  122. package/dist/esm/ptc-product-card.entry.js +1 -1
  123. package/dist/esm/ptc-product-category.entry.js +1 -1
  124. package/dist/esm/ptc-product-highlight-card.entry.js +1 -1
  125. package/dist/esm/ptc-readmore-char.entry.js +1 -1
  126. package/dist/esm/ptc-readmore-v3.entry.js +1 -1
  127. package/dist/esm/ptc-social-icons-footer.entry.js +2 -7
  128. package/dist/esm/ptc-tooltip-v2.entry.js +1 -1
  129. package/dist/esm/ptc-value-led-speed-bump.entry.js +1 -1
  130. package/dist/esm/ptc-white-paper.entry.js +1 -1
  131. package/dist/esm/ptcw-design.js +1 -1
  132. package/dist/esm/{utils-ff65c75b.js → utils-b7c6422e.js} +1 -9
  133. package/dist/esm/validation-messages-adbb6518.js +124 -0
  134. package/dist/ptcw-design/media/designer-v6.0.6.svg +2 -30
  135. package/dist/ptcw-design/p-00e21489.entry.js +1 -0
  136. package/dist/ptcw-design/{p-72df6678.entry.js → p-085e82b8.entry.js} +1 -1
  137. package/dist/ptcw-design/p-0e8e6b0a.entry.js +1 -0
  138. package/dist/ptcw-design/{p-d10cb999.entry.js → p-103ec637.entry.js} +1 -1
  139. package/dist/ptcw-design/p-136a91bf.entry.js +1 -0
  140. package/dist/ptcw-design/{p-5ef88025.entry.js → p-14e53256.entry.js} +1 -1
  141. package/dist/ptcw-design/p-18a5a338.js +1 -0
  142. package/dist/ptcw-design/p-18f59395.entry.js +1 -0
  143. package/dist/ptcw-design/p-1b7087e7.entry.js +1 -0
  144. package/dist/ptcw-design/p-1ca8a5bf.entry.js +1 -0
  145. package/dist/ptcw-design/{p-0d806031.entry.js → p-1cff585f.entry.js} +1 -1
  146. package/dist/ptcw-design/{p-c66b8926.entry.js → p-2335d57c.entry.js} +1 -1
  147. package/dist/ptcw-design/{p-c37a3bd2.entry.js → p-29639cd4.entry.js} +1 -1
  148. package/dist/ptcw-design/{p-d9abe7e8.entry.js → p-34610052.entry.js} +1 -1
  149. package/dist/ptcw-design/{p-e4000363.entry.js → p-34b270c1.entry.js} +1 -1
  150. package/dist/ptcw-design/p-3f71553e.entry.js +1 -0
  151. package/dist/ptcw-design/p-419e260c.entry.js +68 -0
  152. package/dist/ptcw-design/{p-d756db27.entry.js → p-48183365.entry.js} +1 -1
  153. package/dist/ptcw-design/{p-c95f423e.entry.js → p-4c096997.entry.js} +1 -1
  154. package/dist/ptcw-design/p-4e2bb0e0.entry.js +1 -0
  155. package/dist/ptcw-design/{p-7a9611b4.entry.js → p-52b82ac5.entry.js} +1 -1
  156. package/dist/ptcw-design/p-583608d9.entry.js +1 -0
  157. package/dist/ptcw-design/{p-11e0edaf.entry.js → p-760507e1.entry.js} +1 -1
  158. package/dist/ptcw-design/p-78be481f.entry.js +1 -0
  159. package/dist/ptcw-design/{p-e3f8e5d5.entry.js → p-7e7ebf0a.entry.js} +1 -1
  160. package/dist/ptcw-design/p-841b807d.js +1 -0
  161. package/dist/ptcw-design/p-8daf00ae.entry.js +1 -0
  162. package/dist/ptcw-design/{p-ae970a60.entry.js → p-999d1c9f.entry.js} +1 -1
  163. package/dist/ptcw-design/{p-bb902570.entry.js → p-a3a04f4e.entry.js} +1 -1
  164. package/dist/ptcw-design/p-be533f0d.js +134 -0
  165. package/dist/ptcw-design/p-c1513c3f.js +203 -0
  166. package/dist/ptcw-design/{p-6d3326da.entry.js → p-cffebefe.entry.js} +1 -1
  167. package/dist/ptcw-design/{p-77cad16c.entry.js → p-d1857ada.entry.js} +1 -1
  168. package/dist/ptcw-design/{p-ea7369e9.entry.js → p-d3e5b65c.entry.js} +1 -1
  169. package/dist/ptcw-design/p-d734b373.entry.js +1 -0
  170. package/dist/ptcw-design/p-dc488936.entry.js +1 -0
  171. package/dist/ptcw-design/p-dd73c4d1.entry.js +1 -0
  172. package/dist/ptcw-design/{p-da82dc93.entry.js → p-df8526a2.entry.js} +1 -1
  173. package/dist/ptcw-design/{p-808ec62a.entry.js → p-e38ed0e3.entry.js} +1 -1
  174. package/dist/ptcw-design/p-e7937ac1.entry.js +1 -0
  175. package/dist/ptcw-design/p-e9a7475b.entry.js +1 -0
  176. package/dist/ptcw-design/{p-2c6fc745.entry.js → p-eab1042e.entry.js} +1 -1
  177. package/dist/ptcw-design/p-f05fec22.entry.js +1 -0
  178. package/dist/ptcw-design/{p-2749c178.entry.js → p-fce2bd81.entry.js} +1 -1
  179. package/dist/ptcw-design/ptcw-design.css +2 -2
  180. package/dist/ptcw-design/ptcw-design.esm.js +1 -1
  181. package/dist/types/components/organism-bundles/event-jumbotron-example/event-jumbotron-example.d.ts +0 -1
  182. package/dist/types/components/ptc-button/ptc-button.d.ts +0 -1
  183. package/dist/types/components/ptc-icon-card/ptc-icon-card.d.ts +0 -6
  184. package/dist/types/components/ptc-link/ptc-link.d.ts +0 -1
  185. package/dist/types/components/ptc-modal/ptc-modal.d.ts +2 -7
  186. package/dist/types/components/ptc-para/ptc-para.d.ts +1 -1
  187. package/dist/types/components/ptc-previous-url/ptc-previous-url.d.ts +0 -2
  188. package/dist/types/components/ptc-scroll-button/ptc-scroll-button.d.ts +0 -10
  189. package/dist/types/components/ptc-social-icons-footer/ptc-social-icons-footer.d.ts +0 -5
  190. package/dist/types/components/ptc-textfield/ptc-textfield.d.ts +0 -3
  191. package/dist/types/components.d.ts +6 -55
  192. package/dist/types/utils/utils.d.ts +0 -1
  193. package/package.json +1 -1
  194. package/readme.md +1 -5
  195. package/dist/cjs/modal-form-example.cjs.entry.js +0 -94
  196. package/dist/cjs/ptc-overlay.cjs.entry.js +0 -34
  197. package/dist/collection/components/organism-bundles/form/modal-from-example/modal-form-example.css +0 -26
  198. package/dist/collection/components/organism-bundles/form/modal-from-example/modal-form-example.js +0 -99
  199. package/dist/collection/stories/organisms/eSupport/CaseTracker/preview.stories.js +0 -45
  200. package/dist/collection/stories/organisms/eSupport/SupportArticle/preview.stories.js +0 -47
  201. package/dist/collection/stories/organisms/eSupport/SupportPage/preview.stories.js +0 -157
  202. package/dist/esm/modal-form-example.entry.js +0 -90
  203. package/dist/esm/ptc-overlay.entry.js +0 -30
  204. package/dist/ptcw-design/p-1b257420.entry.js +0 -1
  205. package/dist/ptcw-design/p-1f62e213.entry.js +0 -1
  206. package/dist/ptcw-design/p-257deac0.entry.js +0 -1
  207. package/dist/ptcw-design/p-2ac5ed9c.entry.js +0 -1
  208. package/dist/ptcw-design/p-34c50b3e.entry.js +0 -1
  209. package/dist/ptcw-design/p-36007a57.entry.js +0 -1
  210. package/dist/ptcw-design/p-50d68602.entry.js +0 -1
  211. package/dist/ptcw-design/p-5ef23b5c.entry.js +0 -1
  212. package/dist/ptcw-design/p-6c2b4fb8.entry.js +0 -1
  213. package/dist/ptcw-design/p-77b8ce07.entry.js +0 -68
  214. package/dist/ptcw-design/p-799afee5.entry.js +0 -1
  215. package/dist/ptcw-design/p-8872161f.js +0 -1
  216. package/dist/ptcw-design/p-90c4f08b.entry.js +0 -1
  217. package/dist/ptcw-design/p-95187918.entry.js +0 -1
  218. package/dist/ptcw-design/p-a3b57ede.entry.js +0 -1
  219. package/dist/ptcw-design/p-ba8c58a7.entry.js +0 -1
  220. package/dist/ptcw-design/p-bcab66bf.js +0 -336
  221. package/dist/ptcw-design/p-d2e26642.entry.js +0 -1
  222. package/dist/ptcw-design/p-de960790.entry.js +0 -1
  223. package/dist/ptcw-design/p-e90fbbad.entry.js +0 -1
  224. package/dist/ptcw-design/p-f8512dc9.entry.js +0 -1
  225. package/dist/types/components/organism-bundles/form/modal-from-example/modal-form-example.d.ts +0 -25
@@ -115,23 +115,6 @@ ptc-link, ptc-square-card,
115
115
  /* scroll-snap-align: start; */
116
116
  /* Snap to start of the card */
117
117
  }
118
- .card ptc-img::after {
119
- content: "";
120
- top: 0px;
121
- left: 0px;
122
- position: absolute;
123
- width: 100%;
124
- height: 100%;
125
- border-radius: var(--ptc-border-radius-standard);
126
- background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
127
- transition: var(--ptc-transition-slow) ease-in-out;
128
- }
129
- .card:hover ptc-img::after {
130
- background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.8) 100%);
131
- }
132
- .card:focus ptc-img::after, .card:active ptc-img::after {
133
- background: linear-gradient(0deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.85) 100%);
134
- }
135
118
 
136
119
  .text-wrapper {
137
120
  align-self: flex-start;
@@ -245,10 +228,6 @@ ptc-link, ptc-square-card,
245
228
  font-size: 32px;
246
229
  }
247
230
 
248
- .jumbotron-cards {
249
- padding: 0;
250
- }
251
-
252
231
  .panel {
253
232
  width: 876px;
254
233
  }
@@ -31,7 +31,6 @@ export class EventJumbotronExample {
31
31
  this.isMouseDown = false;
32
32
  };
33
33
  this.cards = [];
34
- this.modalBtnCloseText = "Close";
35
34
  this.activePanel = null;
36
35
  this.isDragging = false;
37
36
  this.isMouseDown = false;
@@ -95,16 +94,13 @@ export class EventJumbotronExample {
95
94
  ['mouseup', 'mouseleave'].forEach(event => this.slider.removeEventListener(event, this.stopDragging));
96
95
  }
97
96
  componentDidLoad() {
98
- // const cardOverlays = document.querySelectorAll('overlay');
99
97
  this.sliderWrapper = document.querySelector('.jumbotron-cards-wrapper');
100
98
  this.slider = document.querySelector('.jumbotron-cards');
101
99
  this.updateContainerClass();
102
100
  window.addEventListener('resize', () => {
103
101
  this.screenStatus.isDesktop = window.innerWidth >= 992;
104
102
  this.updateContainerClass();
105
- this.activePanel && this.closePanel(this.activePanel);
106
103
  });
107
- // cardOverlays.forEach( (ele=> {(ele as HTMLPtcOverlayElement).setOverlayColorValue('linear-gradient(0deg, rgba(0, 0, 0, 0.70) 0%, rgba(0, 0, 0, 0.70) 100%)')}))
108
104
  }
109
105
  render() {
110
106
  const modalContentSlots = Array.from(this.el.querySelectorAll('template'));
@@ -112,7 +108,7 @@ export class EventJumbotronExample {
112
108
  h("div", { class: {
113
109
  'event-jumbotron': true,
114
110
  'ptc-container': this.screenStatus.isDesktop,
115
- } }, h("div", { class: "jumbotron-cards-wrapper" }, h("div", { class: "jumbotron-cards" }, this.cards.map((card, index) => (h("div", { class: "card", onClick: () => this.handleCardClick(index), "data-panel": `panel-${index}` }, h("ptc-img", { "border-radius": "radius-standard", "image-type": "smart-bg", "img-url": card.cardBg, "load-mode": "lazy-bg", styles: "ptc-img{position: absolute; width: 100%; height: 100%; z-index: 0}" }), h("div", { class: "text-wrapper" }, h("h3", { class: "card-title" }, card.title, h("span", null, card.description)), h("div", { innerHTML: card.panelContent })))))), this.cards.map((_, index) => (h("div", { id: `panel-${index}`, class: "panel" }, h("button", { tabindex: "-1", class: "close-panel", onClick: () => this.closePanel(`panel-${index}`), "aria-label": "Close panel" }, h("ptc-close-icon", null)), h("slot", { name: `panel-content-${index}` })))), !this.screenStatus.isDesktop && this.cards.map((_, index) => (h("ptc-modal", { id: `modal-${index}`, show: false, "close-on-blur": true, "modal-type": "event-listing", "custom-class": "event-mobile-modal", headerOnlyText1: this.cards[index].title, headerOnlyText2: this.cards[index].description, headerOnlyBg: this.cards[index].cardBg, bottomCloseBtn: this.modalBtnCloseText }, h("div", { innerHTML: modalContentSlots[index].innerHTML })))))),
111
+ } }, h("div", { class: "jumbotron-cards-wrapper" }, h("div", { class: "jumbotron-cards" }, this.cards.map((card, index) => (h("div", { class: "card", onClick: () => this.handleCardClick(index), "data-panel": `panel-${index}` }, h("ptc-img", { "border-radius": "radius-standard", "image-type": "smart-bg", "img-url": card.cardBg, "load-mode": "lazy-bg", styles: "ptc-img{position: absolute; width: 100%; height: 100%; z-index: 0}" }), h("ptc-overlay", { "border-radius": "radius-standard", "filter-color": "black-4", "overlay-z-index": "z-index-auto", styles: "" }), h("div", { class: "text-wrapper" }, h("h3", { class: "card-title" }, card.title, h("span", null, card.description)), h("div", { innerHTML: card.panelContent })))))), this.cards.map((_, index) => (h("div", { id: `panel-${index}`, class: "panel" }, h("button", { tabindex: "-1", class: "close-panel", onClick: () => this.closePanel(`panel-${index}`), "aria-label": "Close panel" }, h("ptc-close-icon", null)), h("slot", { name: `panel-content-${index}` })))), this.cards.map((_, index) => (h("ptc-modal", { id: `modal-${index}`, show: false, "close-on-blur": true, "modal-type": "event-listing" }, h("div", { innerHTML: modalContentSlots[index].innerHTML })))))),
116
112
  h("div", { class: "white-placeholder" }),
117
113
  ];
118
114
  }
@@ -145,24 +141,6 @@ export class EventJumbotronExample {
145
141
  "text": ""
146
142
  },
147
143
  "defaultValue": "[]"
148
- },
149
- "modalBtnCloseText": {
150
- "type": "string",
151
- "mutable": false,
152
- "complexType": {
153
- "original": "string",
154
- "resolved": "string",
155
- "references": {}
156
- },
157
- "required": false,
158
- "optional": false,
159
- "docs": {
160
- "tags": [],
161
- "text": ""
162
- },
163
- "attribute": "modal-btn-close-text",
164
- "reflect": false,
165
- "defaultValue": "\"Close\""
166
144
  }
167
145
  };
168
146
  }
@@ -82,38 +82,23 @@ 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, .podcast-cta-section a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-plm-grey a.light-link {
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 {
86
86
  color: var(--color-blue-04);
87
- margin: -2px;
88
- border: 2px solid transparent;
89
87
  }
90
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-plm-grey a.light-link:visited {
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 {
91
89
  color: var(--color-blue-06);
92
90
  }
93
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
94
92
  transition: none;
95
93
  color: var(--color-blue-07);
96
94
  }
97
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
98
96
  color: var(--color-blue-05);
99
97
  }
100
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-plm-grey a.light-link.disabled {
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 {
101
99
  color: var(--color-gray-04) !important;
102
100
  cursor: not-allowed;
103
101
  }
104
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-plm-grey a.light-link:focus-visible {
105
- border-radius: var(--ptc-border-radius-standard);
106
- border: 2px solid white;
107
- outline: 5px solid var(--keyboard-nav-outline);
108
- }
109
- .light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
110
- border: 2px solid transparent;
111
- }
112
- .light-links .podcast-cta-section a:focus-visible, .background-grey-10 .podcast-cta-section a:focus-visible, .background-plm-grey .podcast-cta-section a:focus-visible {
113
- border-radius: var(--ptc-border-radius-standard);
114
- border: 2px solid white;
115
- outline: 5px solid var(--keyboard-nav-outline);
116
- }
117
102
 
118
103
  .ptc-link {
119
104
  color: var(--color-gray-10);
@@ -1,5 +1,5 @@
1
1
  import { h, Host } from '@stencil/core';
2
- import { getSeoTagType, CheckDarkFocusState } from '../../utils/utils';
2
+ import { getSeoTagType } from '../../utils/utils';
3
3
  export class PtcButton {
4
4
  constructor() {
5
5
  this.disabled = false;
@@ -27,9 +27,6 @@ export class PtcButton {
27
27
  clickEventHandler() {
28
28
  this.clickEvent.emit();
29
29
  }
30
- componentWillLoad() {
31
- CheckDarkFocusState(this, this.el);
32
- }
33
30
  seoCompRender() {
34
31
  const classMap = this.getCssClassMap();
35
32
  const Tag = !!this.linkHref ? 'a' : 'button';
@@ -781,38 +781,23 @@ 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, .podcast-cta-section a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-plm-grey a.light-link {
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 {
785
785
  color: var(--color-blue-04);
786
- margin: -2px;
787
- border: 2px solid transparent;
788
786
  }
789
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-plm-grey a.light-link:visited {
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 {
790
788
  color: var(--color-blue-06);
791
789
  }
792
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
793
791
  transition: none;
794
792
  color: var(--color-blue-07);
795
793
  }
796
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
797
795
  color: var(--color-blue-05);
798
796
  }
799
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-plm-grey a.light-link.disabled {
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 {
800
798
  color: var(--color-gray-04) !important;
801
799
  cursor: not-allowed;
802
800
  }
803
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-plm-grey a.light-link:focus-visible {
804
- border-radius: var(--ptc-border-radius-standard);
805
- border: 2px solid white;
806
- outline: 5px solid var(--keyboard-nav-outline);
807
- }
808
- .light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
809
- border: 2px solid transparent;
810
- }
811
- .light-links .podcast-cta-section a:focus-visible, .background-grey-10 .podcast-cta-section a:focus-visible, .background-plm-grey .podcast-cta-section a:focus-visible {
812
- border-radius: var(--ptc-border-radius-standard);
813
- border: 2px solid white;
814
- outline: 5px solid var(--keyboard-nav-outline);
815
- }
816
801
 
817
802
  .ptc-link {
818
803
  color: var(--color-gray-10);
@@ -82,38 +82,23 @@ 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, .podcast-cta-section a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-plm-grey a.light-link {
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 {
86
86
  color: var(--color-blue-04);
87
- margin: -2px;
88
- border: 2px solid transparent;
89
87
  }
90
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-plm-grey a.light-link:visited {
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 {
91
89
  color: var(--color-blue-06);
92
90
  }
93
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
94
92
  transition: none;
95
93
  color: var(--color-blue-07);
96
94
  }
97
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
98
96
  color: var(--color-blue-05);
99
97
  }
100
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-plm-grey a.light-link.disabled {
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 {
101
99
  color: var(--color-gray-04) !important;
102
100
  cursor: not-allowed;
103
101
  }
104
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-plm-grey a.light-link:focus-visible {
105
- border-radius: var(--ptc-border-radius-standard);
106
- border: 2px solid white;
107
- outline: 5px solid var(--keyboard-nav-outline);
108
- }
109
- .light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
110
- border: 2px solid transparent;
111
- }
112
- .light-links .podcast-cta-section a:focus-visible, .background-grey-10 .podcast-cta-section a:focus-visible, .background-plm-grey .podcast-cta-section a:focus-visible {
113
- border-radius: var(--ptc-border-radius-standard);
114
- border: 2px solid white;
115
- outline: 5px solid var(--keyboard-nav-outline);
116
- }
117
102
 
118
103
  .ptc-link {
119
104
  color: var(--color-gray-10);
@@ -139,38 +139,23 @@ 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, .podcast-cta-section a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-plm-grey a.light-link {
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 {
143
143
  color: var(--color-blue-04);
144
- margin: -2px;
145
- border: 2px solid transparent;
146
144
  }
147
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-plm-grey a.light-link:visited {
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 {
148
146
  color: var(--color-blue-06);
149
147
  }
150
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
151
149
  transition: none;
152
150
  color: var(--color-blue-07);
153
151
  }
154
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
155
153
  color: var(--color-blue-05);
156
154
  }
157
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-plm-grey a.light-link.disabled {
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 {
158
156
  color: var(--color-gray-04) !important;
159
157
  cursor: not-allowed;
160
158
  }
161
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-plm-grey a.light-link:focus-visible {
162
- border-radius: var(--ptc-border-radius-standard);
163
- border: 2px solid white;
164
- outline: 5px solid var(--keyboard-nav-outline);
165
- }
166
- .light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
167
- border: 2px solid transparent;
168
- }
169
- .light-links .podcast-cta-section a:focus-visible, .background-grey-10 .podcast-cta-section a:focus-visible, .background-plm-grey .podcast-cta-section a:focus-visible {
170
- border-radius: var(--ptc-border-radius-standard);
171
- border: 2px solid white;
172
- outline: 5px solid var(--keyboard-nav-outline);
173
- }
174
159
 
175
160
  .ptc-link {
176
161
  color: var(--color-gray-10);
@@ -67,12 +67,11 @@ ptc-footer ul {
67
67
  list-style: none;
68
68
  }
69
69
  ptc-footer ul li a {
70
- margin: -2px;
71
- border: 2px solid transparent;
72
70
  text-decoration: underline;
73
71
  text-underline-offset: 6px;
74
72
  text-decoration-thickness: 1px;
75
73
  text-decoration-color: transparent;
74
+ border-bottom: none;
76
75
  transition: text-decoration var(--ptc-transition-medium) var(--ptc-ease-inout);
77
76
  color: var(--color-white) !important;
78
77
  }
@@ -88,11 +87,6 @@ ptc-footer ul li a:active {
88
87
  transition: none;
89
88
  text-decoration-color: var(--color-gray-04);
90
89
  }
91
- ptc-footer ul li a:focus-visible {
92
- border-radius: var(--ptc-border-radius-standard);
93
- border: 2px solid white;
94
- outline: 5px solid var(--keyboard-nav-outline);
95
- }
96
90
  ptc-footer .gap-20 {
97
91
  grid-column-gap: 20px;
98
92
  grid-row-gap: 20px;
@@ -243,18 +237,11 @@ ptc-footer .footer-bottom ul li, ptc-footer .footer-bottom ol li {
243
237
  font-size: var(--ptc-font-size-xx-small);
244
238
  }
245
239
  ptc-footer .footer-bottom .logo {
246
- margin: -2px;
247
240
  margin-bottom: var(--ptc-element-spacing-06);
248
241
  }
249
242
  ptc-footer .footer-bottom .logo a {
250
- border: 2px solid transparent;
251
243
  display: inline-block;
252
244
  }
253
- ptc-footer .footer-bottom .logo a:focus-visible {
254
- border-radius: var(--ptc-border-radius-standard);
255
- border: 2px solid white;
256
- outline: 5px solid var(--keyboard-nav-outline);
257
- }
258
245
  ptc-footer .footer-bottom .logo .footer-ptc-logo {
259
246
  width: 78px;
260
247
  height: 28px;
@@ -71,7 +71,6 @@ ptc-link, ptc-square-card,
71
71
  padding: 20px;
72
72
  background-color: var(--color-gray-10);
73
73
  border-radius: var(--ptc-border-radius-standard);
74
- border: 2px solid transparent;
75
74
  align-items: center;
76
75
  text-decoration: none;
77
76
  text-align: center;
@@ -110,15 +109,6 @@ ptc-link, ptc-square-card,
110
109
  :host a span {
111
110
  display: block;
112
111
  }
113
- :host a:focus-visible {
114
- border-radius: var(--ptc-border-radius-standard);
115
- outline: 5px solid var(--keyboard-nav-outline);
116
- }
117
- :host .dark-bg a:focus-visible {
118
- border-radius: var(--ptc-border-radius-standard);
119
- border: 2px solid white;
120
- outline: 5px solid var(--keyboard-nav-outline);
121
- }
122
112
  :host .card-icon {
123
113
  width: 2rem;
124
114
  height: 2rem;
@@ -1,17 +1,12 @@
1
1
  import { Host, h } from '@stencil/core';
2
- import { CheckDarkFocusState } from '../../utils/utils';
3
2
  export class PtcIconCard {
4
3
  constructor() {
5
4
  this.cardHref = undefined;
6
5
  this.target = undefined;
7
6
  this.trackerId = undefined;
8
- this.darkFocusState = false;
9
- }
10
- componentWillLoad() {
11
- CheckDarkFocusState(this, this.el, '.light-links,ptc-footer');
12
7
  }
13
8
  render() {
14
- return (h(Host, null, h("div", { id: this.trackerId, class: this.darkFocusState ? `tracker-div mf-listen dark-bg` : `tracker-div mf-listenstandard-bg` }, h("a", { href: this.cardHref, target: this.target }, h("div", null, h("span", { class: 'card-icon' }, h("slot", null)), h("div", { class: 'card-title' }, h("slot", { name: 'card-title' })))))));
9
+ return (h(Host, null, h("div", { id: this.trackerId, class: "tracker-div mf-listen" }, h("a", { href: this.cardHref, target: this.target }, h("div", null, h("span", { class: 'card-icon' }, h("slot", null)), h("div", { class: 'card-title' }, h("slot", { name: 'card-title' })))))));
15
10
  }
16
11
  static get is() { return "ptc-icon-card"; }
17
12
  static get encapsulation() { return "shadow"; }
@@ -77,26 +72,7 @@ export class PtcIconCard {
77
72
  },
78
73
  "attribute": "tracker-id",
79
74
  "reflect": false
80
- },
81
- "darkFocusState": {
82
- "type": "boolean",
83
- "mutable": false,
84
- "complexType": {
85
- "original": "boolean",
86
- "resolved": "boolean",
87
- "references": {}
88
- },
89
- "required": false,
90
- "optional": false,
91
- "docs": {
92
- "tags": [],
93
- "text": "Add dark-focus-state property where button is present on dark backgrounds"
94
- },
95
- "attribute": "dark-focus-state",
96
- "reflect": false,
97
- "defaultValue": "false"
98
75
  }
99
76
  };
100
77
  }
101
- static get elementRef() { return "el"; }
102
78
  }
@@ -1178,38 +1178,23 @@ 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, .podcast-cta-section a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a), .background-plm-grey a.light-link {
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 {
1182
1182
  color: var(--color-blue-04);
1183
- margin: -2px;
1184
- border: 2px solid transparent;
1185
1183
  }
1186
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):visited, .background-plm-grey a.light-link:visited {
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 {
1187
1185
  color: var(--color-blue-06);
1188
1186
  }
1189
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
1190
1188
  transition: none;
1191
1189
  color: var(--color-blue-07);
1192
1190
  }
1193
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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, .podcast-cta-section a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section 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):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 {
1194
1192
  color: var(--color-blue-05);
1195
1193
  }
1196
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a).disabled, .background-plm-grey a.light-link.disabled {
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 {
1197
1195
  color: var(--color-gray-04) !important;
1198
1196
  cursor: not-allowed;
1199
1197
  }
1200
- .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a):focus-visible, .background-plm-grey a.light-link:focus-visible {
1201
- border-radius: var(--ptc-border-radius-standard);
1202
- border: 2px solid white;
1203
- outline: 5px solid var(--keyboard-nav-outline);
1204
- }
1205
- .light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
1206
- border: 2px solid transparent;
1207
- }
1208
- .light-links .podcast-cta-section a:focus-visible, .background-grey-10 .podcast-cta-section a:focus-visible, .background-plm-grey .podcast-cta-section a:focus-visible {
1209
- border-radius: var(--ptc-border-radius-standard);
1210
- border: 2px solid white;
1211
- outline: 5px solid var(--keyboard-nav-outline);
1212
- }
1213
1198
 
1214
1199
  .ptc-link {
1215
1200
  color: var(--color-gray-10);
@@ -74,10 +74,6 @@ ptc-link, ptc-square-card,
74
74
  text-decoration: none;
75
75
  transition: color var(--ptc-transition-fast) var(--ptc-ease-inout);
76
76
  }
77
- .ptc-link.focus-state-dark-background {
78
- border: 2px solid transparent;
79
- margin: -2px;
80
- }
81
77
  .ptc-link:active {
82
78
  transition: none;
83
79
  }
@@ -100,10 +96,6 @@ ptc-link, ptc-square-card,
100
96
  text-decoration-thickness: 2px;
101
97
  transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);
102
98
  }
103
- .simple.focus-state-dark-background {
104
- border: 2px solid transparent;
105
- margin: -2px;
106
- }
107
99
  .simple:hover {
108
100
  color: var(--color-green-06);
109
101
  transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);
@@ -1,5 +1,5 @@
1
1
  import { h, Host } from '@stencil/core';
2
- import { getSeoTagType, CheckDarkFocusState } from '../../utils/utils';
2
+ import { getSeoTagType } from '../../utils/utils';
3
3
  export class PtcLink {
4
4
  constructor() {
5
5
  this.disabled = false;
@@ -17,9 +17,6 @@ export class PtcLink {
17
17
  this.tabNav = 0;
18
18
  this.darkFocusState = false;
19
19
  }
20
- componentWillLoad() {
21
- CheckDarkFocusState(this, this.el);
22
- }
23
20
  seoCompRender() {
24
21
  const classMap = this.getCssClassMap();
25
22
  const [TagType, firstChild] = getSeoTagType(this.el, "a");