@ptcwebops/ptcw-design 4.9.6 → 4.9.7
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/homepage-clickable-tab.cjs.entry.js +2 -2
- package/dist/cjs/jumbotron-sub-menu.cjs.entry.js +1 -1
- package/dist/cjs/ptc-background-video.cjs.entry.js +2 -2
- package/dist/cjs/ptc-info-tile.cjs.entry.js +21 -1
- package/dist/cjs/ptc-jumbotron.cjs.entry.js +1 -1
- package/dist/collection/components/homepage-clickable-tab/homepage-clickable-tab.css +12 -19
- package/dist/collection/components/homepage-clickable-tab/homepage-clickable-tab.js +1 -1
- package/dist/collection/components/jumbotron-sub-menu/jumbotron-sub-menu.css +11 -9
- package/dist/collection/components/ptc-background-video/ptc-background-video.css +1 -1
- package/dist/collection/components/ptc-background-video/ptc-background-video.js +1 -1
- package/dist/collection/components/ptc-info-tile/ptc-info-tile.js +21 -1
- package/dist/collection/components/ptc-jumbotron/ptc-jumbotron.css +7 -5
- package/dist/custom-elements/index.js +27 -7
- package/dist/esm/homepage-clickable-tab.entry.js +2 -2
- package/dist/esm/jumbotron-sub-menu.entry.js +1 -1
- package/dist/esm/ptc-background-video.entry.js +2 -2
- package/dist/esm/ptc-info-tile.entry.js +22 -2
- package/dist/esm/ptc-jumbotron.entry.js +1 -1
- package/dist/ptcw-design/p-0aef28b7.entry.js +1 -0
- package/dist/ptcw-design/{p-06f60377.entry.js → p-68f33582.entry.js} +1 -1
- package/dist/ptcw-design/p-7ea829f5.entry.js +1 -0
- package/dist/ptcw-design/p-8d342c19.entry.js +1 -0
- package/dist/ptcw-design/p-f086b920.entry.js +1 -0
- package/dist/ptcw-design/ptcw-design.esm.js +1 -1
- package/dist/types/components/ptc-info-tile/ptc-info-tile.d.ts +4 -0
- package/package.json +1 -1
- package/readme.md +1 -1
- package/dist/ptcw-design/p-47d58e06.entry.js +0 -1
- package/dist/ptcw-design/p-745eef35.entry.js +0 -1
- package/dist/ptcw-design/p-91b76b84.entry.js +0 -1
- package/dist/ptcw-design/p-983e111b.entry.js +0 -1
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-63ddc79c.js');
|
|
6
6
|
|
|
7
|
-
const homepageClickableTabCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;position:relative}.tab-item{cursor:pointer;color
|
|
7
|
+
const homepageClickableTabCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;position:relative}.tab-item{cursor:pointer;color:var(--color-white);border-radius:var(--ptc-border-radius-standard);display:flex;width:-webkit-fill-available;height:auto;min-height:72px;padding:24px;justify-content:center;align-items:center;gap:10px;align-self:stretch;text-align:center;font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-extrabold)}@media screen and (min-width: 1200px){.tab-item{font-size:var(--ptc-font-size-medium)}}@media screen and (min-width: 1280px){.tab-item{width:160px}}@media only screen and (min-width: 1440px){.tab-item{width:172px}}.tab-item span{z-index:2}.tab-item{background:var(--color-gray-11)}.tab-item::before{content:\"\";position:absolute;width:100%;height:100%;opacity:0;transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout);border-radius:var(--ptc-border-radius-standard)}.tab-item:hover::before{opacity:1}.tab-item.active{color:var(--color-white)}.tab-item.active::after{content:\"\";position:absolute;bottom:-21px;left:50%;transform:translateX(-50%);width:0;height:0;border-top:19px;border-left:14px solid transparent;border-right:14px solid transparent}.tab-item.hp-blue::before{background:linear-gradient(180deg, #197BC0 0%, #4795CD 100%)}.tab-item.hp-blue.active{background:linear-gradient(180deg, #197BC0 0%, #4795CD 100%)}.tab-item.hp-blue.active::after{border-style:solid;border-top-color:var(--color-blue-06)}.tab-item.hp-green::before{background:linear-gradient(180deg, #00890B 0%, #33A13C 100%)}.tab-item.hp-green.active{background:linear-gradient(180deg, #00890B 0%, #33A13C 100%)}.tab-item.hp-green.active::after{border-style:solid;border-top-color:var(--color-green-06)}.tab-item.hp-red::before{background:linear-gradient(180deg, #D33E3E 0%, #DC6565 100%)}.tab-item.hp-red.active{background:linear-gradient(180deg, #D33E3E 0%, #DC6565 100%)}.tab-item.hp-red.active::after{border-style:solid;border-top-color:var(--color-red-06)}.tab-item.hp-gray::before{background:linear-gradient(180deg, #617480 0%, #819099 100%)}.tab-item.hp-gray.active{background:linear-gradient(180deg, #617480 0%, #819099 100%)}.tab-item.hp-gray.active::after{border-style:solid;border-top-color:var(--color-gray-06)}.tab-item.hp-orange::before{background:linear-gradient(180deg, #C37729 0%, #CF9254 100%)}.tab-item.hp-orange.active{background:linear-gradient(180deg, #C37729 0%, #CF9254 100%)}.tab-item.hp-orange.active::after{border-style:solid;border-top-color:var(--color-orange-06)}";
|
|
8
8
|
|
|
9
9
|
const HomepageClickableTab = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -26,7 +26,7 @@ const HomepageClickableTab = class {
|
|
|
26
26
|
this.isHovered = false;
|
|
27
27
|
}
|
|
28
28
|
render() {
|
|
29
|
-
return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: { 'tab-item': true, 'active': this.active, [this.activeColor]: true }, onClick: () => this.handleClick(), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, index.h("span",
|
|
29
|
+
return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: { 'tab-item': true, 'active': this.active, [this.activeColor]: true }, onClick: () => this.handleClick(), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), tabindex: "0" }, index.h("span", { class: "hyphenate-text" }, this.label))));
|
|
30
30
|
}
|
|
31
31
|
};
|
|
32
32
|
HomepageClickableTab.style = homepageClickableTabCss;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-63ddc79c.js');
|
|
6
6
|
|
|
7
|
-
const jumbotronSubMenuCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.menu{display:block;background-color:transparent;color:black;position:relative}.menu-list{list-style:none;margin:0;padding:
|
|
7
|
+
const jumbotronSubMenuCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.menu{display:block;background-color:transparent;color:black;position:relative}.menu-list{list-style:none;margin:0;padding:var(--ptc-element-spacing-03) 0;display:none;flex-direction:column;background-color:white;width:250px;position:absolute;top:40px;left:0;margin-top:var(--ptc-element-spacing-04);box-shadow:var(--ptc-shadow-x-small);border-radius:var(--ptc-border-radius-standard)}.menu-list.open{display:flex}.menu-list li{margin:0}.menu-list .active button{font-weight:var(--ptc-font-weight-bold)}.menu-list .active button::after{opacity:1}.menu-list button{color:var(--color-gray-10);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-medium);text-decoration:none;border:none;background:none;cursor:pointer;line-height:var(--ptc-line-height-p);position:relative;text-align:left;width:100%;padding:var(--ptc-element-spacing-03) var(--ptc-element-spacing-06);font-family:var(--ptc-font-latin)}.menu-list button::after{content:\"\";display:block;width:2px;height:24px;background:var(--color-green-07);transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout);opacity:0;position:absolute;top:25%;left:10px}.menu-list button:hover::after,.menu-list button:focus::after{opacity:1}.mobile-menu-icon{display:flex;align-items:center;cursor:pointer;font-size:var(--ptc-font-size-x-small);text-align:left;padding:8px 0px;background-color:var(--color-white);border-bottom:2px solid var(--color-white);justify-content:flex-end;width:fit-content;background-color:transparent}.mobile-menu-text{color:var(--color-white);text-align:center;font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);margin-right:var(--ptc-element-spacing-03)}@media (min-width: 992px){.menu{display:flex;justify-content:center;align-items:center;background-color:transparent;padding:0px;color:white;position:relative;font-family:var(--ptc-font-latin);left:0;top:0px}.menu-list{display:flex;flex-direction:row;justify-content:center;gap:32px;background-color:transparent;width:auto;position:relative;top:auto;right:auto;box-shadow:none;border-radius:0;margin-top:0px;padding-top:0px;padding-bottom:0px}.menu-list button{text-align:center;width:auto;padding:0px;font-size:16px;color:white;font-family:var(--ptc-font-latin)}.menu-list button::after{position:absolute;width:100%;height:1px;transform-origin:bottom;bottom:0;margin-top:24px;background:var(--color-white);left:0;transform:scaleY(0);transition:all var(--ptc-transition-medium) var(--ptc-ease-in)}.menu-list button:hover::after,.menu-list button:focus::after{transform:scaleY(1);font-weight:var(--ptc-font-weight-bold)}.menu-list li.active button::after{height:2px;transform:scaleY(1);font-weight:var(--ptc-font-weight-bold)}.mobile-menu-icon{display:none}}";
|
|
8
8
|
|
|
9
9
|
const JumbotronSubMenu = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-63ddc79c.js');
|
|
6
6
|
|
|
7
|
-
const ptcBackgroundVideoCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;position:relative}:host video{position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100;object-fit:cover}:host .video-overlay{z-index:1;display:block;position:absolute;width:100%;height:100%;top:0;left:0;opacity:0.8;background-image:linear-gradient(270deg, rgba(30, 38, 38, 0) 26%, #1e2626)}:host .video-overlay.dark{background-color:rgba(0, 0, 0, 0.6)}:host(.legacy){display:block;position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100}:host(.legacy) video{object-fit:cover;position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden}:host .iframe-wrapper{position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100}:host .iframe-wrapper .background-video-embed{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%}:host .iframe-wrapper .player .vp-video-wrapper .vp-telecine-cover video{object-fit:cover}:host .play-button{position:absolute;top:1.5rem;right:1.5rem;width:34px;height:34px;z-index:99}@media (min-width: 768px){:host .play-button.top-right{top:2rem;right:2rem}}:host .play-button.top-left{right:unset;top:1.5rem;left:1.5rem}@media (min-width: 768px){:host .play-button.top-left{bottom:3.75rem;left:2rem}}@media (min-width: 768px){:host .play-button.bottom-left{top:unset;right:unset;bottom:3.75rem;left:2rem}}@media (min-width: 768px){:host .play-button.bottom-right{top:unset;bottom:3.75rem;right:2rem}}:host .play-button.allbp-bottom-right{top:unset;bottom:
|
|
7
|
+
const ptcBackgroundVideoCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block;position:relative}:host video{position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100;object-fit:cover}:host .video-overlay{z-index:1;display:block;position:absolute;width:100%;height:100%;top:0;left:0;opacity:0.8;background-image:linear-gradient(270deg, rgba(30, 38, 38, 0) 26%, #1e2626)}:host .video-overlay.dark{background-color:rgba(0, 0, 0, 0.6)}:host(.legacy){display:block;position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100}:host(.legacy) video{object-fit:cover;position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden}:host .iframe-wrapper{position:absolute;top:0px;left:0px;right:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100}:host .iframe-wrapper .background-video-embed{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:100%;height:100%}:host .iframe-wrapper .player .vp-video-wrapper .vp-telecine-cover video{object-fit:cover}:host .play-button{position:absolute;top:1.5rem;right:1.5rem;width:34px;height:34px;z-index:99}@media (min-width: 768px){:host .play-button.top-right{top:2rem;right:2rem}}:host .play-button.top-left{right:unset;top:1.5rem;left:1.5rem}@media (min-width: 768px){:host .play-button.top-left{bottom:3.75rem;left:2rem}}@media (min-width: 768px){:host .play-button.bottom-left{top:unset;right:unset;bottom:3.75rem;left:2rem}}@media (min-width: 768px){:host .play-button.bottom-right{top:unset;bottom:3.75rem;right:2rem}}:host .play-button.allbp-bottom-right{top:unset;bottom:4.75rem;right:2rem}:host .play-button ptc-button{display:inline-block;padding:5px;position:relative;top:-5px;left:-5px;cursor:pointer}@media only screen and (min-width: 768px){:host .play-button ptc-button{top:auto;left:auto}}@media only screen and (min-width: 992px){:host .play-button ptc-button{padding:0}}";
|
|
8
8
|
|
|
9
9
|
const PtcBackgroundVideo = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -48,7 +48,7 @@ const PtcBackgroundVideo = class {
|
|
|
48
48
|
}
|
|
49
49
|
render() {
|
|
50
50
|
const videoContent = this.isIframe ? (index.h("div", { class: "iframe-wrapper" }, index.h("iframe", { id: "jumbotron-iframe", src: this.videoSrc, frameborder: 0, allow: "autoplay", allowFullScreen: true, class: "background-video-embed" }))) : (index.h("video", { src: this.videoSrc, poster: this.posterSrc, autoplay: true, loop: true, muted: true, playsinline: true }));
|
|
51
|
-
return (index.h(index.Host, { class: this.type }, videoContent, !!this.videoSrc && this.playButtonTitle && (index.h("div", { class: `play-button ${this.buttonLocation}` }, this.paused && (index.h("ptc-tooltip", { class: "play-btn", mode: "wrapper", description: this.playButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important;}" }, index.h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), styles: "button.icon-toggle { padding :0px 8px; }", "aria-label": "Video Play button" }, index.h("icon-asset", { name: "play", size: "small", type: "ptc", color: "black" })))), !this.paused && !!this.pauseButtonTitle && (index.h("ptc-tooltip", { class: "pause-btn", mode: "wrapper", description: this.pauseButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important;}" }, index.h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), "aria-label": "Video Pause button" }, index.h("icon-asset", { name: "pause", size: "small", type: "ptc", color: "black" })))))), this.overlay ? index.h("div", { class: `video-overlay ${this.overlayType}` }) : '', this.type == 'default' ? index.h("slot", null) : ''));
|
|
51
|
+
return (index.h(index.Host, { class: this.type }, videoContent, !!this.videoSrc && this.playButtonTitle && (index.h("div", { class: `play-button ${this.buttonLocation}` }, this.paused && (index.h("ptc-tooltip", { class: "play-btn", mode: "wrapper", description: this.playButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important; white-space: nowrap}" }, index.h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), styles: "button.icon-toggle { padding :0px 8px; }", "aria-label": "Video Play button" }, index.h("icon-asset", { name: "play", size: "small", type: "ptc", color: "black" })))), !this.paused && !!this.pauseButtonTitle && (index.h("ptc-tooltip", { class: "pause-btn", mode: "wrapper", description: this.pauseButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important; white-space: nowrap}" }, index.h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), "aria-label": "Video Pause button" }, index.h("icon-asset", { name: "pause", size: "small", type: "ptc", color: "black" })))))), this.overlay ? index.h("div", { class: `video-overlay ${this.overlayType}` }) : '', this.type == 'default' ? index.h("slot", null) : ''));
|
|
52
52
|
}
|
|
53
53
|
toggleVideoPlay(e) {
|
|
54
54
|
e.preventDefault();
|
|
@@ -17,10 +17,30 @@ const PtcInfoTile = class {
|
|
|
17
17
|
handleClick() {
|
|
18
18
|
this.tileClick.emit();
|
|
19
19
|
}
|
|
20
|
+
handleKeyPress(event) {
|
|
21
|
+
if (event.key === 'Enter') {
|
|
22
|
+
if (this.link) {
|
|
23
|
+
const linkElement = this.el.shadowRoot.querySelector('a.link-press');
|
|
24
|
+
if (linkElement) {
|
|
25
|
+
linkElement.click();
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
else {
|
|
29
|
+
this.handleClick();
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
componentDidLoad() {
|
|
34
|
+
this.el.addEventListener('keydown', this.handleKeyPress.bind(this));
|
|
35
|
+
}
|
|
36
|
+
disconnectedCallback() {
|
|
37
|
+
this.el.removeEventListener('keydown', this.handleKeyPress.bind(this));
|
|
38
|
+
}
|
|
20
39
|
render() {
|
|
21
40
|
const content = (index.h("div", { class: "tile-content" }, index.h("span", { class: "tile-title-span" }, index.h("slot", { name: "tile-title" })), index.h("div", { class: "tile-title-desc" }, index.h("slot", { name: "tile-description" }))));
|
|
22
|
-
return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: `tile ${this.variant}`, onClick: () => this.handleClick() }, this.variant === 'image' && (index.h("div", { class: "tile-image" }, index.h("slot", { name: "tile-image" }))), content, this.link && index.h("a", { href: this.link, class: "link-overlay" }))));
|
|
41
|
+
return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: `tile ${this.variant}`, onClick: () => this.handleClick() }, this.variant === 'image' && (index.h("div", { class: "tile-image" }, index.h("slot", { name: "tile-image" }))), content, this.link && index.h("a", { href: this.link, class: "link-overlay link-press", tabindex: "-1" }))));
|
|
23
42
|
}
|
|
43
|
+
get el() { return index.getElement(this); }
|
|
24
44
|
};
|
|
25
45
|
PtcInfoTile.style = ptcInfoTileCss;
|
|
26
46
|
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
const index = require('./index-63ddc79c.js');
|
|
6
6
|
|
|
7
|
-
const ptcJumbotronCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.ptc-container{padding-right:24px;padding-left:24px;margin-right:auto;margin-left:auto}@media only screen and (min-width: 1200px){.ptc-container{padding-left:0;padding-right:0;max-width:1136px}}@media only screen and (min-width: 1440px){.ptc-container{padding-left:0;padding-right:0;max-width:1200px}}.ptc-container-lg{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media only screen and (min-width: 480px){.ptc-container-lg{padding-left:var(--ptc-layout-spacing-03);padding-right:var(--ptc-layout-spacing-03)}}@media only screen and (min-width: 768px){.ptc-container-lg{padding-left:var(--ptc-layout-spacing-04);padding-right:var(--ptc-layout-spacing-04)}}@media only screen and (min-width: 992px){.ptc-container-lg{padding-left:var(--ptc-element-spacing-08);padding-right:var(--ptc-element-spacing-08)}}@media only screen and (min-width: 1980px){.ptc-container-lg{padding-left:0;padding-right:0;max-width:1900px}}.ptc-container-fluid{width:100%}.u-para-sm{font-size:var(--ptc-font-size-small) !important}.u-para-md{font-size:var(--ptc-font-size-medium) !important}.u-para-lg{font-size:var(--ptc-font-size-large) !important}.u-para-xl{font-size:var(--ptc-font-size-x-large) !important}.u-para-xxl{font-size:var(--ptc-font-size-xx-large) !important}.u-para-xxxl{font-size:var(--ptc-font-size-xxx-large) !important}@media only screen and (min-width: 768px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.05vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.05vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.05vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.05vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.05vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.05vw) !important}}@media only screen and (min-width: 992px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.1vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.1vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.1vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.1vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.1vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.1vw) !important}}@media only screen and (min-width: 1200px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.15vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.15vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.15vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.15vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.15vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.15vw) !important}}@media only screen and (min-width: 1440px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.2vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.2vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.2vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.2vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.2vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.2vw) !important}}@media only screen and (min-width: 1600px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.25vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.25vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.25vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.25vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.25vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.25vw) !important}}@media only screen and (min-width: 1980px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.3vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.3vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.3vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.3vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.3vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.3vw) !important}}@media only screen and (min-width: 2600px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.35vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.35vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.35vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.35vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.35vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.35vw) !important}}.u-para-body{font-size:var(--ptc-font-size-medium) !important}.u-color-white{color:var(--color-white) !important}.u-uppercase{text-transform:uppercase !important}.u-margin-flush{margin:0 !important}.u-marginTop-flush{margin-top:0 !important}.u-marginLeft-flush{margin-left:0 !important}.u-marginRight-flush{margin-right:0 !important}.u-marginBottom-flush{margin-bottom:0 !important}.u-padding-flush{padding:0 !important}.u-paddingTop-flush{padding-top:0 !important}.u-paddingLeft-flush{padding-left:0 !important}.u-paddingRight-flush{padding-right:0 !important}.u-paddingBottom-flush{padding-bottom:0 !important}.u-margin-xs{margin:var(--ptc-element-spacing-01) !important}.u-marginTop-xs{margin-top:var(--ptc-element-spacing-01) !important}.u-marginLeft-xs{margin-left:var(--ptc-element-spacing-01) !important}.u-marginRight-xs{margin-right:var(--ptc-element-spacing-01) !important}.u-marginBottom-xs{margin-bottom:var(--ptc-element-spacing-01) !important}.u-margin-sm{margin:var(--ptc-element-spacing-02) !important}.u-marginTop-sm{margin-top:var(--ptc-element-spacing-02) !important}.u-marginLeft-sm{margin-left:var(--ptc-element-spacing-02) !important}.u-marginRight-sm{margin-right:var(--ptc-element-spacing-02) !important}.u-marginBottom-sm{margin-bottom:var(--ptc-element-spacing-02) !important}.u-margin-md{margin:var(--ptc-element-spacing-03) !important}.u-marginTop-md{margin-top:var(--ptc-element-spacing-03) !important}.u-marginLeft-md{margin-left:var(--ptc-element-spacing-03) !important}.u-marginRight-md{margin-right:var(--ptc-element-spacing-03) !important}.u-marginBottom-md{margin-bottom:var(--ptc-element-spacing-03) !important}.u-margin-lg{margin:var(--ptc-element-spacing-04) !important}.u-marginTop-lg{margin-top:var(--ptc-element-spacing-04) !important}.u-marginLeft-lg{margin-left:var(--ptc-element-spacing-04) !important}.u-marginRight-lg{margin-right:var(--ptc-element-spacing-04) !important}.u-marginBottom-lg{margin-bottom:var(--ptc-element-spacing-04) !important}.u-margin-xl{margin:var(--ptc-element-spacing-05) !important}.u-marginTop-xl{margin-top:var(--ptc-element-spacing-05) !important}.u-marginLeft-xl{margin-left:var(--ptc-element-spacing-05) !important}.u-marginRight-xl{margin-right:var(--ptc-element-spacing-05) !important}.u-marginBottom-xl{margin-bottom:var(--ptc-element-spacing-05) !important}.u-margin-xxl{margin:var(--ptc-element-spacing-06) !important}.u-marginTop-xxl{margin-top:var(--ptc-element-spacing-06) !important}.u-marginLeft-xxl{margin-left:var(--ptc-element-spacing-06) !important}.u-marginRight-xxl{margin-right:var(--ptc-element-spacing-06) !important}.u-marginBottom-xxl{margin-bottom:var(--ptc-element-spacing-06) !important}.u-margin-xxxl{margin:var(--ptc-element-spacing-07) !important}.u-marginTop-xxxl{margin-top:var(--ptc-element-spacing-07) !important}.u-marginLeft-xxxl{margin-left:var(--ptc-element-spacing-07) !important}.u-marginRight-xxxl{margin-right:var(--ptc-element-spacing-07) !important}.u-marginBottom-xxxl{margin-bottom:var(--ptc-element-spacing-07) !important}.u-margin-4xl{margin:var(--ptc-element-spacing-08) !important}.u-marginTop-4xl{margin-top:var(--ptc-element-spacing-08) !important}.u-marginLeft-4xl{margin-left:var(--ptc-element-spacing-08) !important}.u-marginRight-4xl{margin-right:var(--ptc-element-spacing-08) !important}.u-marginBottom-4xl{margin-bottom:var(--ptc-element-spacing-08) !important}.u-textAlign-ctr{text-align:center !important}.u-textAlign-right{text-align:right !important}.u-textAlign-left{text-align:left !important}.u-textWhite{color:var(--color-white) !important}.u-textGreen1{color:var(--color-green-07) !important}.u-textGreen2{color:var(--color-green-06) !important}.u-text-nowrap{white-space:nowrap}.u-text-medium{font-weight:var(--ptc-font-weight-medium)}.u-text-semibold{font-weight:var(--ptc-font-weight-semibold)}.u-text-bold{font-weight:var(--ptc-font-weight-bold)}.u-text-thin{font-weight:var(--ptc-font-weight-thin)}.u-textStyle-normal{font-style:normal !important}.u-no-scroll{overflow:hidden}.u-background-white{background-color:var(--color-white)}.u-background-reset{background-color:transparent !important}.u-white-overylay{background:rgba(242, 242, 242, 0.9)}.u-cursor-pointer{cursor:pointer}.u-clear{clear:both}.u-border-radius-standard{border-radius:var(--ptc-border-radius-standard)}.u-border-radius-large{border-radius:var(--ptc-border-radius-large)}.u-border-radius-pill{border-radius:var(--ptc-border-radius-pill)}.u-border-radius-circle{border-radius:var(--ptc-border-radius-circle)}.u-border-none{border:none}.u-shadow-x-small{box-shadow:var(--ptc-shadow-x-small)}.u-shadow-small{box-shadow:var(--ptc-shadow-small)}.u-shadow-medium{box-shadow:var(--ptc-shadow-medium)}.u-shadow-large{box-shadow:var(--ptc-shadow-large)}.u-shadow-x-large{box-shadow:var(--ptc-shadow-x-large)}@media only screen and (min-width: 768px){.u-hero-width{width:525px}.u-margin-center{margin:0 auto}.u-justify-self-end{justify-self:flex-end}}.u-hero-pushup{transform:translateY(-120px)}@media only screen and (min-width: 768px){.u-hero-pushup{transform:translateY(-144px)}}@media only screen and (min-width: 768px){.grid-order-1-md{order:1}.grid-order-2-md{order:2}.grid-order-3-md{order:3}}@media only screen and (min-width: 992px){.grid-order-1-lg{order:1}.grid-order-2-lg{order:2}.grid-order-3-lg{order:3}}.standard-list{list-style:none;margin-left:0;margin-bottom:20px;padding:0}.is-spaced-between{justify-content:space-between}.h-100{height:100%}.grid-large-col-gap-md{column-gap:0}@media only screen and (min-width: 992px){.grid-large-col-gap-md{column-gap:3rem}}.grid-large-col-gap-sm{column-gap:0}@media only screen and (min-width: 768px){.grid-large-col-gap-sm{column-gap:3rem}}.grid-x-large-col-gap-md{column-gap:0}@media only screen and (min-width: 992px){.grid-x-large-col-gap-md{column-gap:4rem}}.grid-x-large-col-gap-sm{column-gap:0}@media only screen and (min-width: 768px){.grid-x-large-col-gap-sm{column-gap:4rem}}.grid-medium-col-gap-md{column-gap:0}@media only screen and (min-width: 992px){.grid-medium-col-gap-md{column-gap:2rem}}.grid-medium-col-gap-sm{column-gap:0}@media only screen and (min-width: 768px){.grid-medium-col-gap-sm{column-gap:2rem}}.is-float-left{float:left}.is-float-right{float:right}.is-mobile{display:block}.is-desktop{display:none}@media only screen and (min-width: 992px){.is-mobile{display:none}.is-desktop{display:block}}.ptc-section{padding-top:3rem;padding-bottom:3rem}.ptc-section-standard{padding-top:3rem;padding-bottom:3rem}.ptc-section-half{padding-top:1.5rem;padding-bottom:1.5rem}.ptc-section-large{padding-top:2.25rem;padding-bottom:2.25rem}@media only screen and (min-width: 992px){.ptc-section-large{padding-top:3.5rem;padding-bottom:3.5rem}}.u-flex{display:flex}@media only screen and (min-width: 480px){.u-flex-xs{display:flex}}@media only screen and (min-width: 768px){.u-flex-sm{display:flex}}@media only screen and (min-width: 992px){.u-flex-md{display:flex}}@media only screen and (min-width: 1200px){.u-flex-lg{display:flex}}@media only screen and (min-width: 1440px){.u-flex-xl{display:flex}}@media only screen and (min-width: 1600px){.u-flex-xxl{display:flex}}@media only screen and (min-width: 1980px){.u-flex-2k{display:flex}}@media only screen and (min-width: 2600px){.u-flex-4k{display:flex}}.u-align-center{margin:auto;align-self:center}.u-align-left{margin-right:auto;align-self:center}.u-align-right{margin-left:auto;align-self:center}.u-align-x-center{margin-right:auto;margin-left:auto}.u-align-x-left{margin-right:auto}.u-align-x-right{margin-left:auto}.u-align-y-center{align-self:center}.u-align-y-top{align-self:flex-start}.u-align-y-bottom{align-self:flex-end}.is-flex-column{flex-direction:column}.flex-align-items{align-items:flex-end}.flex-align-items-center{align-items:center}.u-flex-nowrap{flex-wrap:nowrap}.u-flex-wrap{flex-wrap:wrap}.u-align-self-start{align-self:start}.u-align-self-center{align-self:center}.u-align-self-stretch{align-self:stretch}.u-justify-self-start{justify-self:start}.u-justify-self-center{justify-self:center}.u-justify-self-stretch{justify-self:stretch}.u-flex-justify-center{justify-content:center}.u-flex-justify-flexend{justify-content:flex-end}.u-section-heading-wrapper{max-width:768px;margin-left:auto;margin-right:auto}.embed-responsive{position:relative;display:block;height:0;padding:0;overflow:hidden}.embed-responsive-16by9{padding-bottom:56.25%}.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0}@media only screen and (min-width: 768px){.is-grid.grid-large-col-gap-xs-0{row-gap:0}}.max-content{max-width:90%;margin:auto}@media only screen and (min-width: 480px){.max-content{max-width:80%}}.u-justify-space-between{justify-content:space-between}.all-product-banner{padding:50px 0 44px 0px}@media only screen and (min-width: 992px){.all-product-banner{padding:50px 0 72px 0px;display:flex;min-height:300px;justify-content:center;align-items:center}}.all-product-gradient{background:linear-gradient(180deg, #f3f3f3 2.6%, rgba(225, 241, 226, 0.2) 40.63%, #f3f3f3 82.29%), linear-gradient(0deg, #f3f3f3, #f3f3f3)}.menu-right ptc-nav-submenu{position:relative}.media-thumb-feature{display:block}@media only screen and (min-width: 992px){.media-thumb-feature{display:flex;justify-content:space-between}}.media-thumb-feature .media-thumb{width:100%;margin-bottom:2rem}@media only screen and (min-width: 992px){.media-thumb-feature .media-thumb{width:340px;flex:0 0 340px}}.media-thumb-feature .media-thumb>ptc-picture:not(:last-of-type),.media-thumb-feature .media-thumb>img:not(:last-of-type){margin-bottom:1.5rem}.media-thumb-feature .media-feature{width:100%;margin-bottom:2rem}@media only screen and (min-width: 992px){.media-thumb-feature .media-feature{width:auto;flex:1 1 auto}}.partner-card-desc h5.description{font-family:var(--ptc-font-latin);color:var(--color-gray-10);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-medium);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-medium);margin:0 0 10px 0}.partner-card-desc .tags{margin-bottom:0.75rem}.partner-card-desc .tags .tag:not(:first-child){border-left:2px solid var(--color-green-07);padding:0 8px}.partner-card-desc .tags .tag:first-child{padding:0 8px 0 0}.partner-card-desc .tags .tag{color:var(--color-gray-10);display:inline;font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-bold);letter-spacing:var(--ptc-letter-spacing-loose);margin:0 0 10px 0;padding:0 8px}.u-3-col-grid{width:100%;display:flex;flex-wrap:wrap;grid-row-gap:1rem;grid-column-gap:1rem}.u-3-col-grid .u-3-col{width:100%}@media only screen and (min-width: 768px){.u-3-col-grid .u-3-col{width:calc(50% - 10.66666666px)}}@media only screen and (min-width: 992px){.u-3-col-grid .u-3-col{width:calc(33.3333333333% - 10.66666666px)}}.u-3-col-grid.u-col-space-lg{grid-row-gap:2rem;grid-column-gap:2rem}.u-3-col-grid.u-col-space-lg .u-3-col{width:100%}@media only screen and (min-width: 768px){.u-3-col-grid.u-col-space-lg .u-3-col{width:calc(50% - 21.3333333px)}}@media only screen and (min-width: 992px){.u-3-col-grid.u-col-space-lg .u-3-col{width:calc(33.3333333333% - 21.3333333px)}}.u-display-none{display:none}ptc-preloader-section.min-height{min-height:150vh}@media only screen and (min-width: 1200px){.ms-mobile-select{display:none}}.ms-mobile-select.ms-show{position:fixed}.light-font{color:var(--color-white)}.light-font *{color:var(--color-white)}a{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);text-decoration-line:underline;color:var(--color-hyperlink);transition:color var(--ptc-transition-medium) var(--ptc-ease-out);font-weight:var(--ptc-font-weight-bold)}a:visited{color:var(--color-blue-10)}a:active,a:visited:active{transition:none;color:var(--color-blue-09)}a:hover,a:visited:hover{color:var(--color-blue-08)}a.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a),.light-links a.light-link,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a),.background-grey-10 a.light-link,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a),.background-plm-grey a.light-link{color:var(--color-blue-04)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited,.light-links a.light-link:visited,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited,.background-grey-10 a.light-link:visited,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited,.background-plm-grey a.light-link:visited{color:var(--color-blue-06)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):active,.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:active,.light-links a.light-link:active,.light-links a.light-link:visited:active,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):active,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:active,.background-grey-10 a.light-link:active,.background-grey-10 a.light-link:visited:active,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):active,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:active,.background-plm-grey a.light-link:active,.background-plm-grey a.light-link:visited:active{transition:none;color:var(--color-blue-07)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):hover,.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:hover,.light-links a.light-link:hover,.light-links a.light-link:visited:hover,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):hover,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:hover,.background-grey-10 a.light-link:hover,.background-grey-10 a.light-link:visited:hover,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):hover,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:hover,.background-plm-grey a.light-link:hover,.background-plm-grey a.light-link:visited:hover{color:var(--color-blue-05)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a).disabled,.light-links a.light-link.disabled,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a).disabled,.background-grey-10 a.light-link.disabled,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a).disabled,.background-plm-grey a.light-link.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.ptc-link{color:var(--color-gray-10);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link:hover{color:var(--color-green-06)}.ptc-link:visited{color:var(--color-gray-10)}.ptc-link:active,.ptc-link:visited:active{transition:none;color:var(--color-green-06)}.ptc-link:hover,.ptc-link:visited:hover{color:var(--color-green-06)}.ptc-link-dark{color:var(--color-white);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link-dark:hover{color:var(--color-green-06)}.ptc-link-dark:visited{color:var(--color-white)}.ptc-link-dark:active,.ptc-link-dark:visited:active{transition:none;color:var(--color-green-06)}.ptc-link-dark:hover,.ptc-link-dark:visited:hover{color:var(--color-green-06)}:host{display:block}@media only screen and (min-width: 992px){:host(:not(.png-jumbotron):not(.text-jumbotron):not(.gif-jumbotron)) .content-container{padding-top:20px;padding-bottom:16px}}.parent{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr;grid-column-gap:0px;grid-row-gap:0px;position:relative;z-index:1}.hp-adjustments{background-color:var(--color-black)}@media screen and (min-height: 600px){.hp-adjustments{height:90vh}}.hp-adjustments .div1{grid-area:1/1/3/2;min-height:300px}.hp-adjustments .div1.hidden{display:none}.hp-adjustments .div2{display:flex}.hp-adjustments .bg-overlay{background:linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 20%), linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%) !important}@media only screen and (min-width: 992px){.hp-adjustments .div1{grid-area:1/1/2/2;min-height:unset}.hp-adjustments .bg-overlay{background:linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 20%), linear-gradient(90deg, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0) 100%) !important}}.hp-adjustments .div1,.hp-adjustments .main-content-items{transition:opacity ease-out 250ms;opacity:1}.hp-adjustments.transitioning .div1,.hp-adjustments.transitioning .main-content-items{opacity:0}.div1{grid-area:1/1/2/2;min-height:300px}.div1.hidden{display:none}.mobile-media-image{display:flex;justify-content:center;align-items:center}@media only screen and (min-width: 992px){.mobile-media-image{display:none}}.gif-bg{background-color:#F3F3F3}.gif-bg img{width:100%;height:auto}@media only screen and (min-width: 768px){.gif-bg img{width:auto}}.video-ratio{position:relative;overflow:hidden;height:100%}.div2{grid-area:2/1/3/2;position:relative}.bg-overlay{position:absolute;width:100%;height:100%;top:0;left:0}.content-layout{display:flex;flex-direction:column}@media only screen and (min-width: 992px){.content-layout{flex-direction:row}}.content-layout.hp-container{width:100%}@media screen and (max-width: 992px){.content-layout.hp-container{max-width:720px;margin-left:unset}}@media only screen and (min-width: 1200px){.content-layout.hp-container{width:1136px}}@media only screen and (min-width: 1440px){.content-layout.hp-container{width:1200px}}.content-layout.hp-container .gap-adjustment{margin-bottom:unset}.gap-adjustment{gap:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-07)}@media only screen and (min-width: 992px){.gap-adjustment{gap:var(--ptc-element-spacing-07)}}.text-adjustment{justify-content:center}.desktop-media-image{width:40%;display:none}@media only screen and (min-width: 992px){.desktop-media-image{display:block}}.desk-gif-adjustment{z-index:3;display:none;justify-content:center;align-items:center}@media only screen and (min-width: 992px){.desk-gif-adjustment{display:flex}}.desk-gif-adjustment img{width:100%}@media only screen and (min-width: 992px){.parent{grid-template-columns:1fr;grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;min-height:500px;position:relative}.div1{grid-area:1/1/2/2;min-height:unset}.div2{grid-area:1/1/2/2;align-self:center;position:unset}}:host(.text-jumbotron) .parent{min-height:120px;padding:48px 0 24px 0}:host(.text-jumbotron) .parent .text-adjustment{margin-bottom:0;margin-top:20px}:host(.png-jumbotron) .desktop-media-image,:host(.png-jumbotron) .mobile-media-image{position:relative}:host(.png-jumbotron) .desktop-media-image .media-image-wrapper,:host(.png-jumbotron) .mobile-media-image .media-image-wrapper{height:100%;width:100%;display:flex;align-items:center;justify-content:center}:host(.png-jumbotron) ::slotted(ptc-svg-btn){position:absolute;left:50% !important;top:50% !important;transform:translate(-50%, -50%) !important}@media only screen and (min-width: 992px){:host(.png-jumbotron) max-width-container{box-sizing:border-box;padding-right:2rem}}.dl-img-wrap{position:relative;width:100%;height:100%}:host(.dark-video-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn),:host(.light-video-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn),:host(.light-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn),:host(.dark-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn){left:50% !important;top:50% !important;transform:translate(-50%, -50%) !important}ptc-info-tile:focus-visible{outline:3px solid var(--color-blue-07);outline-offset:2px}";
|
|
7
|
+
const ptcJumbotronCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.ptc-container{padding-right:24px;padding-left:24px;margin-right:auto;margin-left:auto}@media only screen and (min-width: 1200px){.ptc-container{padding-left:0;padding-right:0;max-width:1136px}}@media only screen and (min-width: 1440px){.ptc-container{padding-left:0;padding-right:0;max-width:1200px}}.ptc-container-lg{padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}@media only screen and (min-width: 480px){.ptc-container-lg{padding-left:var(--ptc-layout-spacing-03);padding-right:var(--ptc-layout-spacing-03)}}@media only screen and (min-width: 768px){.ptc-container-lg{padding-left:var(--ptc-layout-spacing-04);padding-right:var(--ptc-layout-spacing-04)}}@media only screen and (min-width: 992px){.ptc-container-lg{padding-left:var(--ptc-element-spacing-08);padding-right:var(--ptc-element-spacing-08)}}@media only screen and (min-width: 1980px){.ptc-container-lg{padding-left:0;padding-right:0;max-width:1900px}}.ptc-container-fluid{width:100%}.u-para-sm{font-size:var(--ptc-font-size-small) !important}.u-para-md{font-size:var(--ptc-font-size-medium) !important}.u-para-lg{font-size:var(--ptc-font-size-large) !important}.u-para-xl{font-size:var(--ptc-font-size-x-large) !important}.u-para-xxl{font-size:var(--ptc-font-size-xx-large) !important}.u-para-xxxl{font-size:var(--ptc-font-size-xxx-large) !important}@media only screen and (min-width: 768px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.05vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.05vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.05vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.05vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.05vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.05vw) !important}}@media only screen and (min-width: 992px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.1vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.1vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.1vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.1vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.1vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.1vw) !important}}@media only screen and (min-width: 1200px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.15vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.15vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.15vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.15vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.15vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.15vw) !important}}@media only screen and (min-width: 1440px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.2vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.2vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.2vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.2vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.2vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.2vw) !important}}@media only screen and (min-width: 1600px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.25vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.25vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.25vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.25vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.25vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.25vw) !important}}@media only screen and (min-width: 1980px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.3vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.3vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.3vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.3vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.3vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.3vw) !important}}@media only screen and (min-width: 2600px){.u-para-sm{font-size:calc(var(--ptc-font-size-small) + 0.35vw) !important}.u-para-md{font-size:calc(var(--ptc-font-size-medium) + 0.35vw) !important}.u-para-lg{font-size:calc(var(--ptc-font-size-large) + 0.35vw) !important}.u-para-xl{font-size:calc(var(--ptc-font-size-x-large) + 0.35vw) !important}.u-para-xxl{font-size:calc(var(--ptc-font-size-xx-large) + 0.35vw) !important}.u-para-xxxl{font-size:calc(var(--ptc-font-size-xxx-large) + 0.35vw) !important}}.u-para-body{font-size:var(--ptc-font-size-medium) !important}.u-color-white{color:var(--color-white) !important}.u-uppercase{text-transform:uppercase !important}.u-margin-flush{margin:0 !important}.u-marginTop-flush{margin-top:0 !important}.u-marginLeft-flush{margin-left:0 !important}.u-marginRight-flush{margin-right:0 !important}.u-marginBottom-flush{margin-bottom:0 !important}.u-padding-flush{padding:0 !important}.u-paddingTop-flush{padding-top:0 !important}.u-paddingLeft-flush{padding-left:0 !important}.u-paddingRight-flush{padding-right:0 !important}.u-paddingBottom-flush{padding-bottom:0 !important}.u-margin-xs{margin:var(--ptc-element-spacing-01) !important}.u-marginTop-xs{margin-top:var(--ptc-element-spacing-01) !important}.u-marginLeft-xs{margin-left:var(--ptc-element-spacing-01) !important}.u-marginRight-xs{margin-right:var(--ptc-element-spacing-01) !important}.u-marginBottom-xs{margin-bottom:var(--ptc-element-spacing-01) !important}.u-margin-sm{margin:var(--ptc-element-spacing-02) !important}.u-marginTop-sm{margin-top:var(--ptc-element-spacing-02) !important}.u-marginLeft-sm{margin-left:var(--ptc-element-spacing-02) !important}.u-marginRight-sm{margin-right:var(--ptc-element-spacing-02) !important}.u-marginBottom-sm{margin-bottom:var(--ptc-element-spacing-02) !important}.u-margin-md{margin:var(--ptc-element-spacing-03) !important}.u-marginTop-md{margin-top:var(--ptc-element-spacing-03) !important}.u-marginLeft-md{margin-left:var(--ptc-element-spacing-03) !important}.u-marginRight-md{margin-right:var(--ptc-element-spacing-03) !important}.u-marginBottom-md{margin-bottom:var(--ptc-element-spacing-03) !important}.u-margin-lg{margin:var(--ptc-element-spacing-04) !important}.u-marginTop-lg{margin-top:var(--ptc-element-spacing-04) !important}.u-marginLeft-lg{margin-left:var(--ptc-element-spacing-04) !important}.u-marginRight-lg{margin-right:var(--ptc-element-spacing-04) !important}.u-marginBottom-lg{margin-bottom:var(--ptc-element-spacing-04) !important}.u-margin-xl{margin:var(--ptc-element-spacing-05) !important}.u-marginTop-xl{margin-top:var(--ptc-element-spacing-05) !important}.u-marginLeft-xl{margin-left:var(--ptc-element-spacing-05) !important}.u-marginRight-xl{margin-right:var(--ptc-element-spacing-05) !important}.u-marginBottom-xl{margin-bottom:var(--ptc-element-spacing-05) !important}.u-margin-xxl{margin:var(--ptc-element-spacing-06) !important}.u-marginTop-xxl{margin-top:var(--ptc-element-spacing-06) !important}.u-marginLeft-xxl{margin-left:var(--ptc-element-spacing-06) !important}.u-marginRight-xxl{margin-right:var(--ptc-element-spacing-06) !important}.u-marginBottom-xxl{margin-bottom:var(--ptc-element-spacing-06) !important}.u-margin-xxxl{margin:var(--ptc-element-spacing-07) !important}.u-marginTop-xxxl{margin-top:var(--ptc-element-spacing-07) !important}.u-marginLeft-xxxl{margin-left:var(--ptc-element-spacing-07) !important}.u-marginRight-xxxl{margin-right:var(--ptc-element-spacing-07) !important}.u-marginBottom-xxxl{margin-bottom:var(--ptc-element-spacing-07) !important}.u-margin-4xl{margin:var(--ptc-element-spacing-08) !important}.u-marginTop-4xl{margin-top:var(--ptc-element-spacing-08) !important}.u-marginLeft-4xl{margin-left:var(--ptc-element-spacing-08) !important}.u-marginRight-4xl{margin-right:var(--ptc-element-spacing-08) !important}.u-marginBottom-4xl{margin-bottom:var(--ptc-element-spacing-08) !important}.u-textAlign-ctr{text-align:center !important}.u-textAlign-right{text-align:right !important}.u-textAlign-left{text-align:left !important}.u-textWhite{color:var(--color-white) !important}.u-textGreen1{color:var(--color-green-07) !important}.u-textGreen2{color:var(--color-green-06) !important}.u-text-nowrap{white-space:nowrap}.u-text-medium{font-weight:var(--ptc-font-weight-medium)}.u-text-semibold{font-weight:var(--ptc-font-weight-semibold)}.u-text-bold{font-weight:var(--ptc-font-weight-bold)}.u-text-thin{font-weight:var(--ptc-font-weight-thin)}.u-textStyle-normal{font-style:normal !important}.u-no-scroll{overflow:hidden}.u-background-white{background-color:var(--color-white)}.u-background-reset{background-color:transparent !important}.u-white-overylay{background:rgba(242, 242, 242, 0.9)}.u-cursor-pointer{cursor:pointer}.u-clear{clear:both}.u-border-radius-standard{border-radius:var(--ptc-border-radius-standard)}.u-border-radius-large{border-radius:var(--ptc-border-radius-large)}.u-border-radius-pill{border-radius:var(--ptc-border-radius-pill)}.u-border-radius-circle{border-radius:var(--ptc-border-radius-circle)}.u-border-none{border:none}.u-shadow-x-small{box-shadow:var(--ptc-shadow-x-small)}.u-shadow-small{box-shadow:var(--ptc-shadow-small)}.u-shadow-medium{box-shadow:var(--ptc-shadow-medium)}.u-shadow-large{box-shadow:var(--ptc-shadow-large)}.u-shadow-x-large{box-shadow:var(--ptc-shadow-x-large)}@media only screen and (min-width: 768px){.u-hero-width{width:525px}.u-margin-center{margin:0 auto}.u-justify-self-end{justify-self:flex-end}}.u-hero-pushup{transform:translateY(-120px)}@media only screen and (min-width: 768px){.u-hero-pushup{transform:translateY(-144px)}}@media only screen and (min-width: 768px){.grid-order-1-md{order:1}.grid-order-2-md{order:2}.grid-order-3-md{order:3}}@media only screen and (min-width: 992px){.grid-order-1-lg{order:1}.grid-order-2-lg{order:2}.grid-order-3-lg{order:3}}.standard-list{list-style:none;margin-left:0;margin-bottom:20px;padding:0}.is-spaced-between{justify-content:space-between}.h-100{height:100%}.grid-large-col-gap-md{column-gap:0}@media only screen and (min-width: 992px){.grid-large-col-gap-md{column-gap:3rem}}.grid-large-col-gap-sm{column-gap:0}@media only screen and (min-width: 768px){.grid-large-col-gap-sm{column-gap:3rem}}.grid-x-large-col-gap-md{column-gap:0}@media only screen and (min-width: 992px){.grid-x-large-col-gap-md{column-gap:4rem}}.grid-x-large-col-gap-sm{column-gap:0}@media only screen and (min-width: 768px){.grid-x-large-col-gap-sm{column-gap:4rem}}.grid-medium-col-gap-md{column-gap:0}@media only screen and (min-width: 992px){.grid-medium-col-gap-md{column-gap:2rem}}.grid-medium-col-gap-sm{column-gap:0}@media only screen and (min-width: 768px){.grid-medium-col-gap-sm{column-gap:2rem}}.is-float-left{float:left}.is-float-right{float:right}.is-mobile{display:block}.is-desktop{display:none}@media only screen and (min-width: 992px){.is-mobile{display:none}.is-desktop{display:block}}.ptc-section{padding-top:3rem;padding-bottom:3rem}.ptc-section-standard{padding-top:3rem;padding-bottom:3rem}.ptc-section-half{padding-top:1.5rem;padding-bottom:1.5rem}.ptc-section-large{padding-top:2.25rem;padding-bottom:2.25rem}@media only screen and (min-width: 992px){.ptc-section-large{padding-top:3.5rem;padding-bottom:3.5rem}}.u-flex{display:flex}@media only screen and (min-width: 480px){.u-flex-xs{display:flex}}@media only screen and (min-width: 768px){.u-flex-sm{display:flex}}@media only screen and (min-width: 992px){.u-flex-md{display:flex}}@media only screen and (min-width: 1200px){.u-flex-lg{display:flex}}@media only screen and (min-width: 1440px){.u-flex-xl{display:flex}}@media only screen and (min-width: 1600px){.u-flex-xxl{display:flex}}@media only screen and (min-width: 1980px){.u-flex-2k{display:flex}}@media only screen and (min-width: 2600px){.u-flex-4k{display:flex}}.u-align-center{margin:auto;align-self:center}.u-align-left{margin-right:auto;align-self:center}.u-align-right{margin-left:auto;align-self:center}.u-align-x-center{margin-right:auto;margin-left:auto}.u-align-x-left{margin-right:auto}.u-align-x-right{margin-left:auto}.u-align-y-center{align-self:center}.u-align-y-top{align-self:flex-start}.u-align-y-bottom{align-self:flex-end}.is-flex-column{flex-direction:column}.flex-align-items{align-items:flex-end}.flex-align-items-center{align-items:center}.u-flex-nowrap{flex-wrap:nowrap}.u-flex-wrap{flex-wrap:wrap}.u-align-self-start{align-self:start}.u-align-self-center{align-self:center}.u-align-self-stretch{align-self:stretch}.u-justify-self-start{justify-self:start}.u-justify-self-center{justify-self:center}.u-justify-self-stretch{justify-self:stretch}.u-flex-justify-center{justify-content:center}.u-flex-justify-flexend{justify-content:flex-end}.u-section-heading-wrapper{max-width:768px;margin-left:auto;margin-right:auto}.embed-responsive{position:relative;display:block;height:0;padding:0;overflow:hidden}.embed-responsive-16by9{padding-bottom:56.25%}.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;border:0}@media only screen and (min-width: 768px){.is-grid.grid-large-col-gap-xs-0{row-gap:0}}.max-content{max-width:90%;margin:auto}@media only screen and (min-width: 480px){.max-content{max-width:80%}}.u-justify-space-between{justify-content:space-between}.all-product-banner{padding:50px 0 44px 0px}@media only screen and (min-width: 992px){.all-product-banner{padding:50px 0 72px 0px;display:flex;min-height:300px;justify-content:center;align-items:center}}.all-product-gradient{background:linear-gradient(180deg, #f3f3f3 2.6%, rgba(225, 241, 226, 0.2) 40.63%, #f3f3f3 82.29%), linear-gradient(0deg, #f3f3f3, #f3f3f3)}.menu-right ptc-nav-submenu{position:relative}.media-thumb-feature{display:block}@media only screen and (min-width: 992px){.media-thumb-feature{display:flex;justify-content:space-between}}.media-thumb-feature .media-thumb{width:100%;margin-bottom:2rem}@media only screen and (min-width: 992px){.media-thumb-feature .media-thumb{width:340px;flex:0 0 340px}}.media-thumb-feature .media-thumb>ptc-picture:not(:last-of-type),.media-thumb-feature .media-thumb>img:not(:last-of-type){margin-bottom:1.5rem}.media-thumb-feature .media-feature{width:100%;margin-bottom:2rem}@media only screen and (min-width: 992px){.media-thumb-feature .media-feature{width:auto;flex:1 1 auto}}.partner-card-desc h5.description{font-family:var(--ptc-font-latin);color:var(--color-gray-10);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-medium);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-medium);margin:0 0 10px 0}.partner-card-desc .tags{margin-bottom:0.75rem}.partner-card-desc .tags .tag:not(:first-child){border-left:2px solid var(--color-green-07);padding:0 8px}.partner-card-desc .tags .tag:first-child{padding:0 8px 0 0}.partner-card-desc .tags .tag{color:var(--color-gray-10);display:inline;font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-bold);letter-spacing:var(--ptc-letter-spacing-loose);margin:0 0 10px 0;padding:0 8px}.u-3-col-grid{width:100%;display:flex;flex-wrap:wrap;grid-row-gap:1rem;grid-column-gap:1rem}.u-3-col-grid .u-3-col{width:100%}@media only screen and (min-width: 768px){.u-3-col-grid .u-3-col{width:calc(50% - 10.66666666px)}}@media only screen and (min-width: 992px){.u-3-col-grid .u-3-col{width:calc(33.3333333333% - 10.66666666px)}}.u-3-col-grid.u-col-space-lg{grid-row-gap:2rem;grid-column-gap:2rem}.u-3-col-grid.u-col-space-lg .u-3-col{width:100%}@media only screen and (min-width: 768px){.u-3-col-grid.u-col-space-lg .u-3-col{width:calc(50% - 21.3333333px)}}@media only screen and (min-width: 992px){.u-3-col-grid.u-col-space-lg .u-3-col{width:calc(33.3333333333% - 21.3333333px)}}.u-display-none{display:none}ptc-preloader-section.min-height{min-height:150vh}@media only screen and (min-width: 1200px){.ms-mobile-select{display:none}}.ms-mobile-select.ms-show{position:fixed}.light-font{color:var(--color-white)}.light-font *{color:var(--color-white)}a{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);text-decoration-line:underline;color:var(--color-hyperlink);transition:color var(--ptc-transition-medium) var(--ptc-ease-out);font-weight:var(--ptc-font-weight-bold)}a:visited{color:var(--color-blue-10)}a:active,a:visited:active{transition:none;color:var(--color-blue-09)}a:hover,a:visited:hover{color:var(--color-blue-08)}a.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a),.light-links a.light-link,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a),.background-grey-10 a.light-link,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a),.background-plm-grey a.light-link{color:var(--color-blue-04)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited,.light-links a.light-link:visited,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited,.background-grey-10 a.light-link:visited,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited,.background-plm-grey a.light-link:visited{color:var(--color-blue-06)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):active,.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:active,.light-links a.light-link:active,.light-links a.light-link:visited:active,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):active,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:active,.background-grey-10 a.light-link:active,.background-grey-10 a.light-link:visited:active,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):active,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:active,.background-plm-grey a.light-link:active,.background-plm-grey a.light-link:visited:active{transition:none;color:var(--color-blue-07)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):hover,.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:hover,.light-links a.light-link:hover,.light-links a.light-link:visited:hover,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):hover,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:hover,.background-grey-10 a.light-link:hover,.background-grey-10 a.light-link:visited:hover,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):hover,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a):visited:hover,.background-plm-grey a.light-link:hover,.background-plm-grey a.light-link:visited:hover{color:var(--color-blue-05)}.light-links a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a).disabled,.light-links a.light-link.disabled,.background-grey-10 a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a).disabled,.background-grey-10 a.light-link.disabled,.background-plm-grey a:not(.hero-footer-form-wrapper a,ptc-modal inline-form a).disabled,.background-plm-grey a.light-link.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.ptc-link{color:var(--color-gray-10);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link:hover{color:var(--color-green-06)}.ptc-link:visited{color:var(--color-gray-10)}.ptc-link:active,.ptc-link:visited:active{transition:none;color:var(--color-green-06)}.ptc-link:hover,.ptc-link:visited:hover{color:var(--color-green-06)}.ptc-link-dark{color:var(--color-white);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link-dark:hover{color:var(--color-green-06)}.ptc-link-dark:visited{color:var(--color-white)}.ptc-link-dark:active,.ptc-link-dark:visited:active{transition:none;color:var(--color-green-06)}.ptc-link-dark:hover,.ptc-link-dark:visited:hover{color:var(--color-green-06)}:host{display:block}@media only screen and (min-width: 992px){:host(:not(.png-jumbotron):not(.text-jumbotron):not(.gif-jumbotron)) .content-container{padding-top:20px;padding-bottom:16px}}.parent{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr;grid-column-gap:0px;grid-row-gap:0px;position:relative;z-index:1}.hp-adjustments{background-color:var(--color-black)}.hp-adjustments .div1{grid-area:1/1/3/2;min-height:300px}.hp-adjustments .div1.hidden{display:none}.hp-adjustments .div2{display:flex}.hp-adjustments .bg-overlay{background:linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 20%), linear-gradient(0deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.6) 100%) !important}@media only screen and (min-width: 992px){.hp-adjustments .div1{grid-area:1/1/2/2;min-height:unset}.hp-adjustments .bg-overlay{background:linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0) 20%), linear-gradient(90deg, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0) 100%) !important}}.hp-adjustments .div1,.hp-adjustments .main-content-items{transition:opacity ease-out 250ms;opacity:1}.hp-adjustments.transitioning .div1,.hp-adjustments.transitioning .main-content-items{opacity:0}@media screen and (min-width: 992.01px){.hp-adjustments{height:90vh}}.div1{grid-area:1/1/2/2;min-height:300px}.div1.hidden{display:none}.mobile-media-image{display:flex;justify-content:center;align-items:center}@media only screen and (min-width: 992px){.mobile-media-image{display:none}}.gif-bg{background-color:#F3F3F3}.gif-bg img{width:100%;height:auto}@media only screen and (min-width: 768px){.gif-bg img{width:auto}}.video-ratio{position:relative;overflow:hidden;height:100%}.div2{grid-area:2/1/3/2;position:relative}.bg-overlay{position:absolute;width:100%;height:100%;top:0;left:0}.content-layout{display:flex;flex-direction:column}@media only screen and (min-width: 992px){.content-layout{flex-direction:row}}.content-layout.hp-container{width:100%}@media screen and (max-width: 992px){.content-layout.hp-container{max-width:720px;margin-left:unset;margin-top:160px;margin-bottom:160px}}@media only screen and (min-width: 1200px){.content-layout.hp-container{width:1136px}}@media only screen and (min-width: 1440px){.content-layout.hp-container{width:1200px}}.content-layout.hp-container .gap-adjustment{margin-bottom:unset}.gap-adjustment{gap:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-07)}@media only screen and (min-width: 992px){.gap-adjustment{gap:var(--ptc-element-spacing-07)}}.text-adjustment{justify-content:center}.desktop-media-image{width:40%;display:none}@media only screen and (min-width: 992px){.desktop-media-image{display:block}}.desk-gif-adjustment{z-index:3;display:none;justify-content:center;align-items:center}@media only screen and (min-width: 992px){.desk-gif-adjustment{display:flex}}.desk-gif-adjustment img{width:100%}@media only screen and (min-width: 992px){.parent{grid-template-columns:1fr;grid-template-rows:1fr;grid-column-gap:0px;grid-row-gap:0px;min-height:500px;position:relative}.div1{grid-area:1/1/2/2;min-height:unset}.div2{grid-area:1/1/2/2;align-self:center;position:unset}}:host(.text-jumbotron) .parent{min-height:120px;padding:48px 0 24px 0}:host(.text-jumbotron) .parent .text-adjustment{margin-bottom:0;margin-top:20px}:host(.png-jumbotron) .desktop-media-image,:host(.png-jumbotron) .mobile-media-image{position:relative}:host(.png-jumbotron) .desktop-media-image .media-image-wrapper,:host(.png-jumbotron) .mobile-media-image .media-image-wrapper{height:100%;width:100%;display:flex;align-items:center;justify-content:center}:host(.png-jumbotron) ::slotted(ptc-svg-btn){position:absolute;left:50% !important;top:50% !important;transform:translate(-50%, -50%) !important}@media only screen and (min-width: 992px){:host(.png-jumbotron) max-width-container{box-sizing:border-box;padding-right:2rem}}.dl-img-wrap{position:relative;width:100%;height:100%}:host(.dark-video-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn),:host(.light-video-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn),:host(.light-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn),:host(.dark-jumbotron) .mobile-modal-play-btn ::slotted(ptc-svg-btn){left:50% !important;top:50% !important;transform:translate(-50%, -50%) !important}ptc-info-tile:focus-visible{outline:3px solid var(--color-blue-07);outline-offset:2px}";
|
|
8
8
|
|
|
9
9
|
const PtcJumbotron = class {
|
|
10
10
|
constructor(hostRef) {
|
|
@@ -61,7 +61,7 @@ ptc-link, ptc-square-card,
|
|
|
61
61
|
|
|
62
62
|
.tab-item {
|
|
63
63
|
cursor: pointer;
|
|
64
|
-
color:
|
|
64
|
+
color: var(--color-white);
|
|
65
65
|
border-radius: var(--ptc-border-radius-standard);
|
|
66
66
|
display: flex;
|
|
67
67
|
width: -webkit-fill-available;
|
|
@@ -72,16 +72,14 @@ ptc-link, ptc-square-card,
|
|
|
72
72
|
align-items: center;
|
|
73
73
|
gap: 10px;
|
|
74
74
|
align-self: stretch;
|
|
75
|
-
color: #FFF;
|
|
76
75
|
text-align: center;
|
|
77
|
-
font-family:
|
|
78
|
-
font-size:
|
|
79
|
-
font-
|
|
80
|
-
font-weight: 800;
|
|
76
|
+
font-family: var(--ptc-font-latin);
|
|
77
|
+
font-size: var(--ptc-font-size-small);
|
|
78
|
+
font-weight: var(--ptc-font-weight-extrabold);
|
|
81
79
|
}
|
|
82
80
|
@media screen and (min-width: 1200px) {
|
|
83
81
|
.tab-item {
|
|
84
|
-
font-size:
|
|
82
|
+
font-size: var(--ptc-font-size-medium);
|
|
85
83
|
}
|
|
86
84
|
}
|
|
87
85
|
@media screen and (min-width: 1280px) {
|
|
@@ -114,19 +112,19 @@ ptc-link, ptc-square-card,
|
|
|
114
112
|
opacity: 1;
|
|
115
113
|
}
|
|
116
114
|
.tab-item.active {
|
|
117
|
-
color:
|
|
118
|
-
position: relative;
|
|
115
|
+
color: var(--color-white);
|
|
119
116
|
}
|
|
120
117
|
.tab-item.active::after {
|
|
121
118
|
content: "";
|
|
122
119
|
position: absolute;
|
|
123
|
-
|
|
120
|
+
bottom: -21px;
|
|
124
121
|
left: 50%;
|
|
125
122
|
transform: translateX(-50%);
|
|
126
|
-
width:
|
|
127
|
-
height:
|
|
128
|
-
|
|
129
|
-
border-
|
|
123
|
+
width: 0;
|
|
124
|
+
height: 0;
|
|
125
|
+
border-top: 19px;
|
|
126
|
+
border-left: 14px solid transparent;
|
|
127
|
+
border-right: 14px solid transparent;
|
|
130
128
|
}
|
|
131
129
|
.tab-item.hp-blue::before {
|
|
132
130
|
background: linear-gradient(180deg, #197BC0 0%, #4795CD 100%);
|
|
@@ -137,7 +135,6 @@ ptc-link, ptc-square-card,
|
|
|
137
135
|
.tab-item.hp-blue.active::after {
|
|
138
136
|
border-style: solid;
|
|
139
137
|
border-top-color: var(--color-blue-06);
|
|
140
|
-
background: var(--color-blue-06);
|
|
141
138
|
}
|
|
142
139
|
.tab-item.hp-green::before {
|
|
143
140
|
background: linear-gradient(180deg, #00890B 0%, #33A13C 100%);
|
|
@@ -148,7 +145,6 @@ ptc-link, ptc-square-card,
|
|
|
148
145
|
.tab-item.hp-green.active::after {
|
|
149
146
|
border-style: solid;
|
|
150
147
|
border-top-color: var(--color-green-06);
|
|
151
|
-
background: var(--color-green-06);
|
|
152
148
|
}
|
|
153
149
|
.tab-item.hp-red::before {
|
|
154
150
|
background: linear-gradient(180deg, #D33E3E 0%, #DC6565 100%);
|
|
@@ -159,7 +155,6 @@ ptc-link, ptc-square-card,
|
|
|
159
155
|
.tab-item.hp-red.active::after {
|
|
160
156
|
border-style: solid;
|
|
161
157
|
border-top-color: var(--color-red-06);
|
|
162
|
-
background: var(--color-red-06);
|
|
163
158
|
}
|
|
164
159
|
.tab-item.hp-gray::before {
|
|
165
160
|
background: linear-gradient(180deg, #617480 0%, #819099 100%);
|
|
@@ -170,7 +165,6 @@ ptc-link, ptc-square-card,
|
|
|
170
165
|
.tab-item.hp-gray.active::after {
|
|
171
166
|
border-style: solid;
|
|
172
167
|
border-top-color: var(--color-gray-06);
|
|
173
|
-
background: var(--color-gray-06);
|
|
174
168
|
}
|
|
175
169
|
.tab-item.hp-orange::before {
|
|
176
170
|
background: linear-gradient(180deg, #C37729 0%, #CF9254 100%);
|
|
@@ -181,5 +175,4 @@ ptc-link, ptc-square-card,
|
|
|
181
175
|
.tab-item.hp-orange.active::after {
|
|
182
176
|
border-style: solid;
|
|
183
177
|
border-top-color: var(--color-orange-06);
|
|
184
|
-
background: var(--color-orange-06);
|
|
185
178
|
}
|
|
@@ -17,7 +17,7 @@ export class HomepageClickableTab {
|
|
|
17
17
|
this.isHovered = false;
|
|
18
18
|
}
|
|
19
19
|
render() {
|
|
20
|
-
return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { class: { 'tab-item': true, 'active': this.active, [this.activeColor]: true }, onClick: () => this.handleClick(), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("span",
|
|
20
|
+
return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { class: { 'tab-item': true, 'active': this.active, [this.activeColor]: true }, onClick: () => this.handleClick(), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), tabindex: "0" }, h("span", { class: "hyphenate-text" }, this.label))));
|
|
21
21
|
}
|
|
22
22
|
static get is() { return "homepage-clickable-tab"; }
|
|
23
23
|
static get encapsulation() { return "shadow"; }
|
|
@@ -64,15 +64,15 @@ ptc-link, ptc-square-card,
|
|
|
64
64
|
.menu-list {
|
|
65
65
|
list-style: none;
|
|
66
66
|
margin: 0;
|
|
67
|
-
padding:
|
|
67
|
+
padding: var(--ptc-element-spacing-03) 0;
|
|
68
68
|
display: none;
|
|
69
69
|
flex-direction: column;
|
|
70
70
|
background-color: white;
|
|
71
|
-
width:
|
|
71
|
+
width: 250px;
|
|
72
72
|
position: absolute;
|
|
73
73
|
top: 40px;
|
|
74
74
|
left: 0;
|
|
75
|
-
margin-top: var(--ptc-element-spacing-
|
|
75
|
+
margin-top: var(--ptc-element-spacing-04);
|
|
76
76
|
box-shadow: var(--ptc-shadow-x-small);
|
|
77
77
|
border-radius: var(--ptc-border-radius-standard);
|
|
78
78
|
}
|
|
@@ -85,6 +85,9 @@ ptc-link, ptc-square-card,
|
|
|
85
85
|
.menu-list .active button {
|
|
86
86
|
font-weight: var(--ptc-font-weight-bold);
|
|
87
87
|
}
|
|
88
|
+
.menu-list .active button::after {
|
|
89
|
+
opacity: 1;
|
|
90
|
+
}
|
|
88
91
|
.menu-list button {
|
|
89
92
|
color: var(--color-gray-10);
|
|
90
93
|
font-size: var(--ptc-font-size-x-small);
|
|
@@ -97,7 +100,8 @@ ptc-link, ptc-square-card,
|
|
|
97
100
|
position: relative;
|
|
98
101
|
text-align: left;
|
|
99
102
|
width: 100%;
|
|
100
|
-
padding:
|
|
103
|
+
padding: var(--ptc-element-spacing-03) var(--ptc-element-spacing-06);
|
|
104
|
+
font-family: var(--ptc-font-latin);
|
|
101
105
|
}
|
|
102
106
|
.menu-list button::after {
|
|
103
107
|
content: "";
|
|
@@ -105,16 +109,14 @@ ptc-link, ptc-square-card,
|
|
|
105
109
|
width: 2px;
|
|
106
110
|
height: 24px;
|
|
107
111
|
background: var(--color-green-07);
|
|
108
|
-
transition:
|
|
109
|
-
|
|
110
|
-
transform-origin: left;
|
|
112
|
+
transition: opacity var(--ptc-transition-medium) var(--ptc-ease-inout);
|
|
113
|
+
opacity: 0;
|
|
111
114
|
position: absolute;
|
|
112
115
|
top: 25%;
|
|
113
116
|
left: 10px;
|
|
114
117
|
}
|
|
115
118
|
.menu-list button:hover::after, .menu-list button:focus::after {
|
|
116
|
-
|
|
117
|
-
font-weight: var(--ptc-font-weight-bold);
|
|
119
|
+
opacity: 1;
|
|
118
120
|
}
|
|
119
121
|
|
|
120
122
|
.mobile-menu-icon {
|
|
@@ -40,7 +40,7 @@ export class PtcBackgroundVideo {
|
|
|
40
40
|
}
|
|
41
41
|
render() {
|
|
42
42
|
const videoContent = this.isIframe ? (h("div", { class: "iframe-wrapper" }, h("iframe", { id: "jumbotron-iframe", src: this.videoSrc, frameborder: 0, allow: "autoplay", allowFullScreen: true, class: "background-video-embed" }))) : (h("video", { src: this.videoSrc, poster: this.posterSrc, autoplay: true, loop: true, muted: true, playsinline: true }));
|
|
43
|
-
return (h(Host, { class: this.type }, videoContent, !!this.videoSrc && this.playButtonTitle && (h("div", { class: `play-button ${this.buttonLocation}` }, this.paused && (h("ptc-tooltip", { class: "play-btn", mode: "wrapper", description: this.playButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important;}" }, h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), styles: "button.icon-toggle { padding :0px 8px; }", "aria-label": "Video Play button" }, h("icon-asset", { name: "play", size: "small", type: "ptc", color: "black" })))), !this.paused && !!this.pauseButtonTitle && (h("ptc-tooltip", { class: "pause-btn", mode: "wrapper", description: this.pauseButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important;}" }, h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), "aria-label": "Video Pause button" }, h("icon-asset", { name: "pause", size: "small", type: "ptc", color: "black" })))))), this.overlay ? h("div", { class: `video-overlay ${this.overlayType}` }) : '', this.type == 'default' ? h("slot", null) : ''));
|
|
43
|
+
return (h(Host, { class: this.type }, videoContent, !!this.videoSrc && this.playButtonTitle && (h("div", { class: `play-button ${this.buttonLocation}` }, this.paused && (h("ptc-tooltip", { class: "play-btn", mode: "wrapper", description: this.playButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important; white-space: nowrap}" }, h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), styles: "button.icon-toggle { padding :0px 8px; }", "aria-label": "Video Play button" }, h("icon-asset", { name: "play", size: "small", type: "ptc", color: "black" })))), !this.paused && !!this.pauseButtonTitle && (h("ptc-tooltip", { class: "pause-btn", mode: "wrapper", description: this.pauseButtonTitle, position: "bottom-right", styles: ".wrapper-content.sc-ptc-tooltip .tooltip.sc-ptc-tooltip{min-width:unset!important; white-space: nowrap}" }, h("ptc-button", { type: "button", color: "icon-toggle", onClick: e => this.toggleVideoPlay(e), "aria-label": "Video Pause button" }, h("icon-asset", { name: "pause", size: "small", type: "ptc", color: "black" })))))), this.overlay ? h("div", { class: `video-overlay ${this.overlayType}` }) : '', this.type == 'default' ? h("slot", null) : ''));
|
|
44
44
|
}
|
|
45
45
|
toggleVideoPlay(e) {
|
|
46
46
|
e.preventDefault();
|
|
@@ -8,9 +8,28 @@ export class PtcInfoTile {
|
|
|
8
8
|
handleClick() {
|
|
9
9
|
this.tileClick.emit();
|
|
10
10
|
}
|
|
11
|
+
handleKeyPress(event) {
|
|
12
|
+
if (event.key === 'Enter') {
|
|
13
|
+
if (this.link) {
|
|
14
|
+
const linkElement = this.el.shadowRoot.querySelector('a.link-press');
|
|
15
|
+
if (linkElement) {
|
|
16
|
+
linkElement.click();
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
else {
|
|
20
|
+
this.handleClick();
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
componentDidLoad() {
|
|
25
|
+
this.el.addEventListener('keydown', this.handleKeyPress.bind(this));
|
|
26
|
+
}
|
|
27
|
+
disconnectedCallback() {
|
|
28
|
+
this.el.removeEventListener('keydown', this.handleKeyPress.bind(this));
|
|
29
|
+
}
|
|
11
30
|
render() {
|
|
12
31
|
const content = (h("div", { class: "tile-content" }, h("span", { class: "tile-title-span" }, h("slot", { name: "tile-title" })), h("div", { class: "tile-title-desc" }, h("slot", { name: "tile-description" }))));
|
|
13
|
-
return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { class: `tile ${this.variant}`, onClick: () => this.handleClick() }, this.variant === 'image' && (h("div", { class: "tile-image" }, h("slot", { name: "tile-image" }))), content, this.link && h("a", { href: this.link, class: "link-overlay" }))));
|
|
32
|
+
return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { class: `tile ${this.variant}`, onClick: () => this.handleClick() }, this.variant === 'image' && (h("div", { class: "tile-image" }, h("slot", { name: "tile-image" }))), content, this.link && h("a", { href: this.link, class: "link-overlay link-press", tabindex: "-1" }))));
|
|
14
33
|
}
|
|
15
34
|
static get is() { return "ptc-info-tile"; }
|
|
16
35
|
static get encapsulation() { return "shadow"; }
|
|
@@ -97,4 +116,5 @@ export class PtcInfoTile {
|
|
|
97
116
|
}
|
|
98
117
|
}];
|
|
99
118
|
}
|
|
119
|
+
static get elementRef() { return "el"; }
|
|
100
120
|
}
|
|
@@ -1246,11 +1246,6 @@ a.disabled {
|
|
|
1246
1246
|
.hp-adjustments {
|
|
1247
1247
|
background-color: var(--color-black);
|
|
1248
1248
|
}
|
|
1249
|
-
@media screen and (min-height: 600px) {
|
|
1250
|
-
.hp-adjustments {
|
|
1251
|
-
height: 90vh;
|
|
1252
|
-
}
|
|
1253
|
-
}
|
|
1254
1249
|
.hp-adjustments .div1 {
|
|
1255
1250
|
grid-area: 1/1/3/2;
|
|
1256
1251
|
min-height: 300px;
|
|
@@ -1283,6 +1278,11 @@ a.disabled {
|
|
|
1283
1278
|
opacity: 0;
|
|
1284
1279
|
}
|
|
1285
1280
|
|
|
1281
|
+
@media screen and (min-width: 992.01px) {
|
|
1282
|
+
.hp-adjustments {
|
|
1283
|
+
height: 90vh;
|
|
1284
|
+
}
|
|
1285
|
+
}
|
|
1286
1286
|
.div1 {
|
|
1287
1287
|
grid-area: 1/1/2/2;
|
|
1288
1288
|
min-height: 300px;
|
|
@@ -1350,6 +1350,8 @@ a.disabled {
|
|
|
1350
1350
|
.content-layout.hp-container {
|
|
1351
1351
|
max-width: 720px;
|
|
1352
1352
|
margin-left: unset;
|
|
1353
|
+
margin-top: 160px;
|
|
1354
|
+
margin-bottom: 160px;
|
|
1353
1355
|
}
|
|
1354
1356
|
}
|
|
1355
1357
|
@media only screen and (min-width: 1200px) {
|