@ptcwebops/ptcw-design 4.7.5 → 4.7.6

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

@@ -404,6 +404,7 @@ a.center {
 }
 .ptc-primary:active {
   background-color: var(--color-black);
+  transition: none;
 }
 .ptc-primary span {
   color: var(--color-white);
@@ -422,6 +423,7 @@ a.center {
 }
 .ptc-secondary:active {
   background-color: var(--color-black);
+  transition: none;
 }
 .ptc-secondary span {
   color: var(--color-white);
@@ -440,6 +442,7 @@ a.center {
 }
 .ptc-tertiary:active {
   background-color: var(--color-gray-03);
+  transition: none;
 }
 .ptc-tertiary span {
   color: var(--color-gray-10);
@@ -458,6 +461,7 @@ a.center {
 }
 .ptc-quaternary:active {
   background-color: var(--color-green-09);
+  transition: none;
 }
 .ptc-quaternary span {
   color: var(--color-white);
@@ -489,6 +493,7 @@ a.center {
   background-color: var(--color-gray-05);
 }
 .icon-toggle.active:active {
+  transition: none;
   background-color: var(--color-gray-03);
 }
 .icon-toggle:focus {

package/dist/collection/components/ptc-close-icon/ptc-close-icon.css

@@ -79,6 +79,7 @@ ptc-link, ptc-square-card,
   border-color: var(--color-gray-12);
 }
 :host .close-icon:active svg {
+  transition-duration: 0ms;
   background-color: var(--color-gray-02);
   border: 1px solid var(--color-gray-12);
 }

package/dist/collection/components/ptc-featured-list/ptc-featured-list.css

@@ -66,6 +66,7 @@ a:visited {
   color: var(--color-blue-10);
 }
 a:active, a:visited:active {
+  transition: none;
   color: var(--color-blue-09);
 }
 a:hover, a:visited:hover {
@@ -83,6 +84,7 @@ a.disabled {
   color: var(--color-blue-06);
 }
 .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 {
+  transition: none;
   color: var(--color-blue-07);
 }
 .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 {
@@ -108,6 +110,7 @@ a.disabled {
   color: var(--color-gray-10);
 }
 .ptc-link:active, .ptc-link:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link:hover, .ptc-link:visited:hover {
@@ -129,6 +132,7 @@ a.disabled {
   color: var(--color-white);
 }
 .ptc-link-dark:active, .ptc-link-dark:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link-dark:hover, .ptc-link-dark:visited:hover {

package/dist/collection/components/ptc-filter-level-theater/ptc-filter-level-theater.css

@@ -123,6 +123,7 @@ a:visited {
   color: var(--color-blue-10);
 }
 a:active, a:visited:active {
+  transition: none;
   color: var(--color-blue-09);
 }
 a:hover, a:visited:hover {
@@ -140,6 +141,7 @@ a.disabled {
   color: var(--color-blue-06);
 }
 .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 {
+  transition: none;
   color: var(--color-blue-07);
 }
 .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 {
@@ -165,6 +167,7 @@ a.disabled {
   color: var(--color-gray-10);
 }
 .ptc-link:active, .ptc-link:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link:hover, .ptc-link:visited:hover {
@@ -186,6 +189,7 @@ a.disabled {
   color: var(--color-white);
 }
 .ptc-link-dark:active, .ptc-link-dark:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link-dark:hover, .ptc-link-dark:visited:hover {
@@ -307,7 +311,8 @@ a.disabled {
 :host .flt-wrapper .content-tab-wrapper .flt-content-wrap .flt-content {
   display: none;
 }
-:host .flt-wrapper .content-tab-wrapper .flt-content-wrap .flt-content p, :host .flt-wrapper .content-tab-wrapper .flt-content-wrap .flt-content ul li {
+:host .flt-wrapper .content-tab-wrapper .flt-content-wrap .flt-content p,
+:host .flt-wrapper .content-tab-wrapper .flt-content-wrap .flt-content ul li {
   font-size: 18px;
   line-height: 1.5;
   color: var(--color-white);
@@ -351,14 +356,18 @@ a.disabled {
     padding-bottom: 0;
   }
 }
-:host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .tab-box, :host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list ptc-button, :host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .flt-social-icon-list {
+:host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .tab-box,
+:host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list ptc-button,
+:host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .flt-social-icon-list {
   max-width: 304px;
   min-width: 223px;
   margin-right: 24px;
   margin-bottom: 0;
 }
 @media only screen and (min-width: 768px) {
-  :host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .tab-box, :host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list ptc-button, :host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .flt-social-icon-list {
+  :host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .tab-box,
+:host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list ptc-button,
+:host .flt-wrapper .content-tab-wrapper .flt-tab-wrapper .tab-list .flt-social-icon-list {
     min-width: auto;
     margin-bottom: 24px;
     margin-right: 0;
@@ -407,7 +416,11 @@ a.disabled {
     margin-right: 40px;
   }
 }
-:host p, :host ul, :host li, :host ptc-title .sc-ptc-title, :host span {
+:host p,
+:host ul,
+:host li,
+:host ptc-title .sc-ptc-title,
+:host span {
   word-break: break-word;
   hyphens: manual;
   -webkit-hyphens: manual;
@@ -415,7 +428,11 @@ a.disabled {
   -ms-hyphens: manual;
 }
 @supports (hyphenate-limit-chars: 12 3 3) {
-  :host p, :host ul, :host li, :host ptc-title .sc-ptc-title, :host span {
+  :host p,
+:host ul,
+:host li,
+:host ptc-title .sc-ptc-title,
+:host span {
     hyphens: auto;
     -webkit-hyphenate-limit-before: 3;
     /* For Safari */
@@ -453,6 +470,7 @@ a:visited {
 }
 a:active, a:visited:active {
   color: #104E7B;
+  transition: none;
 }
 a:hover, a:visited:hover {
   color: #14629A;

package/dist/collection/components/ptc-filter-tag/ptc-filter-tag.css

@@ -125,6 +125,7 @@ ptc-link, ptc-square-card,
   background-color: var(--color-gray-10);
 }
 .ptc-filter-tag.button:active {
+  transition: none;
   background-color: var(--color-black);
 }
 .ptc-filter-tag.button .cls {

package/dist/collection/components/ptc-footer/ptc-footer-v2.css

@@ -59,6 +59,7 @@ ptc-footer {
   color: var(--color-white);
   background-color: var(--color-gray-12);
   position: relative;
+  z-index: 2;
 }
 ptc-footer ul {
   padding: 0;
@@ -66,22 +67,25 @@ ptc-footer ul {
   list-style: none;
 }
 ptc-footer ul li a {
-  text-decoration: none;
+  text-decoration: underline;
+  text-underline-offset: 6px;
+  text-decoration-thickness: 1px;
+  text-decoration-color: transparent;
   color: var(--color-white);
-  border-bottom: 1px solid transparent;
-  transition: border-bottom-color var(--ptc-transition-medium) var(--ptc-ease-inout);
+  border-bottom: none;
+  transition: text-decoration var(--ptc-transition-medium) var(--ptc-ease-inout);
 }
 ptc-footer ul li a:hover {
   color: var(--color-white) !important;
-  border-bottom-color: var(--color-white);
+  text-decoration-color: var(--color-white);
 }
 ptc-footer ul li a:visited {
   color: var(--color-white);
 }
 ptc-footer ul li a:active {
   color: var(--color-gray-04) !important;
-  border-bottom-color: var(--color-gray-04);
   transition: none;
+  text-decoration-color: var(--color-gray-04);
 }
 ptc-footer .gap-20 {
   grid-column-gap: 20px;
@@ -145,7 +149,7 @@ ptc-footer .footer-top .f-menu {
 @media only screen and (min-width: 1200px) {
   ptc-footer .footer-top .f-menu {
     justify-content: flex-start;
-    max-width: 410px;
+    max-width: 413px;
     gap: 80px;
   }
 }
@@ -330,7 +334,7 @@ ptc-footer .ft-grid .ft-menu {
 @media only screen and (min-width: 992px) {
   ptc-footer .ft-grid .ft-menu {
     width: auto;
-    min-width: 410px;
+    min-width: 413px;
     max-width: 430px;
   }
 }

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

@@ -1149,6 +1149,7 @@ a:visited {
   color: var(--color-blue-10);
 }
 a:active, a:visited:active {
+  transition: none;
   color: var(--color-blue-09);
 }
 a:hover, a:visited:hover {
@@ -1166,6 +1167,7 @@ a.disabled {
   color: var(--color-blue-06);
 }
 .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 {
+  transition: none;
   color: var(--color-blue-07);
 }
 .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
@@ -1191,6 +1193,7 @@ a.disabled {
   color: var(--color-gray-10);
 }
 .ptc-link:active, .ptc-link:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link:hover, .ptc-link:visited:hover {
@@ -1212,6 +1215,7 @@ a.disabled {
   color: var(--color-white);
 }
 .ptc-link-dark:active, .ptc-link-dark:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link-dark:hover, .ptc-link-dark:visited:hover {

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

@@ -100,6 +100,7 @@ ptc-link, ptc-square-card,
 }
 .global:active, .global:visited:active {
   color: var(--color-blue-09);
+  transition: none;
 }
 .global:hover, .global:visited:hover {
   color: var(--color-blue-08);

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

@@ -104,12 +104,15 @@ ptc-link, ptc-square-card,
 .standard-filter .standard-filter-item:active {
   background-color: var(--color-gray-05);
   text-decoration: none;
+  transition: none;
 }
 .standard-filter .standard-filter-item.active {
+  transition: none;
   background-color: var(--color-gray-12);
   color: var(--color-white);
 }
 .standard-filter .standard-filter-item.active:hover {
+  transition: background-color var(--ptc-ease-out) var(--ptc-transition-medium);
   background-color: var(--color-gray-12);
   cursor: default;
 }
@@ -133,6 +136,7 @@ ptc-link, ptc-square-card,
   text-decoration: none;
 }
 .standard-filter .next-button:active, .standard-filter .previous-button:active {
+  transition: none;
   background-color: var(--color-gray-05);
   text-decoration: none;
 }

package/dist/collection/components/ptc-quantity-counter/ptc-quantity-counter.css

@@ -104,6 +104,7 @@ ptc-link, ptc-square-card,
   background-color: var(--color-gray-02);
 }
 :host .quantity-counter button:active span {
+  transition: none;
   background-color: var(--color-gray-03);
 }
 :host .quantity-counter input {

package/dist/collection/components/ptc-search-field/ptc-search-field.css

@@ -107,6 +107,7 @@ ptc-link, ptc-square-card,
   margin: 0;
 }
 :host .search-div .search-btn:active {
+  transition: none;
   background-color: var(--color-black);
 }
 :host .search-div .search-btn:hover {

package/dist/collection/components/ptc-social-icons-footer/ptc-social-icons-footer.css

@@ -88,6 +88,9 @@ ptc-link, ptc-square-card,
   }
 }
 :host ul li {
+  width: 100%;
+}
+:host ul li a {
   background-color: var(--color-gray-10);
   border-radius: 4px;
   display: flex;
@@ -99,22 +102,17 @@ ptc-link, ptc-square-card,
   width: 100%;
   transition: background-color var(--ptc-transition-medium) var(--ptc-ease-inout);
 }
-:host ul li:hover {
+:host ul li a:hover {
   background-color: var(--color-gray-08);
 }
-:host ul li:active {
+:host ul li a:active {
   background-color: var(--color-gray-09);
   transition: none;
 }
 @media only screen and (min-width: 992px) {
-  :host ul li {
+  :host ul li a {
+    padding: 4px;
     width: 36px;
     height: 36px;
   }
-}
-:host ul li a {
-  box-sizing: border-box;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
 }

package/dist/collection/components/ptc-white-paper/ptc-white-paper.css

@@ -5643,6 +5643,7 @@ a:visited {
   color: var(--color-blue-10);
 }
 a:active, a:visited:active {
+  transition: none;
   color: var(--color-blue-09);
 }
 a:hover, a:visited:hover {
@@ -5660,6 +5661,7 @@ a.disabled {
   color: var(--color-blue-06);
 }
 .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 {
+  transition: none;
   color: var(--color-blue-07);
 }
 .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 {
@@ -5685,6 +5687,7 @@ a.disabled {
   color: var(--color-gray-10);
 }
 .ptc-link:active, .ptc-link:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link:hover, .ptc-link:visited:hover {
@@ -5706,6 +5709,7 @@ a.disabled {
   color: var(--color-white);
 }
 .ptc-link-dark:active, .ptc-link-dark:visited:active {
+  transition: none;
   color: var(--color-green-06);
 }
 .ptc-link-dark:hover, .ptc-link-dark:visited:hover {