@ptcwebops/ptcw-design 6.2.21 → 6.2.22-beta

package/dist/collection/components/ptc-modal/ptc-modal.css

@@ -82,6 +82,7 @@ ptc-link, ptc-square-card,
   align-content: flex-end;
   z-index: 50020;
   transform: translateY(-100%);
+  position: relative;
 }
 @media only screen and (min-width: 992px) {
   .wrapper .modal-popup {
@@ -97,6 +98,9 @@ ptc-link, ptc-square-card,
 .wrapper .modal-popup.xl {
   max-width: 64.0625rem;
 }
+.wrapper .modal-popup.fit-content {
+  max-width: fit-content;
+}
 .wrapper .modal-popup.max {
   width: calc(100% - 4rem);
   max-width: 75rem;
@@ -425,8 +429,6 @@ ptc-link, ptc-square-card,
   transform: translateY(-100%);
   border-radius: var(--ptc-border-radius-standard) var(--ptc-border-radius-standard) 0px 0px;
   align-items: center;
-  padding: var(--ptc-element-spacing-06);
-  box-sizing: border-box;
 }
 :host .wrapper .event-list-header::before {
   content: "";
@@ -438,19 +440,10 @@ ptc-link, ptc-square-card,
   background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.7) 100%);
   z-index: 1;
 }
