@ptcwebops/ptcw-design 2.4.2 → 2.4.5
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.
- package/dist/cjs/ptc-card.cjs.entry.js +1 -1
- package/dist/cjs/ptc-nav-link.cjs.entry.js +1 -1
- package/dist/cjs/ptc-nav-submenu.cjs.entry.js +2 -2
- package/dist/cjs/ptc-pricing-add-on-card.cjs.entry.js +1 -1
- package/dist/cjs/ptc-pricing-table.cjs.entry.js +94 -11
- package/dist/cjs/ptc-subnav.cjs.entry.js +1 -1
- package/dist/collection/components/ptc-card/ptc-card.css +1 -1
- package/dist/collection/components/ptc-pricing-add-on-card/ptc-pricing-add-on-card.css +2 -2
- package/dist/collection/components/ptc-pricing-table/ptc-pricing-table.css +92 -106
- package/dist/collection/components/ptc-pricing-table/ptc-pricing-table.js +93 -10
- package/dist/collection/components/subnav/ptc-nav-link/ptc-nav-link.css +20 -4
- package/dist/collection/components/subnav/ptc-nav-submenu/ptc-nav-submenu.css +26 -50
- package/dist/collection/components/subnav/ptc-nav-submenu/ptc-nav-submenu.js +1 -1
- package/dist/collection/components/subnav/ptc-subnav/ptc-subnav.css +12 -28
- package/dist/custom-elements/index.js +100 -17
- package/dist/esm/ptc-card.entry.js +1 -1
- package/dist/esm/ptc-nav-link.entry.js +1 -1
- package/dist/esm/ptc-nav-submenu.entry.js +2 -2
- package/dist/esm/ptc-pricing-add-on-card.entry.js +1 -1
- package/dist/esm/ptc-pricing-table.entry.js +94 -11
- package/dist/esm/ptc-subnav.entry.js +1 -1
- package/dist/ptcw-design/p-30feb059.entry.js +1 -0
- package/dist/ptcw-design/p-5129270f.entry.js +1 -0
- package/dist/ptcw-design/p-60727256.entry.js +1 -0
- package/dist/ptcw-design/{p-f8eacbd8.entry.js → p-ef79c1f5.entry.js} +1 -1
- package/dist/ptcw-design/{p-05cc800d.entry.js → p-f6cf3eea.entry.js} +1 -1
- package/dist/ptcw-design/p-fd6d40c3.entry.js +1 -0
- package/dist/ptcw-design/ptcw-design.css +1 -1
- package/dist/ptcw-design/ptcw-design.esm.js +1 -1
- package/dist/types/components/ptc-pricing-table/ptc-pricing-table.d.ts +8 -0
- package/package.json +1 -1
- package/readme.md +1 -1
- package/dist/ptcw-design/p-3192a7e8.entry.js +0 -1
- package/dist/ptcw-design/p-66fcd7b2.entry.js +0 -1
- package/dist/ptcw-design/p-7a3cf557.entry.js +0 -1
- package/dist/ptcw-design/p-ca877fea.entry.js +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host } from './index-22a84644.js';
|
|
2
2
|
|
|
3
|
-
const ptcCardCss = ":host{display:block}:host(.lottie-card) .card-border{box-shadow:var(--ptc-shadow-small);border:1px solid var(--color-gray-03);border-radius:10px;position:relative;overflow:hidden}:host(.lottie-card) .card-border::after{content:\"\";height:40%;width:4px;position:absolute;top:30%;right:-2px;background-color:var(--color-green-06);z-index:2;display:block}:host(.lottie-card) .card-border:hover{box-shadow:var(--ptc-shadow-x-large)}:host(.lottie-card) .card-border:hover .card-body h3{border-bottom:2px solid var(--color-green-07)}:host(.lottie-card) .card-layout{display:block}@media only screen and (min-width: 768px){:host(.lottie-card) .card-layout{display:flex;flex-flow:nowrap row;justify-content:center}}:host(.lottie-card) .link-wrapper{outline:none;text-decoration:none;color:var(--color-gray-10)}:host(.lottie-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.lottie-card) .card-media{flex-basis:40%;border-right:1px solid var(--color-gray-03);display:flex}:host(.lottie-card) .card-body{flex-basis:60%;align-self:center;padding:0 30px 10px}:host(.lottie-card) .card-body h3{display:inline-block;line-height:var(--ptc-line-height-densest);color:var(--color-gray-10);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);border-bottom:2px solid transparent;margin-bottom:var(--ptc-element-spacing-02)}:host(.simple-card) .card-layout{display:block}:host(.simple-card) .link-wrapper{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover .card-body h3{color:var(--color-green-06)}:host(.simple-card) .link-wrapper:hover .card-body h3::before{width:100%}:host(.simple-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-04)}:host(.simple-card) .card-body h3{color:var(--color-gray-10);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-black);line-height:var(--ptc-line-height-dense);position:relative;margin-bottom:var(--ptc-element-spacing-02);display:inline-block}:host(.simple-card) .card-body h3::before{display:block;position:absolute;content:\"\";width:100%;border-bottom:2px solid var(--color-green-06);bottom:1px;transition:width var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.simple-card) ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-01);transition:margin-left var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .card-border{overflow:hidden;filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 3px 6px);width:100%}:host(.clip-edge-card) .card-border:hover{filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 6px 12px)}:host(.clip-edge-card) .card-layout{display:block}:host(.clip-edge-card) .link-wrapper{outline:none;text-decoration:none}:host(.clip-edge-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.clip-edge-card) .card-media{position:relative;width:100%;height:124px;overflow:hidden;border-radius:var(--ptc-border-radius-standard)}:host(.clip-edge-card) .card-body{transform:translateY(calc(-1 * var(--ptc-element-spacing-04)));overflow:hidden;width:calc(95% - var(--ptc-element-spacing-04) - var(--ptc-element-spacing-04));font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);clip-path:var(--ptc-clip-path-bottom-right);background-color:var(--color-white);border-radius:var(--ptc-border-radius-standard);padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-03) var(--ptc-element-spacing-04)}:host(.clip-edge-card) .card-body h3{display:inline-block;margin:0px;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);text-decoration:none;border-bottom:2px solid transparent;transition:border-bottom var(--ptc-transition-medium) var(--ptc-ease-inout), margin var(--ptc-transition-medium) var(--ptc-ease-inout);margin:var(--ptc-element-spacing-03) 0 var(--ptc-element-spacing-03) 0}:host(.clip-edge-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-image]){display:block;width:100%;height:100%;transform:scale(1);transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transform-origin:top center}:host(.clip-edge-card) ::slotted([slot=slot-after-heading]){position:absolute;top:var(--ptc-element-spacing-03);left:var(--ptc-element-spacing-04);opacity:1;transform:scale(1);height:44px;transform-origin:bottom center;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-before-heading]){display:block;opacity:0;height:24px;transition:all var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .link-wrapper:hover .card-body h3{border-bottom:2px solid var(--color-green-06)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:60px;opacity:1}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-image]){transform:scale(1.1)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){opacity:0;transform:scale(0);height:0}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-before-heading]){opacity:1}:host(.hightlight-card) .card-border{width:100%;border-radius:var(--ptc-border-radius-standard);overflow:hidden}:host(.hightlight-card) .card-border:hover .card-media{transform:scale(1.1)}:host(.hightlight-card) .card-layout{display:block;position:relative}:host(.hightlight-card) .link-wrapper{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:96px;opacity:1}@media only screen and (min-width: 768px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 992px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-06)}}@media only screen and (min-width: 1440px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}:host(.hightlight-card) .card-media{width:100%;height:auto;min-height:450px;position:relative;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.hightlight-card) .card-body{position:absolute;bottom:0;top:auto;left:0;right:auto;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-07);background-color:var(--color-white);box-sizing:border-box}:host(.hightlight-card) .card-body h3{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-bold);color:var(--color-gray-10);margin:var(--ptc-element-spacing-04) 0}:host(.hightlight-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-fast) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.horizontal-card){margin-bottom:var(--ptc-layout-spacing-02)}:host(.horizontal-card) .card-layout{position:relative}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-layout{display:grid;grid-template-columns:42% 58%;direction:ltr;grid-auto-rows:1fr}}:host(.horizontal-card) .link-wrapper{outline:none;text-decoration:none;transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .link-wrapper:hover{box-shadow:var(--ptc-shadow-large);transition:var(--ptc-transition-slow) linear;background-color:var(--color-white)}:host(.horizontal-card) .link-wrapper:hover h3{border-color:var(--color-green-06);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .card-media{display:flex;align-self:center}:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-05) var(--ptc-element-spacing-04)}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-07)}}:host(.horizontal-card) .card-body h3{margin-top:0;font-size:var(--ptc-font-size-x-small);color:var(--color-gray-10);border-bottom:1px solid transparent;padding-bottom:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-02);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) ::slotted([slot=slot-image]){box-shadow:var(--ptc-shadow-medium);width:100%}:host(.listing-card){height:100%}:host(.listing-card) .card-border{width:100%;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:100%;display:flex;flex-direction:row}:host(.listing-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.listing-card) .card-layout{display:block;position:relative;width:100%;height:100%}:host(.listing-card) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card) .card-media{width:100%;height:288px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.listing-card) .card-media .smart-img{height:288px}@media (min-width: 768px){:host(.listing-card) .card-media .smart-img{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media .smart-img{height:170px}}@media (min-width: 768px){:host(.listing-card) .card-media{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media{height:170px}}:host(.listing-card) .card-body{padding:16px 20px 0px 20px}:host(.listing-card) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block;margin-top:0rem}:host(.listing-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.listing-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:1rem}:host(.listing-card-horizontal){height:100%}:host(.listing-card-horizontal) .card-border{overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;width:100%;height:100%}@media (min-width: 1200px) and (max-width: 1439){:host(.listing-card-horizontal) .card-border{margin-left:16px}}:host(.listing-card-horizontal) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card-horizontal) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card-horizontal) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.listing-card-horizontal) .card-layout{display:flex;flex-direction:row;width:100%}:host(.listing-card-horizontal) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card-horizontal) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card-horizontal) .card-media{width:100%;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium);display:none;max-width:260px}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-media{display:block;min-width:260px}}:host(.listing-card-horizontal) .card-body{padding:16px 24px 0px 24px}@media (min-width: 768px){:host(.listing-card-horizontal) .card-body{padding:24px 32px 0px 32px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body{padding:8px 16px 0px 16px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body{padding:14px 32px 0px 32px}}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body{min-width:505px}}:host(.listing-card-horizontal) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card-horizontal) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:12px;display:inline-block;margin-top:0rem;margin-block-start:0rem}@media only screen and (min-width: 1200px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:20px}}@media only screen and (min-width: 1440px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:24px}}@media only screen and (min-width: 1600px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:32px}}:host(.listing-card-horizontal) .card-body .small{font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:12px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:16px}}:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:19px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}@media (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:12px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}}:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:19px;margin-top:0rem;margin-block-start:0rem}:host(.listing-card-horizontal) ::slotted([slot=slot-description]) p{margin-block-start:0rem}@media (max-width: 767px){:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-weight:400;font-size:14px;line-height:16px}}:host(.resource-center-card){height:100%}:host(.resource-center-card) .card-border{height:100%;width:100%;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;display:flex;flex-direction:row}:host(.resource-center-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.resource-center-card) .card-border:hover .card-media{background:var(--color-white)}:host(.resource-center-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.resource-center-card) .card-layout{display:block;position:relative}:host(.resource-center-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-top:24px;background-color:var(--color-white);padding:4px 24px;font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);color:var(--color-gray-11);border-radius:0px 3px 3px 0px;box-shadow:var(--ptc-shadow-small);max-width:70%;max-height:30px;line-height:30px;overflow:hidden}:host(.resource-center-card) .link-wrapper{outline:none;text-decoration:none}:host(.resource-center-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.resource-center-card) .card-media{width:100%;height:250px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.resource-center-card) .card-media .smart-img{height:250px}@media (min-width: 480px){:host(.resource-center-card) .card-media .smart-img{height:285px}}@media (min-width: 768px){:host(.resource-center-card) .card-media .smart-img{height:221px}}@media (min-width: 992px){:host(.resource-center-card) .card-media .smart-img{height:189px}}@media (min-width: 1200px){:host(.resource-center-card) .card-media .smart-img{height:173px}}@media (min-width: 1440px){:host(.resource-center-card) .card-media .smart-img{height:173px}}@media (min-width: 480px){:host(.resource-center-card) .card-media{height:285px}}@media (min-width: 768px){:host(.resource-center-card) .card-media{height:221px}}@media (min-width: 992px){:host(.resource-center-card) .card-media{height:189px}}@media (min-width: 1200px){:host(.resource-center-card) .card-media{height:173px}}@media (min-width: 1440px){:host(.resource-center-card) .card-media{height:173px}}:host(.resource-center-card) .card-body{padding:16px 24px 0px 24px}@media (min-width: 768px){:host(.resource-center-card) .card-body{padding:14px 24px 0px 24px}}@media (min-width: 1200px){:host(.resource-center-card) .card-body{padding:14px 20px 0px 21px}}:host(.resource-center-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.resource-center-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:12px;margin-top:0rem;word-break:break-word;hyphens:auto}:host(.resource-center-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:1rem}:host(.resource-center-card) ::slotted([slot=slot-description]) p{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.resource-center-card) ::slotted([slot=slot-description]) span{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.case-studies-card){height:100%}:host(.case-studies-card) .card-border{width:100%;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;display:flex;flex-direction:row;height:100%}:host(.case-studies-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.case-studies-card) .card-border:hover .card-media{background:var(--color-white)}:host(.case-studies-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.case-studies-card) .card-layout{display:block;position:relative;width:100%}:host(.case-studies-card) .link-wrapper{outline:none;text-decoration:none}:host(.case-studies-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.case-studies-card) .card-media{width:100%;height:200px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.case-studies-card) .card-media .smart-img{width:100%;height:200px}@media (min-width: 480px){:host(.case-studies-card) .card-media .smart-img{height:286px}}@media (min-width: 768px){:host(.case-studies-card) .card-media .smart-img{height:224px}}@media (min-width: 992px){:host(.case-studies-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.case-studies-card) .card-media .smart-img{height:173px}}@media (min-width: 1440px){:host(.case-studies-card) .card-media .smart-img{height:170px}}@media (min-width: 480px){:host(.case-studies-card) .card-media{height:286px}}@media (min-width: 768px){:host(.case-studies-card) .card-media{height:224px}}@media (min-width: 992px){:host(.case-studies-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.case-studies-card) .card-media{height:173px}}@media (min-width: 1440px){:host(.case-studies-card) .card-media{height:170px}}:host(.case-studies-card) .card-body .card-logo-container{padding:8px 20px;border-bottom:1px solid #E4E7E9}:host(.case-studies-card) .card-body .card-logo-none{padding-top:16px}:host(.case-studies-card) .card-body .card-logo{max-width:280px;width:auto;height:40px;object-fit:cover;border:1px solid #E4E7E9;margin-bottom:8px}:host(.case-studies-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin:8px 20px 12px 20px}:host(.case-studies-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin:0px 20px 16px 20px}:host(.related-card){width:100%;height:100%}:host(.related-card) .card-border{background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:var(--ptc-border-radius-standard);width:100%;height:100%;display:flex;flex-direction:row}:host(.related-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.related-card) .card-border:hover .card-media{background:var(--color-white);border-top-left-radius:var(--ptc-border-radius-standard);border-top-right-radius:var(--ptc-border-radius-standard)}:host(.related-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.related-card) .card-layout{display:block;position:relative;width:100%;height:100%}:host(.related-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-top:var(--ptc-element-spacing-06);background-color:var(--color-white);padding:var(--ptc-element-spacing-01) var(--ptc-element-spacing-05);font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);color:var(--color-gray-11);border-radius:0px 3px 3px 0px;box-shadow:var(--ptc-shadow-small);max-height:20px;overflow:hidden;width:fit-content;clip-path:inset(-6px -6px -6px 0px)}:host(.related-card) .link-wrapper{outline:none;text-decoration:none}:host(.related-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.related-card) .card-media{width:100%;height:288px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.related-card) .card-media .smart-img{height:288px}@media only screen and (min-width: 480px){:host(.related-card) .card-media .smart-img{height:286px}}@media only screen and (min-width: 768px){:host(.related-card) .card-media .smart-img{height:142px}}@media only screen and (min-width: 992px){:host(.related-card) .card-media .smart-img{height:192px}}@media only screen and (min-width: 1200px){:host(.related-card) .card-media .smart-img{height:237px}}@media only screen and (min-width: 1440px){:host(.related-card) .card-media .smart-img{height:248px}}@media only screen and (min-width: 480px){:host(.related-card) .card-media{height:286px}}@media only screen and (min-width: 768px){:host(.related-card) .card-media{height:142px}}@media only screen and (min-width: 992px){:host(.related-card) .card-media{height:192px}}@media only screen and (min-width: 1200px){:host(.related-card) .card-media{height:237px}}@media only screen and (min-width: 1440px){:host(.related-card) .card-media{height:248px}}:host(.related-card) .card-body{box-sizing:border-box;padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}:host(.related-card) .card-body .card-date-text{display:flex;flex-direction:row}:host(.related-card) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block;margin-top:0rem}:host(.related-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.related-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.related-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:18px;color:var(--color-gray-11)}.ptc-h3.uppercase{text-transform:uppercase}.ptc-h3.capitalize{text-transform:capitalize}.ptc-h3.lowercase{text-transform:lowercase}.ptc-h3.none{text-transform:none}";
|
|
3
|
+
const ptcCardCss = ":host{display:block}:host(.lottie-card) .card-border{box-shadow:var(--ptc-shadow-small);border:1px solid var(--color-gray-03);border-radius:10px;position:relative;overflow:hidden}:host(.lottie-card) .card-border::after{content:\"\";height:40%;width:4px;position:absolute;top:30%;right:-2px;background-color:var(--color-green-06);z-index:2;display:block}:host(.lottie-card) .card-border:hover{box-shadow:var(--ptc-shadow-x-large)}:host(.lottie-card) .card-border:hover .card-body h3{border-bottom:2px solid var(--color-green-07)}:host(.lottie-card) .card-layout{display:block}@media only screen and (min-width: 768px){:host(.lottie-card) .card-layout{display:flex;flex-flow:nowrap row;justify-content:center}}:host(.lottie-card) .link-wrapper{outline:none;text-decoration:none;color:var(--color-gray-10)}:host(.lottie-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.lottie-card) .card-media{flex-basis:40%;border-right:1px solid var(--color-gray-03);display:flex}:host(.lottie-card) .card-body{flex-basis:60%;align-self:center;padding:0 30px 10px}:host(.lottie-card) .card-body h3{display:inline-block;line-height:var(--ptc-line-height-densest);color:var(--color-gray-10);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);border-bottom:2px solid transparent;margin-bottom:var(--ptc-element-spacing-02)}:host(.simple-card) .card-layout{display:block}:host(.simple-card) .link-wrapper{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.simple-card) .link-wrapper:hover .card-body h3{color:var(--color-green-06)}:host(.simple-card) .link-wrapper:hover .card-body h3::before{width:100%}:host(.simple-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-04)}:host(.simple-card) .card-body h3{color:var(--color-gray-10);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-black);line-height:var(--ptc-line-height-dense);position:relative;margin-bottom:var(--ptc-element-spacing-02);display:inline-block}:host(.simple-card) .card-body h3::before{display:block;position:absolute;content:\"\";width:100%;border-bottom:2px solid var(--color-green-06);bottom:1px;transition:width var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.simple-card) ::slotted([slot=slot-after-heading]){margin-left:var(--ptc-element-spacing-01);transition:margin-left var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .card-border{overflow:hidden;filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 3px 6px);width:100%}:host(.clip-edge-card) .card-border:hover{filter:drop-shadow(rgba(0, 0, 0, 0.32) 0px 6px 12px)}:host(.clip-edge-card) .card-layout{display:block}:host(.clip-edge-card) .link-wrapper{outline:none;text-decoration:none}:host(.clip-edge-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.clip-edge-card) .card-media{position:relative;width:100%;height:124px;overflow:hidden;border-radius:var(--ptc-border-radius-standard)}:host(.clip-edge-card) .card-body{transform:translateY(calc(-1 * var(--ptc-element-spacing-04)));overflow:hidden;width:calc(95% - var(--ptc-element-spacing-04) - var(--ptc-element-spacing-04));font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-medium);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);clip-path:var(--ptc-clip-path-bottom-right);background-color:var(--color-white);border-radius:var(--ptc-border-radius-standard);padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-03) var(--ptc-element-spacing-04)}:host(.clip-edge-card) .card-body h3{display:inline-block;margin:0px;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-dense);color:var(--color-gray-10);text-decoration:none;border-bottom:2px solid transparent;transition:border-bottom var(--ptc-transition-medium) var(--ptc-ease-inout), margin var(--ptc-transition-medium) var(--ptc-ease-inout);margin:var(--ptc-element-spacing-03) 0 var(--ptc-element-spacing-03) 0}:host(.clip-edge-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-image]){display:block;width:100%;height:100%;transform:scale(1);transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transform-origin:top center}:host(.clip-edge-card) ::slotted([slot=slot-after-heading]){position:absolute;top:var(--ptc-element-spacing-03);left:var(--ptc-element-spacing-04);opacity:1;transform:scale(1);height:44px;transform-origin:bottom center;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) ::slotted([slot=slot-before-heading]){display:block;opacity:0;height:24px;transition:all var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.clip-edge-card) .link-wrapper:hover .card-body h3{border-bottom:2px solid var(--color-green-06)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:60px;opacity:1}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-image]){transform:scale(1.1)}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-after-heading]){opacity:0;transform:scale(0);height:0}:host(.clip-edge-card) .link-wrapper:hover ::slotted([slot=slot-before-heading]){opacity:1}:host(.hightlight-card) .card-border{width:100%;border-radius:var(--ptc-border-radius-standard);overflow:hidden}:host(.hightlight-card) .card-border:hover .card-media{transform:scale(1.1)}:host(.hightlight-card) .card-layout{display:block;position:relative}:host(.hightlight-card) .link-wrapper{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:96px;opacity:1}@media only screen and (min-width: 768px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}@media only screen and (min-width: 992px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-06)}}@media only screen and (min-width: 1440px){:host(.hightlight-card) .link-wrapper:hover ::slotted([slot=slot-description]){height:var(--ptc-layout-spacing-05)}}:host(.hightlight-card) .card-media{width:100%;height:auto;min-height:450px;position:relative;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.hightlight-card) .card-body{position:absolute;bottom:0;top:auto;left:0;right:auto;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-07);background-color:var(--color-white);box-sizing:border-box}:host(.hightlight-card) .card-body h3{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-bold);color:var(--color-gray-10);margin:var(--ptc-element-spacing-04) 0}:host(.hightlight-card) ::slotted([slot=slot-description]){height:0;opacity:0;transition:height var(--ptc-transition-medium) var(--ptc-ease-inout), opacity var(--ptc-transition-fast) var(--ptc-ease-inout);transition-delay:var(--ptc-delay-5)}:host(.horizontal-card){margin-bottom:var(--ptc-layout-spacing-02)}:host(.horizontal-card) .card-layout{position:relative}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-layout{display:grid;grid-template-columns:42% 58%;direction:ltr;grid-auto-rows:1fr}}:host(.horizontal-card) .link-wrapper{outline:none;text-decoration:none;transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .link-wrapper:hover{box-shadow:var(--ptc-shadow-large);transition:var(--ptc-transition-slow) linear;background-color:var(--color-white)}:host(.horizontal-card) .link-wrapper:hover h3{border-color:var(--color-green-06);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) .card-media{display:flex;align-self:center}:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-05) var(--ptc-element-spacing-04)}@media only screen and (min-width: 768px){:host(.horizontal-card) .card-body{padding:var(--ptc-element-spacing-06) var(--ptc-element-spacing-07)}}:host(.horizontal-card) .card-body h3{margin-top:0;font-size:var(--ptc-font-size-x-small);color:var(--color-gray-10);border-bottom:1px solid transparent;padding-bottom:var(--ptc-element-spacing-01);margin-bottom:var(--ptc-element-spacing-02);transition:var(--ptc-transition-slow) linear}:host(.horizontal-card) ::slotted([slot=slot-image]){box-shadow:var(--ptc-shadow-medium);width:100%}:host(.listing-card){height:100%}:host(.listing-card) .card-border{width:100%;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;height:100%;display:flex;flex-direction:row}:host(.listing-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.listing-card) .card-layout{display:block;position:relative;width:100%;height:100%}:host(.listing-card) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card) .card-media{width:100%;height:288px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.listing-card) .card-media .smart-img{height:288px}@media (min-width: 768px){:host(.listing-card) .card-media .smart-img{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media .smart-img{height:170px}}@media (min-width: 768px){:host(.listing-card) .card-media{height:232px}}@media (min-width: 992px){:host(.listing-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.listing-card) .card-media{height:170px}}:host(.listing-card) .card-body{padding:16px 20px 0px 20px}:host(.listing-card) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block;margin-top:0rem}:host(.listing-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.listing-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.listing-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:1rem}:host(.listing-card-horizontal){height:100%}:host(.listing-card-horizontal) .card-border{overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;width:100%;height:100%}@media (min-width: 1200px) and (max-width: 1439){:host(.listing-card-horizontal) .card-border{margin-left:16px}}:host(.listing-card-horizontal) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.listing-card-horizontal) .card-border:hover .card-media{background:var(--color-white)}:host(.listing-card-horizontal) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.listing-card-horizontal) .card-layout{display:flex;flex-direction:row;width:100%}:host(.listing-card-horizontal) .link-wrapper{outline:none;text-decoration:none}:host(.listing-card-horizontal) .link-wrapper:hover{outline:none;text-decoration:none}:host(.listing-card-horizontal) .card-media{width:100%;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium);display:none;max-width:260px}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-media{display:block;min-width:260px}}:host(.listing-card-horizontal) .card-body{padding:16px 24px 0px 24px}@media (min-width: 768px){:host(.listing-card-horizontal) .card-body{padding:24px 32px 0px 32px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body{padding:8px 16px 0px 16px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body{padding:14px 32px 0px 32px}}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body{min-width:505px}}:host(.listing-card-horizontal) .card-body .card-date-text{display:flex;flex-direction:row}:host(.listing-card-horizontal) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:12px;display:inline-block;margin-top:0rem;margin-block-start:0rem}@media only screen and (min-width: 1200px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:20px}}@media only screen and (min-width: 1440px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:24px}}@media only screen and (min-width: 1600px){:host(.listing-card-horizontal) .card-body .card-date-text p{margin-bottom:32px}}:host(.listing-card-horizontal) .card-body .small{font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:12px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body .small{margin-bottom:16px}}:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:19px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}@media (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media (min-width: 992px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:12px}}@media (min-width: 1200px){:host(.listing-card-horizontal) .card-body h3{margin-bottom:16px}}@media only screen and (min-width: 768px){:host(.listing-card-horizontal) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:8px;margin-top:0rem}}:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:19px;margin-top:0rem;margin-block-start:0rem}:host(.listing-card-horizontal) ::slotted([slot=slot-description]) p{margin-block-start:0rem}@media (max-width: 767px){:host(.listing-card-horizontal) ::slotted([slot=slot-description]){font-weight:400;font-size:14px;line-height:16px}}:host(.resource-center-card){height:100%}:host(.resource-center-card) .card-border{height:100%;width:100%;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;display:flex;flex-direction:row}:host(.resource-center-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.resource-center-card) .card-border:hover .card-media{background:var(--color-white)}:host(.resource-center-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.resource-center-card) .card-layout{display:block;position:relative}:host(.resource-center-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-top:24px;background-color:var(--color-white);padding:4px 24px;font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);color:var(--color-gray-11);border-radius:0px 3px 3px 0px;box-shadow:var(--ptc-shadow-small);max-width:70%;max-height:30px;line-height:30px;overflow:hidden}:host(.resource-center-card) .link-wrapper{outline:none;text-decoration:none}:host(.resource-center-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.resource-center-card) .card-media{width:100%;height:250px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.resource-center-card) .card-media .smart-img{height:250px}@media (min-width: 480px){:host(.resource-center-card) .card-media .smart-img{height:285px}}@media (min-width: 768px){:host(.resource-center-card) .card-media .smart-img{height:221px}}@media (min-width: 992px){:host(.resource-center-card) .card-media .smart-img{height:189px}}@media (min-width: 1200px){:host(.resource-center-card) .card-media .smart-img{height:173px}}@media (min-width: 1440px){:host(.resource-center-card) .card-media .smart-img{height:173px}}@media (min-width: 480px){:host(.resource-center-card) .card-media{height:285px}}@media (min-width: 768px){:host(.resource-center-card) .card-media{height:221px}}@media (min-width: 992px){:host(.resource-center-card) .card-media{height:189px}}@media (min-width: 1200px){:host(.resource-center-card) .card-media{height:173px}}@media (min-width: 1440px){:host(.resource-center-card) .card-media{height:173px}}:host(.resource-center-card) .card-body{padding:16px 24px 0px 24px}@media (min-width: 768px){:host(.resource-center-card) .card-body{padding:14px 24px 0px 24px}}@media (min-width: 1200px){:host(.resource-center-card) .card-body{padding:14px 20px 0px 21px}}:host(.resource-center-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.resource-center-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:12px;margin-top:0rem;word-break:break-word;hyphens:auto}:host(.resource-center-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:1rem}:host(.resource-center-card) ::slotted([slot=slot-description]) p{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.resource-center-card) ::slotted([slot=slot-description]) span{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin-bottom:39px}:host(.case-studies-card){height:100%}:host(.case-studies-card) .card-border{width:100%;overflow:hidden;background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:3px;display:flex;flex-direction:row;height:100%}:host(.case-studies-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.case-studies-card) .card-border:hover .card-media{background:var(--color-white)}:host(.case-studies-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.case-studies-card) .card-layout{display:block;position:relative;width:100%}:host(.case-studies-card) .link-wrapper{outline:none;text-decoration:none}:host(.case-studies-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.case-studies-card) .card-media{width:100%;height:200px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.case-studies-card) .card-media .smart-img{width:100%;height:200px}@media (min-width: 480px){:host(.case-studies-card) .card-media .smart-img{height:286px}}@media (min-width: 768px){:host(.case-studies-card) .card-media .smart-img{height:224px}}@media (min-width: 992px){:host(.case-studies-card) .card-media .smart-img{height:192px}}@media (min-width: 1200px){:host(.case-studies-card) .card-media .smart-img{height:173px}}@media (min-width: 1440px){:host(.case-studies-card) .card-media .smart-img{height:170px}}@media (min-width: 480px){:host(.case-studies-card) .card-media{height:286px}}@media (min-width: 768px){:host(.case-studies-card) .card-media{height:224px}}@media (min-width: 992px){:host(.case-studies-card) .card-media{height:192px}}@media (min-width: 1200px){:host(.case-studies-card) .card-media{height:173px}}@media (min-width: 1440px){:host(.case-studies-card) .card-media{height:170px}}:host(.case-studies-card) .card-body .card-logo-container{padding:8px 20px;border-bottom:1px solid #E4E7E9}:host(.case-studies-card) .card-body .card-logo-none{padding-top:16px}:host(.case-studies-card) .card-body .card-logo{max-width:280px;width:auto;height:40px;object-fit:cover;border:1px solid #E4E7E9;margin-bottom:8px}:host(.case-studies-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin:8px 20px 12px 20px}:host(.case-studies-card) ::slotted([slot=slot-date]){font-weight:400;font-size:16px;line-height:19px;color:#282F35;margin-bottom:24px;display:inline-block}:host(.case-studies-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:19px;color:var(--color-gray-11);margin:0px 20px 16px 20px}:host(.related-card){width:100%;height:100%}:host(.related-card) .card-border{background:var(--color-white);box-shadow:var(--ptc-shadow-small);border-radius:var(--ptc-border-radius-standard);width:100%;height:100%;display:flex;flex-direction:row}:host(.related-card) .card-border:hover{background:var(--color-gray-02);box-shadow:var(--ptc-shadow-large)}:host(.related-card) .card-border:hover .card-media{background:var(--color-white);border-top-left-radius:var(--ptc-border-radius-standard);border-top-right-radius:var(--ptc-border-radius-standard)}:host(.related-card) .card-border:hover .card-media .smart-img{background:var(--color-white)}:host(.related-card) .card-layout{display:block;position:relative;width:100%;height:100%}:host(.related-card) .card-layout .ribbon-text{position:absolute;top:0;left:0;margin-top:var(--ptc-element-spacing-06);background-color:var(--color-white);padding:var(--ptc-element-spacing-01) var(--ptc-element-spacing-05);font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);color:var(--color-gray-11);border-radius:0px 3px 3px 0px;box-shadow:var(--ptc-shadow-small);max-height:20px;overflow:hidden;width:fit-content;clip-path:inset(-6px -6px -6px 0px)}:host(.related-card) .link-wrapper{outline:none;text-decoration:none}:host(.related-card) .link-wrapper:hover{outline:none;text-decoration:none}:host(.related-card) .card-media{width:100%;height:288px;transform:scale(1);transform-origin:center bottom;transition:transform var(--ptc-transition-medium) var(--ptc-standard-ease);transition-delay:var(--ptc-delay-medium)}:host(.related-card) .card-media .smart-img{height:288px}@media only screen and (min-width: 480px){:host(.related-card) .card-media .smart-img{height:286px}}@media only screen and (min-width: 768px){:host(.related-card) .card-media .smart-img{height:142px}}@media only screen and (min-width: 992px){:host(.related-card) .card-media .smart-img{height:192px}}@media only screen and (min-width: 1200px){:host(.related-card) .card-media .smart-img{height:237px}}@media only screen and (min-width: 1440px){:host(.related-card) .card-media .smart-img{height:248px}}@media only screen and (min-width: 480px){:host(.related-card) .card-media{height:286px}}@media only screen and (min-width: 768px){:host(.related-card) .card-media{height:142px}}@media only screen and (min-width: 992px){:host(.related-card) .card-media{height:192px}}@media only screen and (min-width: 1200px){:host(.related-card) .card-media{height:237px}}@media only screen and (min-width: 1440px){:host(.related-card) .card-media{height:248px}}:host(.related-card) .card-body{box-sizing:border-box;padding:var(--ptc-layout-spacing-03)}:host(.related-card) .card-body .card-date-text{display:flex;flex-direction:row}:host(.related-card) .card-body .card-date-text p{font-size:var(--ptc-font-size-xx-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block;margin-top:0rem}:host(.related-card) .card-body .small{font-size:var(--ptc-font-size-x-small);font-weight:400;line-height:19px;color:#282F35;margin-bottom:16px;display:inline-block}:host(.related-card) .card-body h3{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-loose);line-height:21px;color:var(--color-gray-11);margin-bottom:14px;margin-top:0rem}:host(.related-card) ::slotted([slot=slot-description]){font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:400;font-size:1rem;line-height:18px;color:var(--color-gray-11)}.ptc-h3.uppercase{text-transform:uppercase}.ptc-h3.capitalize{text-transform:capitalize}.ptc-h3.lowercase{text-transform:lowercase}.ptc-h3.none{text-transform:none}";
|
|
4
4
|
|
|
5
5
|
const PtcCard = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host, g as getElement } from './index-22a84644.js';
|
|
2
2
|
|
|
3
|
-
const ptcNavLinkCss = ":host{display:block;
|
|
3
|
+
const ptcNavLinkCss = ":host{display:block;position:relative}@media only screen and (min-width: 1200px){:host{display:inline-block}}:host::before,:host::after{content:\" \";width:1600px;height:1px;background-color:var(--color-gray-08);position:absolute;right:0;bottom:0}@media only screen and (min-width: 1200px){:host::before,:host::after{display:none}}:host::after{left:0;right:auto}:host a{color:var(--color-gray-03);text-decoration:none;display:inline-block;border-bottom:2px solid transparent;margin-left:34%;padding:22px 12px;font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold)}@media only screen and (min-width: 480px){:host a{margin-left:38%}}@media only screen and (min-width: 768px){:host a{margin-left:42%}}@media only screen and (min-width: 1200px){:host a{margin-left:0;display:flex;align-items:center;white-space:nowrap;position:relative}:host a::after{content:\"\";display:block;border-bottom:2px solid transparent;margin:auto;position:absolute;width:calc(100% - 20px);left:0;right:0;bottom:20px}}:host a svg{width:1rem;height:0.875rem;display:inline-block;background-size:cover;transition:margin-left 250ms ease-out;vertical-align:middle;margin-left:4px}:host a:hover,:host a:focus{color:var(--color-white)}@media only screen and (min-width: 1200px){:host a:hover::after,:host a:focus::after{border-color:var(--color-white)}}:host a:hover svg path,:host a:focus svg path{fill:var(--color-white)}:host ::slotted(icon-asset){margin-top:4px;margin-right:8px}";
|
|
4
4
|
|
|
5
5
|
const PtcNavLink = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-22a84644.js';
|
|
2
2
|
|
|
3
|
-
const ptcNavSubmenuCss = ":host{display:block;
|
|
3
|
+
const ptcNavSubmenuCss = ":host{display:block;position:relative;cursor:pointer}:host .back-btn{display:none;position:absolute;left:30px;top:22px;color:var(--color-white);font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold)}:host .back-btn svg{margin-right:4px;vertical-align:middle;width:12px;height:12px}@media only screen and (min-width: 1200px){:host{display:inline-block;position:initial}}:host::before,:host::after{content:\" \";width:800px;height:1px;background-color:var(--color-gray-08);position:absolute;right:0;bottom:0}@media only screen and (min-width: 1200px){:host::before,:host::after{display:none}}:host::after{left:0;right:auto}:host .submenu-toggle{display:inline-block;color:var(--color-gray-03);font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold);white-space:nowrap;padding:22px var(--ptc-element-spacing-03);margin-left:34%;position:relative}:host .submenu-toggle::after{content:\"\";display:block;border-bottom:2px solid transparent;margin:auto;position:absolute;width:calc(100% - 20px);left:0;right:0;bottom:20px}@media only screen and (min-width: 480px){:host .submenu-toggle{margin-left:38%}}@media only screen and (min-width: 768px){:host .submenu-toggle{margin-left:42%}}@media only screen and (min-width: 1200px){:host .submenu-toggle{margin-left:0;display:flex;align-items:center}}:host .submenu-toggle svg{margin-left:5px;margin-top:2px;vertical-align:middle;width:12px;height:12px}:host .submenu-toggle svg path{fill:var(--color-gray-04)}:host .submenu-toggle:hover{color:var(--color-white)}:host .submenu-toggle:hover::after{border-color:var(--color-white)}:host .submenu-toggle:hover svg path{fill:var(--color-white)}:host .submenu-toggle icon-asset{margin-right:8px}:host .submenu-toggle icon-asset svg{margin:0}:host .submenu-container{background-color:var(--color-gray-12)}@media only screen and (min-width: 1200px){:host .submenu-container{position:absolute;width:100%;right:0;left:0;top:67px}}:host .submenu-container .submenu-container-lg{max-width:1200px;margin:auto}@media only screen and (min-width: 1200px){:host .submenu-container .submenu-container-lg{padding:0 32px}}:host ::slotted(ptc-nav-link:last-child)::before,:host ::slotted(ptc-nav-link:last-child)::after{display:none}:host(.short-dropdown) .submenu-container{text-align:center}@media only screen and (min-width: 1200px){:host(.short-dropdown) .submenu-container{width:initial;right:3%;left:initial;top:56px;z-index:1000}}:host(.short-dropdown) .submenu-container .submenu-container-lg{padding:0;width:auto;min-width:348px;display:flex;justify-content:space-evenly}:host(.active){padding-bottom:0}:host(.active) .submenu-toggle{color:var(--color-white);border-color:var(--color-white)}:host(.active) .submenu-toggle svg path{fill:var(--color-white)}:host(.active)::before,:host(.active)::after{display:none}:host(.active.short-dropdown) .back-btn{display:inline-block}@media only screen and (min-width: 1200px){:host(.active.short-dropdown) .back-btn{display:none}}.custom-icon{object-fit:cover;width:1.5rem;height:1.5rem}.custom-icon:hover{filter:brightness(0) invert(1)}.menu-right *{color:transparent !important}";
|
|
4
4
|
|
|
5
5
|
const PtcNavSubmenu = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -15,7 +15,7 @@ const PtcNavSubmenu = class {
|
|
|
15
15
|
var container = this.el.closest('ptc-subnav');
|
|
16
16
|
if (dropdown && container) {
|
|
17
17
|
if (window.innerWidth >= 1200) {
|
|
18
|
-
let height = container.clientHeight
|
|
18
|
+
let height = container.clientHeight;
|
|
19
19
|
if (height > 0) {
|
|
20
20
|
dropdown.style.top = `${height}px`;
|
|
21
21
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, F as Fragment, H as Host, g as getElement } from './index-22a84644.js';
|
|
2
2
|
|
|
3
|
-
const ptcPricingAddOnCardCss = ":host{display:block;height:99%}.add-on-card{padding:
|
|
3
|
+
const ptcPricingAddOnCardCss = ":host{display:block;height:99%}.add-on-card{padding:var(--ptc-element-spacing-06);border-top:var(--color-gray-10) solid var(--ptc-element-spacing-01);background-color:white;border-radius:var(--ptc-border-radius-standard);box-shadow:var(--ptc-shadow-x-small);height:100%;box-sizing:border-box}";
|
|
4
4
|
|
|
5
5
|
const PtcPricingAddOnCard = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, F as Fragment, H as Host, g as getElement } from './index-22a84644.js';
|
|
2
2
|
|
|
3
|
-
const ptcPricingTableCss = ":host{display:block;position:relative}
|
|
3
|
+
const ptcPricingTableCss = ":host{display:block;position:relative}:host #vertical-scroll-content-clipper{position:fixed;top:0;left:0;right:0;margin:auto;background-color:white;z-index:25;display:none}:host .last-column-tooltip .tooltip{right:-48px}:host #sticky-header-container{position:fixed;z-index:20;background-color:white;overflow-x:scroll;overflow-y:visible;-ms-overflow-style:none;scrollbar-width:none;visibility:hidden;border-top-left-radius:var(--ptc-border-radius-standard);border-top-right-radius:var(--ptc-border-radius-standard);box-shadow:var(--ptc-shadow-x-large)}:host #sticky-header-container::-webkit-scrollbar{display:none}:host #sticky-header-container th{background:var(--color-gray-10);color:white;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);min-width:168px;max-width:180px;vertical-align:middle}:host #sticky-header-container th:not(:last-child){border-right:1px solid var(--color-gray-07)}:host #sticky-header-container th.desktop-header-first-cell{display:none}:host #sticky-header-container th.border-box-header-cell{box-sizing:border-box}:host #sticky-header-container th.table-filler-header-cell{width:99%;box-sizing:content-box}:host .scroll-buttons-container{position:absolute;top:0;right:0;display:flex;align-items:center;box-sizing:border-box}:host .scroll-buttons-container .scroll-buttons{z-index:15;position:absolute;display:inline-block;width:36px;width:fit-content;height:36px;background-color:white;box-shadow:var(--ptc-shadow-x-medium);display:flex;justify-content:center;align-items:center}:host .scroll-buttons-container .scroll-buttons icon-asset{z-index:15;display:flex;justify-content:center;align-items:center;width:36px;height:100%}:host .scroll-buttons-container .scroll-buttons.prev-button{z-index:15;left:0;border-radius:0px var(--ptc-element-spacing-01) var(--ptc-element-spacing-01) 0px}:host .scroll-buttons-container .scroll-buttons.prev-button ptc-para{z-index:15;margin-right:var(--ptc-element-spacing-04);display:none}:host .scroll-buttons-container .scroll-buttons.next-button{z-index:15;right:0;border-radius:var(--ptc-element-spacing-01) 0px 0px var(--ptc-element-spacing-01)}:host .scroll-buttons-container .scroll-buttons.next-button ptc-para{z-index:15;margin-left:var(--ptc-element-spacing-04);display:none}:host #table-container{border-radius:var(--ptc-border-radius-standard);box-shadow:var(--ptc-shadow-x-small);overflow-x:scroll;position:relative}:host #table-container #horizontal-scroll-box-shadow{display:none}:host #table-container table{border-spacing:0}:host #table-container th{background:var(--color-gray-10);color:white;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}:host #table-container th:not(:last-child){border-right:1px solid var(--color-gray-07)}:host #table-container th.desktop-header-first-cell{display:none}:host #table-container th.table-filler-header-cell{width:99%;display:none}:host #table-container tbody.mobile-table-body{display:contents;width:100%}:host #table-container tbody.desktop-table-body{display:none}:host #table-container tr{background-color:white;width:100%;overflow-x:scroll}:host #table-container tr:nth-child(odd){background-color:var(--color-gray-01)}:host #table-container tr:nth-child(even){background-color:white}:host #table-container tr.table-button-row{background-color:white}:host #table-container tr.table-button-row td{border-top:1px solid var(--color-gray-02)}:host #table-container tr.table-button-row td ptc-tooltip .text-ellipsis{font-size:var(--ptc-font-size-x-small)}:host #table-container td{text-align:center;min-width:168px;max-width:180px;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}:host #table-container td:not(:last-child){border-right:1px solid var(--color-gray-02)}:host #table-container td.table-filler-body-cell{width:99%;display:none}@media only screen and (min-width: 768px){:host .table-descriptor{width:768px;margin:auto}}@media only screen and (min-width: 992px){:host #sticky-header-container{box-shadow:none}:host #sticky-header-container th{max-width:275px}:host #sticky-header-container th.desktop-header-first-cell{display:table-cell;min-width:275px;box-sizing:content-box}:host #sticky-header-container th:first-of-type{position:-webkit-sticky;position:sticky;left:0;z-index:5}:host #sticky-header-container th.table-filler-header-cell{width:99%;display:none;max-width:fit-content;box-sizing:border-box}:host #table-container #horizontal-scroll-box-shadow{display:block;position:absolute;top:0;left:0;height:100%;width:var(--ptc-element-spacing-06);background:linear-gradient(90deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0) 100%);z-index:10;visibility:hidden}:host #table-container th{max-width:275px}:host #table-container th.desktop-header-first-cell{display:table-cell;min-width:275px}:host #table-container th:first-of-type{position:-webkit-sticky;position:sticky;left:0;z-index:5}:host #table-container th.table-filler-header-cell{width:99%;display:none}:host #table-container tbody.mobile-table-body{display:none}:host #table-container tbody.desktop-table-body{display:contents;width:100%}:host #table-container tr:nth-child(odd){background-color:white}:host #table-container tr:nth-child(even){background-color:var(--color-gray-01)}:host #table-container tr.table-button-row{background-color:white}:host #table-container tr.table-button-row td{border-top:1px solid var(--color-gray-02)}:host #table-container td{max-width:275px}:host #table-container td:first-of-type{position:-webkit-sticky;position:sticky;left:0;z-index:5;background:inherit;min-width:275px}:host #table-container td:not(:first-child){text-align:center}:host #table-container td.first-column-cell.scroll-shadow{box-shadow:var(--ptc-shadow-x-large)}:host #table-container td.first-column-cell.no-shadow{box-shadow:none}:host #table-container td.table-filler-body-cell{width:99%;display:none}:host #table-container td.table-filler-button-cell{width:99%;display:none}}";
|
|
4
4
|
|
|
5
5
|
const PtcPricingTable = class {
|
|
6
6
|
constructor(hostRef) {
|
|
@@ -19,15 +19,18 @@ const PtcPricingTable = class {
|
|
|
19
19
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
20
20
|
this.targetElements = this.getTargetElements();
|
|
21
21
|
this.targetElements["sticky-header-container"].scrollLeft = (_a = this.targetElements["table-container"]) === null || _a === void 0 ? void 0 : _a.scrollLeft;
|
|
22
|
+
// Scroll the button containers in sync with the table's scrolling
|
|
22
23
|
if (((_b = this.targetElements["table-container"]) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().right) <= ((_c = this.targetElements["table"]) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().right)) {
|
|
23
24
|
this.targetElements["normal-scroll-buttons-container"].style.left = `${((_d = this.targetElements["table-container"]) === null || _d === void 0 ? void 0 : _d.scrollLeft) + this.desktopHeaderFirstCellWidth}px`;
|
|
24
25
|
this.targetElements["sticky-scroll-buttons-container"].style.left = `${((_e = this.targetElements["table-container"]) === null || _e === void 0 ? void 0 : _e.scrollLeft) + this.desktopHeaderFirstCellWidth}px`;
|
|
25
26
|
}
|
|
27
|
+
// Scroll the mobile row headers along with the table in the mobile view
|
|
26
28
|
if (this.targetElements["mobile-table-row-headers"].length > 0) {
|
|
27
29
|
for (let i = 0; i < this.dataRows; i++) {
|
|
28
30
|
this.targetElements["mobile-table-row-headers"][i].style.paddingLeft = `${(_f = this.targetElements["table-container"]) === null || _f === void 0 ? void 0 : _f.scrollLeft}px`;
|
|
29
31
|
}
|
|
30
32
|
}
|
|
33
|
+
// Managing the visibility of the next scroll buttons in both the sticky and normal headers, depending on whether the table can scroll further to the right or not
|
|
31
34
|
if (Math.trunc(this.targetElements["table-container"].getBoundingClientRect().right) >= Math.trunc(this.targetElements["table"].getBoundingClientRect().right)) {
|
|
32
35
|
this.targetElements["normal-next-scroll-button"].style.visibility = 'hidden';
|
|
33
36
|
if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
|
|
@@ -40,6 +43,7 @@ const PtcPricingTable = class {
|
|
|
40
43
|
this.targetElements["sticky-next-scroll-button"].style.visibility = 'visible';
|
|
41
44
|
}
|
|
42
45
|
}
|
|
46
|
+
// Adjusting the visibility of the previous scroll buttons in both the sticky and normal headers, as well as the box shadow in desktop view, depending on whether the table can scroll further to the left or not
|
|
43
47
|
if (this.targetElements["table-container"].scrollLeft === 0) {
|
|
44
48
|
this.targetElements["horizontal-scroll-box-shadow"].style.left = '0';
|
|
45
49
|
this.targetElements["horizontal-scroll-box-shadow"].style.visibility = 'hidden';
|
|
@@ -64,19 +68,19 @@ const PtcPricingTable = class {
|
|
|
64
68
|
// Scrolling Up
|
|
65
69
|
if (this.targetElements["table-container"].getBoundingClientRect().bottom > 0) {
|
|
66
70
|
if (this.targetElements["sticky-header-container"].getBoundingClientRect().top < 0) {
|
|
67
|
-
// Scroll the sticky header back into
|
|
71
|
+
// Scroll the sticky header back into view along with the table
|
|
68
72
|
this.targetElements["vertical-scroll-content-clipper"].style.display = 'block';
|
|
69
73
|
this.targetElements["sticky-scroll-buttons-container"].style.opacity = '1';
|
|
70
74
|
this.targetElements["sticky-header-container"].style.visibility = 'visible';
|
|
71
75
|
this.targetElements["sticky-header-container"].style.top = `${this.targetElements["table-container"].getBoundingClientRect().bottom - this.targetElements["sticky-header-container"].getBoundingClientRect().height}px`;
|
|
72
76
|
}
|
|
73
77
|
else {
|
|
74
|
-
//
|
|
78
|
+
// Make the sticky header fixed once it is entirely within the window
|
|
75
79
|
this.targetElements["sticky-header-container"].style.top = this.scrollTopClipperHeight;
|
|
76
80
|
}
|
|
77
81
|
}
|
|
78
82
|
if (this.targetElements["table-header"].getBoundingClientRect().top > this.targetElements["sticky-header-container"].getBoundingClientRect().top) {
|
|
79
|
-
//
|
|
83
|
+
// Conceal the sticky header and reveal the normal header
|
|
80
84
|
this.targetElements["sticky-scroll-buttons-container"].style.opacity = '0';
|
|
81
85
|
this.targetElements["sticky-header-container"].style.visibility = 'hidden';
|
|
82
86
|
this.targetElements["table-header"].style.visibility = 'visible';
|
|
@@ -86,7 +90,7 @@ const PtcPricingTable = class {
|
|
|
86
90
|
else if (scrollTopPosition > this.lastScrollTop) {
|
|
87
91
|
// Scrolling down
|
|
88
92
|
if (this.targetElements["sticky-header-container"].getBoundingClientRect().bottom <= 0) {
|
|
89
|
-
// Reset and hide the sticky header
|
|
93
|
+
// Reset and hide the sticky header when it scrolls out of the top of the window
|
|
90
94
|
this.targetElements["sticky-header-container"].style.top = `${-this.targetElements["sticky-header-container"].getBoundingClientRect().height}px`;
|
|
91
95
|
this.targetElements["sticky-scroll-buttons-container"].style.opacity = '0';
|
|
92
96
|
this.targetElements["sticky-header-container"].style.visibility = 'hidden';
|
|
@@ -98,7 +102,7 @@ const PtcPricingTable = class {
|
|
|
98
102
|
this.targetElements["sticky-header-container"].style.top = `${(this.targetElements["table-container"].getBoundingClientRect().bottom - this.targetElements["sticky-header-container"].clientHeight)}px`;
|
|
99
103
|
}
|
|
100
104
|
else {
|
|
101
|
-
//
|
|
105
|
+
// Conceal the normal header and reveal the sticky header
|
|
102
106
|
this.targetElements["vertical-scroll-content-clipper"].style.display = 'block';
|
|
103
107
|
this.targetElements["sticky-scroll-buttons-container"].style.opacity = '1';
|
|
104
108
|
this.targetElements["sticky-header-container"].style.visibility = 'visible';
|
|
@@ -140,6 +144,7 @@ const PtcPricingTable = class {
|
|
|
140
144
|
this.ctaButtons = [];
|
|
141
145
|
this.disclaimers = [];
|
|
142
146
|
}
|
|
147
|
+
// Provides an object containing frequently accessed HTML elements for table-related operations
|
|
143
148
|
getTargetElements() {
|
|
144
149
|
let pricingTable = this.el.shadowRoot;
|
|
145
150
|
let verticalScrollContentClipper = pricingTable === null || pricingTable === void 0 ? void 0 : pricingTable.querySelector('#vertical-scroll-content-clipper');
|
|
@@ -161,9 +166,13 @@ const PtcPricingTable = class {
|
|
|
161
166
|
let normalScrollButtonsContainer = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('.scroll-buttons-container');
|
|
162
167
|
let stickyScrollButtonsContainer = stickyHeaderContainer === null || stickyHeaderContainer === void 0 ? void 0 : stickyHeaderContainer.querySelector('.scroll-buttons-container');
|
|
163
168
|
let normalPreviousScrollButton = normalScrollButtonsContainer === null || normalScrollButtonsContainer === void 0 ? void 0 : normalScrollButtonsContainer.querySelector('.prev-button');
|
|
169
|
+
let normalPreviousScrollButtonText = normalPreviousScrollButton === null || normalPreviousScrollButton === void 0 ? void 0 : normalPreviousScrollButton.querySelector('ptc-para');
|
|
164
170
|
let stickyPreviousScrollButton = stickyScrollButtonsContainer === null || stickyScrollButtonsContainer === void 0 ? void 0 : stickyScrollButtonsContainer.querySelector('.prev-button');
|
|
171
|
+
let stickyPreviousScrollButtonText = stickyPreviousScrollButton === null || stickyPreviousScrollButton === void 0 ? void 0 : stickyPreviousScrollButton.querySelector('ptc-para');
|
|
165
172
|
let normalNextScrollButton = normalScrollButtonsContainer === null || normalScrollButtonsContainer === void 0 ? void 0 : normalScrollButtonsContainer.querySelector('.next-button');
|
|
173
|
+
let normalNextScrollButtonText = normalNextScrollButton === null || normalNextScrollButton === void 0 ? void 0 : normalNextScrollButton.querySelector('ptc-para');
|
|
166
174
|
let stickyNextScrollButton = stickyScrollButtonsContainer === null || stickyScrollButtonsContainer === void 0 ? void 0 : stickyScrollButtonsContainer.querySelector('.next-button');
|
|
175
|
+
let stickyNextScrollButtonText = stickyNextScrollButton === null || stickyNextScrollButton === void 0 ? void 0 : stickyNextScrollButton.querySelector('ptc-para');
|
|
167
176
|
let horizontalScrollBoxShadow = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('#horizontal-scroll-box-shadow');
|
|
168
177
|
let targetElements = {
|
|
169
178
|
"vertical-scroll-content-clipper": verticalScrollContentClipper,
|
|
@@ -186,23 +195,31 @@ const PtcPricingTable = class {
|
|
|
186
195
|
"normal-scroll-buttons-container": normalScrollButtonsContainer,
|
|
187
196
|
"sticky-scroll-buttons-container": stickyScrollButtonsContainer,
|
|
188
197
|
"normal-previous-scroll-button": normalPreviousScrollButton,
|
|
198
|
+
"normal-previous-scroll-button-text": normalPreviousScrollButtonText,
|
|
189
199
|
"sticky-previous-scroll-button": stickyPreviousScrollButton,
|
|
200
|
+
"sticky-previous-scroll-button-text": stickyPreviousScrollButtonText,
|
|
190
201
|
"normal-next-scroll-button": normalNextScrollButton,
|
|
202
|
+
"normal-next-scroll-button-text": normalNextScrollButtonText,
|
|
191
203
|
"sticky-next-scroll-button": stickyNextScrollButton,
|
|
204
|
+
"sticky-next-scroll-button-text": stickyNextScrollButtonText,
|
|
192
205
|
"horizontal-scroll-box-shadow": horizontalScrollBoxShadow,
|
|
193
206
|
};
|
|
194
207
|
return targetElements;
|
|
195
208
|
}
|
|
209
|
+
// Sets up the scroll buttons container for both the sticky and normal headers
|
|
196
210
|
configureScrollButtonsContainers() {
|
|
197
211
|
this.targetElements = this.getTargetElements();
|
|
212
|
+
// Defines the dimensions
|
|
198
213
|
this.targetElements["normal-scroll-buttons-container"].style.width = `${this.targetElements["table-container"].clientWidth}px`;
|
|
199
214
|
this.targetElements["normal-scroll-buttons-container"].style.height = `${this.targetElements["table-header"].clientHeight}px`;
|
|
200
215
|
this.targetElements["sticky-scroll-buttons-container"].style.width = `${this.targetElements["table-container"].clientWidth}px`;
|
|
201
216
|
this.targetElements["sticky-scroll-buttons-container"].style.height = `${this.targetElements["table-header"].clientHeight}px`;
|
|
217
|
+
// For desktop screens, scroll buttons are positioned after the first column of the table
|
|
202
218
|
if (this.targetElements["desktop-header-first-cell"]) {
|
|
203
219
|
this.targetElements["normal-scroll-buttons-container"].style.width = `${this.targetElements["normal-scroll-buttons-container"].getBoundingClientRect().width - this.desktopHeaderFirstCellWidth}px`;
|
|
204
220
|
this.targetElements["sticky-scroll-buttons-container"].style.width = `${this.targetElements["sticky-scroll-buttons-container"].getBoundingClientRect().width - this.desktopHeaderFirstCellWidth}px`;
|
|
205
221
|
}
|
|
222
|
+
// Controlling the visibility of the previous scroll buttons, of the sticky and normal headers, based on whether table can scroll further to the left or not
|
|
206
223
|
if (this.targetElements["table-container"].scrollLeft === 0) {
|
|
207
224
|
this.targetElements["normal-previous-scroll-button"].style.visibility = 'hidden';
|
|
208
225
|
if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
|
|
@@ -215,6 +232,7 @@ const PtcPricingTable = class {
|
|
|
215
232
|
this.targetElements["sticky-previous-scroll-button"].style.visibility = 'visible';
|
|
216
233
|
}
|
|
217
234
|
}
|
|
235
|
+
// Managing the visibility of the next scroll buttons in both the sticky and normal headers, depending on whether the table can be scrolled further to the right or not
|
|
218
236
|
if (this.targetElements["table-container"].getBoundingClientRect().width >= this.targetElements["table"].getBoundingClientRect().width) {
|
|
219
237
|
this.targetElements["normal-next-scroll-button"].style.visibility = 'hidden';
|
|
220
238
|
if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
|
|
@@ -228,12 +246,23 @@ const PtcPricingTable = class {
|
|
|
228
246
|
}
|
|
229
247
|
}
|
|
230
248
|
}
|
|
249
|
+
// Configures the sticky header based on the dimensions of the table header
|
|
231
250
|
configureStickyHeader() {
|
|
232
251
|
var _a, _b, _c, _d, _e, _f;
|
|
233
252
|
const targetElements = this.getTargetElements();
|
|
234
|
-
//
|
|
253
|
+
// Expanding the content clipper by an additional 10px on each side to accommodate the table's box-shadow
|
|
235
254
|
targetElements["vertical-scroll-content-clipper"].style.width = `${targetElements["table-container"].clientWidth + 20}px`;
|
|
255
|
+
// Aligns the background color of the element with the body's background color
|
|
256
|
+
const bodyBackgroundColor = window.getComputedStyle(document.body, null).getPropertyValue('background-color');
|
|
257
|
+
if (bodyBackgroundColor === ("rgba(0, 0, 0, 0)" )) {
|
|
258
|
+
targetElements["vertical-scroll-content-clipper"].style.backgroundColor = "white";
|
|
259
|
+
}
|
|
260
|
+
else {
|
|
261
|
+
targetElements["vertical-scroll-content-clipper"].style.backgroundColor = bodyBackgroundColor;
|
|
262
|
+
}
|
|
263
|
+
// Establishing the width of the sticky header to be in line with the table's width
|
|
236
264
|
targetElements["sticky-header-container"].style.width = `${targetElements["table-container"].clientWidth}px`;
|
|
265
|
+
// Adjusts the table's sticky behavior, making it adhere at varying positions below the top, contingent on factors like the device type (mobile or desktop) and the presence of a subnav in the page
|
|
237
266
|
if (this.pageWithSubnav) {
|
|
238
267
|
if (window.innerWidth >= 1200) {
|
|
239
268
|
this.scrollTopClipperHeight = this.scrollTopClipperHeightOptions.withSubNav.desktop;
|
|
@@ -252,6 +281,7 @@ const PtcPricingTable = class {
|
|
|
252
281
|
}
|
|
253
282
|
targetElements["vertical-scroll-content-clipper"].style.height = this.scrollTopClipperHeight;
|
|
254
283
|
targetElements["sticky-header-container"].style.top = this.scrollTopClipperHeight;
|
|
284
|
+
// Align the widths of sticky header cells with those of the normal header cells
|
|
255
285
|
for (let i = 0; i < targetElements["table-header-cells"].length; i++) {
|
|
256
286
|
targetElements["sticky-header-cells"][i].style.width = `${targetElements["table-header-cells"][i].getBoundingClientRect().width}px`;
|
|
257
287
|
if (targetElements["table-header-cells"][i].classList.contains('desktop-header-first-cell')) {
|
|
@@ -279,7 +309,7 @@ const PtcPricingTable = class {
|
|
|
279
309
|
this.targetElements = this.getTargetElements();
|
|
280
310
|
this.targetElements["table-filler-sticky-header-cell"].style.width = this.targetElements["table-filler-header-cell"].getBoundingClientRect().width;
|
|
281
311
|
if (this.targetElements['table'].getBoundingClientRect().width < this.targetElements['table-container'].getBoundingClientRect().width) {
|
|
282
|
-
//
|
|
312
|
+
// If the table is smaller than the container, insert fillers
|
|
283
313
|
this.targetElements["table-filler-sticky-header-cell"].style.display = 'table-cell';
|
|
284
314
|
this.targetElements["table-filler-header-cell"].style.display = 'table-cell';
|
|
285
315
|
for (let i = 0; i < this.dataRows; i++) {
|
|
@@ -291,7 +321,7 @@ const PtcPricingTable = class {
|
|
|
291
321
|
this.mobileHeaderRowColSpan = this.dataCols + 1;
|
|
292
322
|
}
|
|
293
323
|
else {
|
|
294
|
-
//
|
|
324
|
+
// If the table is equal to or larger than the container, remove fillers
|
|
295
325
|
this.targetElements["table-filler-sticky-header-cell"].style.width = '99%';
|
|
296
326
|
if (getComputedStyle(this.targetElements["sticky-next-scroll-button"]).visibility === 'hidden') {
|
|
297
327
|
for (let i = 0; i < this.targetElements["sticky-header-cells"].length + 1; i++) {
|
|
@@ -306,8 +336,27 @@ const PtcPricingTable = class {
|
|
|
306
336
|
var _a;
|
|
307
337
|
this.targetElements["table-container"].scrollLeft = (_a = this.targetElements["sticky-header-container"]) === null || _a === void 0 ? void 0 : _a.scrollLeft;
|
|
308
338
|
}
|
|
339
|
+
handleScrollForwardHover() {
|
|
340
|
+
if (this.targetElements["normal-next-scroll-button"].getAttribute("data-clicked") !== "true") {
|
|
341
|
+
document.body.style.cursor = 'pointer';
|
|
342
|
+
this.targetElements["normal-next-scroll-button-text"].style.display = "block";
|
|
343
|
+
this.targetElements["sticky-next-scroll-button-text"].style.display = "block";
|
|
344
|
+
}
|
|
345
|
+
}
|
|
346
|
+
handleScrollForwardHoverOut() {
|
|
347
|
+
if (this.targetElements["normal-next-scroll-button"].getAttribute("data-clicked") !== "true") {
|
|
348
|
+
document.body.style.cursor = 'auto';
|
|
349
|
+
this.targetElements["normal-next-scroll-button-text"].style.display = "none";
|
|
350
|
+
this.targetElements["sticky-next-scroll-button-text"].style.display = "none";
|
|
351
|
+
}
|
|
352
|
+
}
|
|
309
353
|
handleScrollForward() {
|
|
310
354
|
this.targetElements = this.getTargetElements();
|
|
355
|
+
// Display the "See more" text when clicked
|
|
356
|
+
document.body.style.cursor = 'pointer';
|
|
357
|
+
this.targetElements["normal-next-scroll-button"].setAttribute("data-clicked", "true");
|
|
358
|
+
this.targetElements["normal-next-scroll-button-text"].style.display = "block";
|
|
359
|
+
this.targetElements["sticky-next-scroll-button-text"].style.display = "block";
|
|
311
360
|
let scrollAdded = 0;
|
|
312
361
|
let intervalId = setInterval(() => {
|
|
313
362
|
scrollAdded += this.scrollAmount;
|
|
@@ -315,12 +364,38 @@ const PtcPricingTable = class {
|
|
|
315
364
|
let tableRight = this.targetElements["table"].getBoundingClientRect().right;
|
|
316
365
|
if ((scrollAdded == this.scrollLimit) || (tableContainerRight >= tableRight)) {
|
|
317
366
|
clearInterval(intervalId);
|
|
367
|
+
this.targetElements["normal-next-scroll-button"].setAttribute("data-clicked", "false");
|
|
368
|
+
// Remove the "See more" text if the mouse is not hovering over the button after scrolling
|
|
369
|
+
if (!this.targetElements["normal-next-scroll-button"].matches(':hover') && !this.targetElements["sticky-next-scroll-button"].matches(':hover')) {
|
|
370
|
+
document.body.style.cursor = 'auto';
|
|
371
|
+
this.targetElements["normal-next-scroll-button-text"].style.display = "none";
|
|
372
|
+
this.targetElements["sticky-next-scroll-button-text"].style.display = "none";
|
|
373
|
+
}
|
|
318
374
|
}
|
|
319
375
|
this.targetElements["table-container"].scrollLeft += scrollAdded;
|
|
320
376
|
}, this.scrollTimeInterval);
|
|
321
377
|
}
|
|
378
|
+
handleScrollBackwardHover() {
|
|
379
|
+
document.body.style.cursor = 'pointer';
|
|
380
|
+
if (this.targetElements["normal-previous-scroll-button"].getAttribute("data-clicked") !== "true") {
|
|
381
|
+
this.targetElements["normal-previous-scroll-button-text"].style.display = "block";
|
|
382
|
+
this.targetElements["sticky-previous-scroll-button-text"].style.display = "block";
|
|
383
|
+
}
|
|
384
|
+
}
|
|
385
|
+
handleScrollBackwardHoverOut() {
|
|
386
|
+
document.body.style.cursor = 'auto';
|
|
387
|
+
if (this.targetElements["normal-previous-scroll-button"].getAttribute("data-clicked") !== "true") {
|
|
388
|
+
this.targetElements["normal-previous-scroll-button-text"].style.display = "none";
|
|
389
|
+
this.targetElements["sticky-previous-scroll-button-text"].style.display = "none";
|
|
390
|
+
}
|
|
391
|
+
}
|
|
322
392
|
handleScrollBackward() {
|
|
323
393
|
this.targetElements = this.getTargetElements();
|
|
394
|
+
// Display the "See more" text when clicked
|
|
395
|
+
document.body.style.cursor = 'pointer';
|
|
396
|
+
this.targetElements["normal-previous-scroll-button"].setAttribute("data-clicked", "true");
|
|
397
|
+
this.targetElements["normal-previous-scroll-button-text"].style.display = "block";
|
|
398
|
+
this.targetElements["sticky-previous-scroll-button-text"].style.display = "block";
|
|
324
399
|
let scrollReduced = 0;
|
|
325
400
|
let intervalId = setInterval(() => {
|
|
326
401
|
scrollReduced += this.scrollAmount;
|
|
@@ -328,6 +403,14 @@ const PtcPricingTable = class {
|
|
|
328
403
|
let tableLeft = this.targetElements["table"].getBoundingClientRect().left;
|
|
329
404
|
if ((scrollReduced == this.scrollLimit) || (tableContainerLeft <= tableLeft)) {
|
|
330
405
|
clearInterval(intervalId);
|
|
406
|
+
this.targetElements["normal-previous-scroll-button"].setAttribute("data-clicked", "false");
|
|
407
|
+
// Remove the "See more" text if the mouse is not hovering over the button after scrolling
|
|
408
|
+
if (!this.targetElements["normal-previous-scroll-button"].matches(':hover') && !this.targetElements["sticky-previous-scroll-button"].matches(':hover')) {
|
|
409
|
+
document.body.style.cursor = 'auto';
|
|
410
|
+
this.targetElements["normal-previous-scroll-button-text"].style.display = "none";
|
|
411
|
+
this.targetElements["sticky-previous-scroll-button-text"].style.display = "none";
|
|
412
|
+
}
|
|
413
|
+
return;
|
|
331
414
|
}
|
|
332
415
|
this.targetElements["table-container"].scrollLeft -= scrollReduced;
|
|
333
416
|
}, this.scrollTimeInterval);
|
|
@@ -390,7 +473,7 @@ const PtcPricingTable = class {
|
|
|
390
473
|
return (this.tableDescription && h(Fragment, null, h("div", { class: "table-descriptor" }, h("ptc-para", { "font-size": "small", "font-weight": "w-4", "para-align": "center", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, (this.tableDescription.length <= 500) ? this.tableDescription : h("ptc-readmore", { "more-text": "See more" }, this.tableDescription)))));
|
|
391
474
|
};
|
|
392
475
|
const getScrollButtonsContainer = () => {
|
|
393
|
-
return h("div", { class: "scroll-buttons-container" }, h("div", { class: "scroll-buttons prev-button", onClick: () => this.handleScrollBackward() }, h("icon-asset", { type: "solid", size: "medium", name: "chevron-left", color: "primary-gray" }), h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "justify", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "See More")), h("div", { class: "scroll-buttons next-button", onClick: () => this.handleScrollForward() }, h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "justify", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "See More"), h("icon-asset", { type: "solid", size: "medium", name: "chevron-right", color: "primary-gray" })));
|
|
476
|
+
return h("div", { class: "scroll-buttons-container" }, h("div", { class: "scroll-buttons prev-button", "data-clicked": "false", onClick: () => this.handleScrollBackward(), onMouseOver: () => this.handleScrollBackwardHover(), onMouseOut: () => this.handleScrollBackwardHoverOut() }, h("icon-asset", { type: "solid", size: "medium", name: "chevron-left", color: "primary-gray" }), h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "justify", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "See More")), h("div", { class: "scroll-buttons next-button", "data-clicked": "false", onClick: () => this.handleScrollForward(), onMouseOver: () => this.handleScrollForwardHover(), onMouseOut: () => this.handleScrollForwardHoverOut() }, h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "justify", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "See More"), h("icon-asset", { type: "solid", size: "medium", name: "chevron-right", color: "primary-gray" })));
|
|
394
477
|
};
|
|
395
478
|
const getTableHeader = (headerType) => {
|
|
396
479
|
return h("thead", null, h("tr", null, h("th", { class: "desktop-header-first-cell" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-7", "para-align": "left", "para-color": "white", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "Package Options")), ([...Array(this.dataCols).keys()]).map(col => {
|
|
@@ -422,7 +505,7 @@ const PtcPricingTable = class {
|
|
|
422
505
|
return h(Fragment, null, h("ptc-para", { "font-size": "xx-small", "font-weight": "w-6", "para-align": "center", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, disclaimer), (ind != (this.disclaimerCount - 1)) ? h("ptc-spacer", { size: "xx-small" }) : null);
|
|
423
506
|
})));
|
|
424
507
|
};
|
|
425
|
-
return (h(Host, null, h("div", { id: "vertical-scroll-content-clipper" }), h("div", { id: "sticky-header-container", onScroll: () => this.handleStickyHeaderHorizontalScroll() }, getScrollButtonsContainer(), getTableHeader("sticky")), h("ptc-spacer", { breakpoint: "small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxxx-large" }), getTableTitle(), getTableSubTitle(), getTableDescription(), h("ptc-spacer", { breakpoint: "small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "xx-small" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xx-small" }), h("div", { id: "table-container", onScroll: () => this.handleHorizontalScroll() }, getScrollButtonsContainer(), h("table", null, h("div", { id: "horizontal-scroll-box-shadow" }), getTableHeader("normal"), (window.innerWidth >=
|
|
508
|
+
return (h(Host, null, h("div", { id: "vertical-scroll-content-clipper" }), h("div", { id: "sticky-header-container", onScroll: () => this.handleStickyHeaderHorizontalScroll() }, getScrollButtonsContainer(), getTableHeader("sticky")), h("ptc-spacer", { breakpoint: "small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxxx-large" }), getTableTitle(), getTableSubTitle(), getTableDescription(), h("ptc-spacer", { breakpoint: "small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "xx-small" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xx-small" }), h("div", { id: "table-container", onScroll: () => this.handleHorizontalScroll() }, getScrollButtonsContainer(), h("table", null, h("div", { id: "horizontal-scroll-box-shadow" }), getTableHeader("normal"), (window.innerWidth >= 992)
|
|
426
509
|
? getDesktopTableBody()
|
|
427
510
|
: getMobileTableBody())), getDisclaimers(), h("ptc-spacer", { breakpoint: "small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxxx-large" })));
|
|
428
511
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host, g as getElement } from './index-22a84644.js';
|
|
2
2
|
|
|
3
|
-
const ptcSubnavCss = ":host{display:block;width:100%;background-color:var(--color-gray-10);position:relative}:host .navbar
|
|
3
|
+
const ptcSubnavCss = ":host{display:block;width:100%;background-color:var(--color-gray-10);position:relative}:host .navbar{overflow-x:hidden}@media only screen and (min-width: 1200px){:host .navbar{overflow-x:visible}}:host .navbar .navbar-inner{max-width:1200px;margin:auto;box-sizing:border-box;padding:0px;display:none}@media only screen and (min-width: 1200px){:host .navbar .navbar-inner{padding:0px;height:auto;display:block}}:host .navbar .navbar-inner .nav-wrapper{width:auto;margin:auto 0;min-width:163px}@media only screen and (min-width: 1200px){:host .navbar .navbar-inner .nav-wrapper{width:auto;display:flex;justify-content:space-between}}:host .navbar.navOpen .navbar-inner{background-color:var(--color-gray-12);display:block}:host .navbar .navbar-toggle{display:block;width:100%;text-align:center;color:var(--color-white);background-color:var(--color-gray-10);border:none;padding:16px;font-size:15px;line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold)}:host .navbar .navbar-toggle svg{vertical-align:middle;margin-left:4px}@media only screen and (min-width: 1200px){:host .navbar .navbar-toggle{display:none}}";
|
|
4
4
|
|
|
5
5
|
const PtcSubnav = class {
|
|
6
6
|
constructor(hostRef) {
|