-:host .wrapper .event-list-header + .close {
-  margin-top: 0px;
-  margin-right: 0px;
-  width: 40px;
-  height: 40px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
 :host .wrapper .event-list-header .text-wrapper {
   display: flex;
-  flex-wrap: wrap;
-  column-gap: 0.5em;
+  padding: var(--ptc-element-spacing-06);
+  gap: 0.5em;
 }
 :host .wrapper .event-list-header .text-wrapper span {
   display: inline-block;

package/dist/collection/components/ptc-modal/ptc-modal.js

@@ -34,6 +34,9 @@ export class PtcModal {
       const wrapperEle = this.el.shadowRoot.querySelector('.wrapper');
       wrapperEle && wrapperEle.focus();
     }, 100);
+    setTimeout(() => {
+      this.setInitialFocus();
+    }, 150);
   }
   componentWillLoad() {
     let body = document.querySelector('body');
@@ -127,6 +130,20 @@ export class PtcModal {
   close() {
     this.show = false;
   }
+  setInitialFocus() {
+    var _a, _b, _c;
+    const firstFocusableElement = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('button, a, input, select, textarea, [tabindex]:not([tabindex="-1"]), ptc-close-icon');
+    const closeIcon = (_b = this.el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('ptc-close-icon');
+    const closeSvg = (_c = closeIcon === null || closeIcon === void 0 ? void 0 : closeIcon.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('svg');
+    if (closeSvg) {
+      console.log('close svg found');
+      closeSvg.focus();
+    }
+    else if (firstFocusableElement) {
+      console.log('first focus ele found!');
+      firstFocusableElement.focus();
+    }
+  }
   render() {
     let content;
     let overlay;
@@ -227,8 +244,8 @@ export class PtcModal {
         "type": "string",
         "mutable": true,
         "complexType": {
-          "original": "'sm' | 'md' | 'lg' | 'xl' | 'max'| 'sm-modal'",
-          "resolved": "\"lg\" | \"max\" | \"md\" | \"sm\" | \"sm-modal\" | \"xl\"",
+          "original": "'sm' | 'md' | 'lg' | 'xl' | 'fit-content' | 'max'| 'sm-modal'",
+          "resolved": "\"fit-content\" | \"lg\" | \"max\" | \"md\" | \"sm\" | \"sm-modal\" | \"xl\"",
           "references": {}
         },
         "required": false,

package/dist/collection/components/ptc-para/ptc-para.css

@@ -104,6 +104,9 @@ p.main {
 p.primary-grey {
   color: var(--color-gray-10);
 }
+p.primary-green {
+  color: var(--color-green-06);
+}
 p.gray-darker {
   color: var(--color-gray-11);
 }

package/dist/collection/components/ptc-para/ptc-para.js

@@ -185,8 +185,8 @@ export class PtcPara {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "'primary-grey' | 'white' | 'gray-darker'",
-          "resolved": "\"gray-darker\" | \"primary-grey\" | \"white\"",
+          "original": "'primary-grey' | 'primary-green' | 'white' | 'gray-darker'",
+          "resolved": "\"gray-darker\" | \"primary-green\" | \"primary-grey\" | \"white\"",
           "references": {}
         },
         "required": false,

package/dist/collection/components/ptc-podcast-card/ptc-podcast-card.css

@@ -5602,23 +5602,38 @@ a:focus-visible {
   border-radius: var(--ptc-border-radius-standard);
 }
 
-.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a), .background-plm-grey a.light-link {
+.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 {
   color: var(--color-blue-04);
+  margin: -2px;
+  border: 2px solid transparent;
 }
-.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
+.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 {
   color: var(--color-blue-06);
 }
-.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
+.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 {
   transition: none;
   color: var(--color-blue-07);
 }
-.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
+.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 {
   color: var(--color-blue-05);
 }
-.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
+.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 {
   color: var(--color-gray-04) !important;
   cursor: not-allowed;
 }
+.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 {
+  border-radius: var(--ptc-border-radius-standard);
+  border: 2px solid white;
+  outline: 5px solid var(--keyboard-nav-outline);
+}
+.light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
+  border: 2px solid transparent;
+}
+.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 {
+  border-radius: var(--ptc-border-radius-standard);
+  border: 2px solid white;
+  outline: 5px solid var(--keyboard-nav-outline);
+}
 
 .ptc-link {
   color: var(--color-gray-10);
@@ -5664,13 +5679,6 @@ a:focus-visible {
   color: var(--color-green-06);
 }
 
-.vjs-social-share-links a {
-  color: var(--color-white);
-}
-.vjs-social-share-links a:hover {
-  color: var(--color-white);
-}
-
 :host {
   display: block;
   padding: 2rem 0;

package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.css

@@ -246,11 +246,6 @@ ptc-link, ptc-square-card,
 .skeleton-block.medium {
   width: 50%;
 }
-@media only screen and (min-width: 992px) {
-  .skeleton-block.medium-md {
-    width: 50%;
-  }
-}
 .skeleton-block.short {
   width: 30%;
 }
@@ -481,18 +476,18 @@ ptc-link, ptc-square-card,
   align-items: center;
   justify-content: space-between;
   flex-wrap: nowrap;
-  column-gap: 40px;
 }
 .skeleton-home-page .slide-container .skeleton-slides .slide {
   background: linear-gradient(to right, var(--color-gray-02) 25%, var(--color-gray-03) 50%, var(--color-gray-02) 75%);
   background-size: 200% 100%;
   animation: loading 2.5s linear infinite;
   border-radius: 4px;
-  width: 100%;
+  width: 296px;
   height: 140px;
 }
 @media only screen and (min-width: 992px) {
   .skeleton-home-page .slide-container .skeleton-slides .slide {
+    width: 356px;
     height: 116px;
   }
 }
@@ -2004,7 +1999,7 @@ ptc-link, ptc-square-card,
   margin-bottom: 38px;
   margin-top: 22px;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-1 {
     margin-bottom: 40px;
   }
@@ -2014,7 +2009,7 @@ ptc-link, ptc-square-card,
   margin-bottom: 24px;
   align-self: center;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-2 {
     margin-bottom: 25px;
   }
@@ -2028,7 +2023,7 @@ ptc-link, ptc-square-card,
     width: 335px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-3 {
     width: 445px;
   }
@@ -2042,7 +2037,7 @@ ptc-link, ptc-square-card,
     width: 397px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-4 {
     width: 525px;
   }
@@ -2052,7 +2047,7 @@ ptc-link, ptc-square-card,
   align-self: center;
   margin-bottom: 20px;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-5 {
     width: 769px;
   }
@@ -2066,7 +2061,7 @@ ptc-link, ptc-square-card,
     width: 411px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-6 {
     width: 621px;
   }
@@ -2080,7 +2075,7 @@ ptc-link, ptc-square-card,
     width: 383px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-7 {
     display: none;
   }
@@ -2094,7 +2089,7 @@ ptc-link, ptc-square-card,
     width: 435px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-8 {
     display: none;
   }
@@ -2108,7 +2103,7 @@ ptc-link, ptc-square-card,
     width: 199px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-9 {
     display: none;
   }
@@ -2124,7 +2119,7 @@ ptc-link, ptc-square-card,
     width: 411px;
   }
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .jumbotron .jumbotron-bg .short-10 {
     width: 232px;
     margin-top: 35px;
@@ -2149,7 +2144,7 @@ ptc-link, ptc-square-card,
   width: 65%;
   margin-bottom: 20px;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .short-16 {
     width: 275px;
   }
@@ -2157,7 +2152,7 @@ ptc-link, ptc-square-card,
 .preloader-events-listing .short-11 {
   width: 95%;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .short-11 {
     width: 60%;
   }
@@ -2165,7 +2160,7 @@ ptc-link, ptc-square-card,
 .preloader-events-listing .short-12 {
   width: 89%;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .short-12 {
     display: none;
   }
@@ -2180,18 +2175,13 @@ ptc-link, ptc-square-card,
     width: 290px;
   }
 }
-@media only screen and (min-width: 992px) {
-  .preloader-events-listing .short-15 {
-    display: none;
-  }
-}
 .preloader-events-listing .grid-cards {
   display: flex;
   flex-direction: row;
   column-gap: 24px;
   overflow-x: hidden;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-cards {
     margin: 0 120px;
   }
@@ -2204,7 +2194,7 @@ ptc-link, ptc-square-card,
   flex-grow: 1;
   min-width: 250px;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-cards .short-17 {
     width: 270px;
     min-width: 270px;
@@ -2214,13 +2204,12 @@ ptc-link, ptc-square-card,
 .preloader-events-listing .grid-cards-desktop {
   display: none;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-cards-desktop {
     display: flex;
     flex-direction: row;
     column-gap: 24px;
     overflow-x: hidden;
-    justify-content: center;
   }
 }
 .preloader-events-listing .grid-cards-desktop .short-17 {
@@ -2231,20 +2220,11 @@ ptc-link, ptc-square-card,
   flex-grow: 1;
   min-width: 250px;
 }
-@media only screen and (min-width: 992px) {
-  .preloader-events-listing .grid-cards-desktop .short-17 {
-    width: 22%;
-    min-width: 22%;
-    height: 530px;
-    flex-grow: initial;
-  }
-}
 @media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-cards-desktop .short-17 {
-    width: 275px;
-    min-width: 275px;
+    width: 270px;
+    min-width: 270px;
     height: 530px;
-    flex-grow: initial;
   }
 }
 .preloader-events-listing .grid-long-cards-mobile {
@@ -2259,18 +2239,17 @@ ptc-link, ptc-square-card,
   width: 100%;
   height: 391px;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-long-cards-mobile .short-13 {
     width: 996px;
     height: 391px;
     min-width: 996px;
-    display: none;
   }
 }
 .preloader-events-listing .grid-long-cards-mobile .short-14 {
   display: none;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-long-cards-mobile .short-14 {
     display: block;
     width: 996px;
@@ -2287,12 +2266,6 @@ ptc-link, ptc-square-card,
   margin-bottom: 30px;
   display: none;
 }
-@media only screen and (min-width: 992px) {
-  .preloader-events-listing .grid-long-cards {
-    margin-left: 24px;
-    display: flex;
-  }
-}
 @media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-long-cards {
     margin-left: 120px;
@@ -2303,17 +2276,17 @@ ptc-link, ptc-square-card,
   width: 100%;
   height: 391px;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-long-cards .short-13 {
-    width: 80%;
+    width: 996px;
     height: 391px;
-    min-width: 80%;
+    min-width: 996px;
   }
 }
 .preloader-events-listing .grid-long-cards .short-14 {
   display: none;
 }
-@media only screen and (min-width: 992px) {
+@media only screen and (min-width: 1440px) {
   .preloader-events-listing .grid-long-cards .short-14 {
     display: block;
     width: 996px;
@@ -2688,69 +2661,6 @@ ptc-link, ptc-square-card,
   }
 }
 
-.news-skeleton-preloader .thick-on-mobile {
-  height: 94px;
-}
-@media only screen and (min-width: 768px) {
-  .news-skeleton-preloader .thick-on-mobile {
-    height: 48px;
-  }
-}
-.news-skeleton-preloader .big-block {
-  height: 700px;
-}
-@media only screen and (min-width: 992px) {
-  .news-skeleton-preloader .big-block {
-    height: 547px;
-  }
-}
-.news-skeleton-preloader .card-block {
-  height: 500px;
-}
-.news-skeleton-preloader .big-card-block {
-  height: calc(100% - 8px);
-  display: none;
-}
-@media only screen and (min-width: 992px) {
-  .news-skeleton-preloader .big-card-block {
-    display: block;
-  }
-}
-
-.resource-center-skeleton-preloader .skeleton-jumbotron {
-  background-color: var(--color-gray-02);
-  padding-top: 24px;
-  padding-bottom: 24px;
-  margin-bottom: 24px;
-}
-@media only screen and (min-width: 992px) {
-  .resource-center-skeleton-preloader .skeleton-jumbotron {
-    background-color: var(--color-gray-01);
-    padding-top: 106px;
-    padding-bottom: 106px;
-  }
-}
-@media only screen and (min-width: 768px) {
-  .resource-center-skeleton-preloader .skeleton-jumbotron {
-    margin-bottom: 48px;
-  }
-}
-.resource-center-skeleton-preloader .jumbo-image-mobile {
-  display: block;
-  background-color: var(--color-gray-01);
-  height: 300px;
-}
-@media only screen and (min-width: 992px) {
-  .resource-center-skeleton-preloader .jumbo-image-mobile {
-    display: none;
-  }
-}
-.resource-center-skeleton-preloader .card-block {
-  width: 100%;
-  height: 347px;
-  margin: 0;
-}
-
 @keyframes pulse {
   0% {
     opacity: 0.5;

package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.js

@@ -70,7 +70,7 @@ export class PtcPreloaderSection {
         return (h("div", { class: "preloader-wrapper preloader-generic-form" }, h("div", { class: "jumbotron" }, h("div", { class: "ptc-container skeleton-jumbotron" }, 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 block form-block-1" }, h("div", { class: "is-col-12" }, Array.from({ length: 7 }).map(() => (h("div", { class: "skeleton form-block-skeleton" }, h("div", { class: "skeleton-block bold" })))), h("div", { class: "skeleton" }, h("div", { class: "skeleton-block very-bold" })))), h("div", { class: "is-grid block grid-1" }, h("div", { class: "is-col-12-xs is-col-12-sm is-col-10-md is-col-7-lg" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin line-1" }), h("div", { class: "skeleton-block thin line-2" }), h("div", { class: "skeleton-block thin line-3" }), h("div", { class: "skeleton-block thin line-4" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin line-6" }), 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 block-2" }))), h("div", { class: "is-col-1-lg" }), h("div", { class: "is-col-12-xs is-col-12-sm is-col-4-lg form-block-2" }, Array.from({ length: 7 }).map(() => (h("div", { class: "skeleton form-block-skeleton" }, h("div", { class: "skeleton-block bold" })))), h("div", { class: "skeleton" }, h("div", { class: "skeleton-block very-bold" })))))));
       }
       case 'events-listing': {
-        return (h("div", { class: "preloader-wrapper preloader-events-listing" }, h("div", { class: "jumbotron " }, h("div", { class: "jumbotron-bg" }, h("div", { class: "ptc-container" }, h("div", { class: "is-grid has-no-row-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short-1" }), h("div", { class: "skeleton-block thin short-2" }), h("div", { class: "skeleton-block bold short-3" }), h("div", { class: "skeleton-block thin short-4" }), h("div", { class: "skeleton-block thin short-5" }), h("div", { class: "skeleton-block thin short-6" }), h("div", { class: "skeleton-block thin short-7" }), h("div", { class: "skeleton-block thin short-8" }), h("div", { class: "skeleton-block thin short-9" }), h("div", { class: "skeleton-block thick short-10" }))))), h("div", { class: "grid-cards-div" }, h("div", { class: "skeleton grid-cards" }, h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" })), h("div", { class: "skeleton grid-cards-desktop ptc-container" }, h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }))), h("div", { class: "white-placeholder" }))), h("div", { class: "ptc-container grid-2" }, h("div", { class: "is-grid has-no-row-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick short-16" }), h("div", { class: "skeleton-block thin short-11" }), h("div", { class: "skeleton-block thin short-12" }))))), h("div", { class: "is-grid has-no-row-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "ptc-container skeleton grid-long-cards-mobile" }, h("div", { class: "skeleton-block short-13" })), h("div", { class: "skeleton" }, h("div", { class: "grid-long-cards" }, h("div", { class: "skeleton-block short-13" }), h("div", { class: "skeleton-block short-14" })), h("div", { class: "skeleton-block bold short-15" }))))));
+        return (h("div", { class: "preloader-wrapper preloader-events-listing" }, h("div", { class: "jumbotron " }, h("div", { class: "jumbotron-bg" }, h("div", { class: "ptc-container" }, h("div", { class: "is-grid has-no-row-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short-1" }), h("div", { class: "skeleton-block thin short-2" }), h("div", { class: "skeleton-block bold short-3" }), h("div", { class: "skeleton-block thin short-4" }), h("div", { class: "skeleton-block thin short-5" }), h("div", { class: "skeleton-block thin short-6" }), h("div", { class: "skeleton-block thin short-7" }), h("div", { class: "skeleton-block thin short-8" }), h("div", { class: "skeleton-block thin short-9" }), h("div", { class: "skeleton-block thick short-10" }))))), h("div", { class: "grid-cards-div" }, h("div", { class: "skeleton grid-cards" }, h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" })), h("div", { class: "skeleton grid-cards-desktop ptc-container" }, h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }), h("div", { class: "skeleton-block short-17" }))), h("div", { class: "white-placeholder" }))), h("div", { class: "ptc-container grid-2" }, h("div", { class: "is-grid has-no-row-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick short-16" }), h("div", { class: "skeleton-block thin short-11" }), h("div", { class: "skeleton-block thin short-12" }))))), h("div", { class: "is-grid has-no-row-gap" }, h("div", { class: "is-col-12" }, h("div", { class: "ptc-container skeleton" }, h("div", { class: "grid-long-cards-mobile " }, h("div", { class: "skeleton-block short-13" }))), h("div", { class: "skeleton" }, h("div", { class: "grid-long-cards" }, h("div", { class: "skeleton-block short-13" }), h("div", { class: "skeleton-block short-14" })), h("div", { class: "skeleton-block bold short-15" }))))));
       }
       case 'pdf-skeleton': {
         return (h("div", { class: "preloader-wrapper pdf-skeleton-preloader" }, h("div", { class: "jumbotron-sec" }, h("div", { class: "ptc-container skeleton-jumbotron" }, 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: "ptc-container" }, h("div", { class: "section-1" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block line-1" }), h("div", { class: "skeleton-block line-2 thin" }), h("div", { class: "skeleton-block line-3 thin" }), h("div", { class: "skeleton-block line-4 thin" }))), h("div", { class: "pdf-area" }, h("div", { class: "pdf-section" }, h("div", { class: "top-border" }), h("div", { class: "pdf-body" }, h("div", { class: "skeleton" }, 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("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block thick-block" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }))))))));
@@ -78,11 +78,6 @@ export class PtcPreloaderSection {
       case 'ppc-skeleton': {
         return (h("div", { class: "preloader-wrapper" }, h("div", { class: "ppc-skeleton-preloader" }, h("div", { class: "ptc-container " }, h("div", { class: "dots-loader" })))));
       }
-      case 'news': {
-        return (h("div", { class: "preloader-wrapper" }, h("div", { class: "news-skeleton-preloader" }, h("div", { class: "ptc-container ptc-section-standard" }, h("ptc-spacer", { breakpoint: "large", size: "medium" }), h("div", { class: "is-grid has-row-gap-md" }, h("div", { class: "is-col-6-lg skeleton-block thick thick-on-mobile" }), h("div", { class: "is-col-6-lg skeleton-block thick medium-md right" })), h("ptc-spacer", { size: "xxx-large" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block narrow thick center" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block short thin center" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block big-block" }), h("ptc-spacer", { size: "xxx-large" }), h("div", { class: "skeleton-block bold medium" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "is-grid has-row-gap-md  has-col-gap-lg" }, h("div", { class: "is-col-8-lg" }, h("div", { class: "is-grid has-col-gap-lg" }, h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }))), h("div", { class: "is-col-4-lg skeleton-block big-card-block" })), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block cta thick center" }), h("ptc-spacer", { size: "xxx-large" }), h("div", { class: "skeleton-block bold medium" }), h("ptc-spacer", { size: "medium" }), h("div", { class: "is-grid has-row-gap-md  has-col-gap-lg" }, h("div", { class: "is-col-8-lg" }, h("div", { class: "is-grid has-col-gap-lg" }, h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }), h("div", { class: "is-col-6-md skeleton-block card-block" }))), h("div", { class: "is-col-4-lg skeleton-block big-card-block" })), h("ptc-spacer", { size: "medium" }), h("div", { class: "skeleton-block cta thick center" })))));
-      }
-      case 'resource-center':
-        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" })))))))));
       default:
         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" })))))));
     }

package/dist/collection/components/ptc-previous-url/ptc-previous-url.css

@@ -82,4 +82,20 @@ ptc-link, ptc-square-card,
   text-decoration: underline;
   text-decoration-color: var(--color-green-07);
   outline: none;
+}
+
+.light {
+  display: inline-block;
+  background: rgba(0, 0, 0, 0.54);
+  border-radius: 4px;
+  padding: 0.5rem 0.75rem;
+  padding: 0.25rem 1rem 0.5rem 0.75rem;
+  cursor: pointer;
+  position: relative;
+  display: block;
+}
+.light:hover span {
+  text-decoration: underline;
+  text-decoration-color: var(--color-green-07);
+  outline: none;
 }

package/dist/collection/components/ptc-previous-url/ptc-previous-url.js

@@ -3,10 +3,18 @@ export class PtcPreviousUrl {
   constructor() {
     this.href = undefined;
     this.text = undefined;
+    this.theme = 'standard';
     this.styles = undefined;
   }
   render() {
-    return (h(Host, null, this.styles && h("style", null, this.styles), h("list-item", { listType: 'breadcrumb', flushBefore: true, "link-href": this.href }, h("ptc-svg-btn", { class: "backarrow", "svg-name": "back-arrow", display: "inline-block" }), h("a", { class: "back-to-videos" }, this.text)), h("slot", null)));
+    return (h(Host, null, this.styles && h("style", null, this.styles), h("list-item", { listType: 'breadcrumb', flushBefore: true, "link-href": this.href }, this.theme == 'light' ?
+      (h("a", { class: this.getCssClassMap() }, h("ptc-svg-btn", { class: "backarrow", "svg-name": "back-arrow", display: "inline-block" }), h("span", { class: "back-to-videos" }, this.text))) :
+      [h("ptc-svg-btn", { class: "backarrow", "svg-name": "back-arrow", display: "inline-block" }), h("a", { class: "back-to-videos" }, this.text)]), h("slot", null)));
+  }
+  getCssClassMap() {
+    return {
+      [this.theme]: true
+    };
   }
   static get is() { return "ptc-previous-url"; }
   static get encapsulation() { return "shadow"; }
@@ -56,6 +64,24 @@ export class PtcPreviousUrl {
         "attribute": "text",
         "reflect": false
       },
+      "theme": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'standard' | 'light'",
+          "resolved": "\"light\" | \"standard\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "theme",
+        "reflect": false,
+        "defaultValue": "'standard'"
+      },
       "styles": {
         "type": "string",
         "mutable": false,

package/dist/collection/components/ptc-pricing-tabs/ptc-pricing-tabs.css

@@ -1095,6 +1095,18 @@ ptc-preloader-section.min-height {
   color: var(--color-white);
 }
 
+ptc-nav-submenu {
+  border-left: 2px solid transparent;
+  border-right: 2px solid transparent;
+}
+ptc-nav-submenu:focus-visible, ptc-nav-submenu:focus {
+  border-radius: var(--ptc-border-radius-standard);
+  border: 2px solid white;
+  outline: 5px solid var(--keyboard-nav-outline);
+  margin-top: -2px;
+  margin-bottom: -2px;
+}
+
 :host {
   display: block;
   color: var(--color-gray-10);