@postnord/pn-marketweb-components 4.0.4 → 4.0.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.
@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-b02670c2.js');
6
6
 
7
- const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#f06365}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
7
+ const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#8eddf9}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
8
8
  const PnQuickCtaStyle0 = pnQuickCtaCss;
9
9
 
10
10
  const PnQuickCta = class {
@@ -1 +1 @@
1
- {"file":"pn-quick-cta.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,irDAAirD,CAAC;AACxsD,yBAAe,aAAa;;MCKf,UAAU;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAIA,iEAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7EA,gEAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3DA,mEAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $coral400;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-quick-cta.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,irDAAirD,CAAC;AACxsD,yBAAe,aAAa;;MCKf,UAAU;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAIA,iEAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7EA,gEAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3DA,mEAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $blue200;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
5
5
  const index = require('./index-b02670c2.js');
6
6
  const HeadingTag = require('./HeadingTag-19376e1f.js');
7
7
 
8
- const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#f06365}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
8
+ const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#8eddf9}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
9
9
  const PnTeaserCardStyle0 = pnTeaserCardCss;
10
10
 
11
11
  const PnTeaserCard = class {
@@ -1 +1 @@
1
- {"file":"pn-teaser-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,u3TAAu3T,CAAC;AACh5T,2BAAe,eAAe;;MCMjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;4BACG,IAAI;6BACa,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;IAED,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACEA,QAACC,UAAI,uDACHD,mEAAM,IAAI,EAAC,yBAAyB,GAAG,EACvCA,kEAAK,KAAK,EAAC,2BAA2B,IACpCA,kEAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJA,mEAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACNA,kEAAK,KAAK,EAAC,oCAAoC,IAC7CA,kEAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAIA,mEAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACpH,IAAI,CAAC,OAAO,IAAIA,QAACE,qBAAU,qDAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,8DAA8D,IACzH,IAAI,CAAC,OAAO,CACF,EACfF,gEAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrBA,kEAAK,KAAK,EAAC,yCAAyC,IAClDA,mEAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;","names":["h","Host","HeadingTag"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-teaser-card.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,u3TAAu3T,CAAC;AACh5T,2BAAe,eAAe;;MCMjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;4BACG,IAAI;6BACa,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;IAED,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACEA,QAACC,UAAI,uDACHD,mEAAM,IAAI,EAAC,yBAAyB,GAAG,EACvCA,kEAAK,KAAK,EAAC,2BAA2B,IACpCA,kEAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJA,mEAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACNA,kEAAK,KAAK,EAAC,oCAAoC,IAC7CA,kEAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAIA,mEAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACpH,IAAI,CAAC,OAAO,IAAIA,QAACE,qBAAU,qDAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,8DAA8D,IACzH,IAAI,CAAC,OAAO,CACF,EACfF,gEAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrBA,kEAAK,KAAK,EAAC,yCAAyC,IAClDA,mEAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;","names":["h","Host","HeadingTag"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $blue200;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -158,7 +158,7 @@ pn-teaser-card[data-card-color=blue900] > .pn-teaser-card__container {
158
158
  background-color: #0d234b;
159
159
  }
160
160
  pn-teaser-card[data-card-color=blue900] > .pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading {
161
- color: #f06365;
161
+ color: #8eddf9;
162
162
  }
163
163
  pn-teaser-card[data-card-color=blue900] > .pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,
164
164
  pn-teaser-card[data-card-color=blue900] > .pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,
@@ -37,7 +37,7 @@ const TemplateOneThird = ({ cards, ...args }) => {
37
37
  </pn-teaser-card>
38
38
  </div>
39
39
  <div class="onethirdwidth" style="width:33%; padding:16px 0;">
40
- <pn-teaser-card heading="${cards[2].heading}" heading-level="${cards[2].headingLevel}" text="${cards[2].text}" data-card-color="coral" class=" teaser-card--hover-effect">
40
+ <pn-teaser-card heading="${cards[2].heading}" heading-level="${cards[2].headingLevel}" text="${cards[2].text}" data-card-color="blue900" class=" teaser-card--hover-effect">
41
41
  <div slot="illustration">
42
42
  <picture>
43
43
  <img src="https://www.postnord.se/siteassets/1.-skicka/inspecting-containers-in-a-shipping-terminal-1.jpg" />
@@ -72,7 +72,7 @@ pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover {
72
72
  }
73
73
 
74
74
  pn-spotlight[data-cta-color=business] .quick-cta__content__heading {
75
- color: #f06365;
75
+ color: #8eddf9;
76
76
  }
77
77
  pn-spotlight[data-cta-color=business] .quick-cta__content__preamble {
78
78
  color: #effbff;
@@ -1,6 +1,6 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
2
 
3
- const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#f06365}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
3
+ const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#8eddf9}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
4
4
  const PnQuickCtaStyle0 = pnQuickCtaCss;
5
5
 
6
6
  const PnQuickCta$1 = /*@__PURE__*/ proxyCustomElement(class PnQuickCta extends HTMLElement {
@@ -1 +1 @@
1
- {"file":"pn-quick-cta.js","mappings":";;AAAA,MAAM,aAAa,GAAG,irDAAirD,CAAC;AACxsD,yBAAe,aAAa;;MCKfA,YAAU;;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAI,2DAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7E,0DAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3D,6DAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PnQuickCta"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $coral400;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-quick-cta.js","mappings":";;AAAA,MAAM,aAAa,GAAG,irDAAirD,CAAC;AACxsD,yBAAe,aAAa;;MCKfA,YAAU;;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAI,2DAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7E,0DAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3D,6DAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PnQuickCta"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $blue200;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1,7 +1,7 @@
1
1
  import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
2
2
  import { H as HeadingTag } from './HeadingTag.js';
3
3
 
4
- const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#f06365}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
4
+ const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#8eddf9}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
5
5
  const PnTeaserCardStyle0 = pnTeaserCardCss;
6
6
 
7
7
  const PnTeaserCard$1 = /*@__PURE__*/ proxyCustomElement(class PnTeaserCard extends HTMLElement {
@@ -1 +1 @@
1
- {"file":"pn-teaser-card.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,u3TAAu3T,CAAC;AACh5T,2BAAe,eAAe;;MCMjBA,cAAY;;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;4BACG,IAAI;6BACa,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;IAED,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACpH,IAAI,CAAC,OAAO,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,8DAA8D,IACzH,IAAI,CAAC,OAAO,CACF,EACf,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PnTeaserCard"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-teaser-card.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,u3TAAu3T,CAAC;AACh5T,2BAAe,eAAe;;MCMjBA,cAAY;;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;4BACG,IAAI;6BACa,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;IAED,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACpH,IAAI,CAAC,OAAO,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,8DAA8D,IACzH,IAAI,CAAC,OAAO,CACF,EACf,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["PnTeaserCard"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $blue200;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1,6 +1,6 @@
1
1
  import { r as registerInstance, g as getElement, h, d as Host } from './index-c311acd6.js';
2
2
 
3
- const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#f06365}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
3
+ const pnQuickCtaCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#8eddf9}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";
4
4
  const PnQuickCtaStyle0 = pnQuickCtaCss;
5
5
 
6
6
  const PnQuickCta = class {
@@ -1 +1 @@
1
- {"file":"pn-quick-cta.entry.js","mappings":";;AAAA,MAAM,aAAa,GAAG,irDAAirD,CAAC;AACxsD,yBAAe,aAAa;;MCKf,UAAU;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAI,2DAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7E,0DAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3D,6DAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;","names":[],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $coral400;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-quick-cta.entry.js","mappings":";;AAAA,MAAM,aAAa,GAAG,irDAAirD,CAAC;AACxsD,yBAAe,aAAa;;MCKf,UAAU;;;uBAEK,IAAI;wBACH,IAAI;;;IAE/B,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAC,oBAAoB,IAC3B,IAAI,CAAC,OAAO,IAAI,2DAAI,KAAK,EAAC,6BAA6B,IAAE,IAAI,CAAC,OAAO,CAAM,EAC7E,0DAAG,KAAK,EAAC,8BAA8B,IAAE,IAAI,CAAC,QAAQ,CAAK,EAC3D,6DAAM,IAAI,EAAC,eAAe,GAAQ,CAC9B,CACD,EACP;KACH;;;;;;","names":[],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $blue200;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
@@ -1,7 +1,7 @@
1
1
  import { r as registerInstance, g as getElement, h, d as Host } from './index-c311acd6.js';
2
2
  import { H as HeadingTag } from './HeadingTag-e20016ab.js';
3
3
 
4
- const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#f06365}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
4
+ const pnTeaserCardCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#8eddf9}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";
5
5
  const PnTeaserCardStyle0 = pnTeaserCardCss;
6
6
 
7
7
  const PnTeaserCard = class {
@@ -1 +1 @@
1
- {"file":"pn-teaser-card.entry.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,u3TAAu3T,CAAC;AACh5T,2BAAe,eAAe;;MCMjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;4BACG,IAAI;6BACa,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;IAED,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACpH,IAAI,CAAC,OAAO,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,8DAA8D,IACzH,IAAI,CAAC,OAAO,CACF,EACf,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;","names":[],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1
+ {"file":"pn-teaser-card.entry.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,u3TAAu3T,CAAC;AACh5T,2BAAe,eAAe;;MCMjB,YAAY;;;oBAGA,IAAI;uBACD,IAAI;qBACL,IAAI;4BACG,IAAI;6BACa,OAAO;iCACH,MAAM;iCAErB,KAAK;mCACH,IAAI;;;IAE5C,iBAAiB;QACf,IAAI,CAAC,iBAAiB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;QAC1E,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,uBAAuB,CAAC,CAAC;KACtF;IAED,MAAM;QACJ,MAAM,eAAe,GAAG,IAAI,CAAC,KAAK,EAAE,WAAW,EAAE,CAAC;QAElD,QACE,EAAC,IAAI,uDACH,6DAAM,IAAI,EAAC,yBAAyB,GAAG,EACvC,4DAAK,KAAK,EAAC,2BAA2B,IACpC,4DAAK,KAAK,EAAE,+CAA+C,CAAC,IAAI,CAAC,mBAAmB,GAAG,uDAAuD,GAAG,EAAE,EAAE,IACnJ,6DAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN,4DAAK,KAAK,EAAC,oCAAoC,IAC7C,4DAAK,KAAK,EAAC,qDAAqD,IAC7D,eAAe,IAAI,6DAAM,KAAK,EAAC,4DAA4D,IAAE,eAAe,CAAQ,EACpH,IAAI,CAAC,OAAO,IAAI,EAAC,UAAU,qDAAC,KAAK,EAAE,IAAI,CAAC,YAAY,EAAE,QAAQ,EAAC,8DAA8D,IACzH,IAAI,CAAC,OAAO,CACF,EACf,0DAAG,KAAK,EAAC,+DAA+D,IAAE,IAAI,CAAC,IAAI,CAAK,CACpF,EACL,IAAI,CAAC,iBAAiB,KACrB,4DAAK,KAAK,EAAC,yCAAyC,IAClD,6DAAM,IAAI,EAAC,KAAK,GAAG,CACf,CACP,CACG,CACF,CACD,EACP;KACH;;;;;;","names":[],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $blue200;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@postnord/pn-marketweb-components",
3
- "version": "4.0.4",
3
+ "version": "4.0.5",
4
4
  "description": "PostNord Market Websites Components",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -1,2 +1,2 @@
1
- import{r as t,g as c,h as e,d as n}from"./p-82546a44.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#f06365}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";const i=a;const o=class{constructor(c){t(this,c);this.heading=null;this.preamble=null}get hostElement(){return c(this)}render(){return e(n,{key:"ab5954c7894705ca1d6faeb541b63ef9a28ce39e"},e("div",{key:"2fe82eb368e7c6f13a1e541e54f4f2679b99ed20",class:"quick-cta__content"},this.heading&&e("h2",{key:"7f766e4fb92eaa1e9ecc5ae90ec850dd80348585",class:"quick-cta__content__heading"},this.heading),e("p",{key:"1ac42d8d5d8c4995d5122b1f1fa68b42915b18b9",class:"quick-cta__content__preamble"},this.preamble),e("slot",{key:"85be5b2684e761d02886325cd7b3b55a01dbacb4",name:"quick-cta-cta"})))}};o.style=i;export{o as pn_quick_cta};
2
- //# sourceMappingURL=p-e8622338.entry.js.map
1
+ import{r as t,g as c,h as e,d as n}from"./p-82546a44.js";const a="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-quick-cta{width:100%}pn-quick-cta .quick-cta__content{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;gap:2.4rem;width:100%}pn-quick-cta .quick-cta__content .quick-cta__content__heading{padding:0;margin:0;font-size:2.4rem;font-weight:500;color:#0d234b}@media screen and (max-width: 768px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{display:none}}@media screen and (min-width: 1640px){pn-quick-cta .quick-cta__content .quick-cta__content__heading{font-size:2.8rem;font-weight:700}}pn-quick-cta .quick-cta__content .quick-cta__content__preamble{font-weight:400;font-size:1.6rem;line-height:140%;padding:0;margin:0;color:#2d2013}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a{white-space:nowrap}pn-quick-cta .quick-cta__content [slot=quick-cta-cta] a:hover{text-decoration:none}pn-spotlight[data-cta-color=business] .quick-cta__content__heading{color:#8eddf9}pn-spotlight[data-cta-color=business] .quick-cta__content__preamble{color:#effbff}pn-spotlight[data-cta-color=private] .quick-cta__content__heading,pn-spotlight[data-cta-color=private] .quick-cta__content__preamble{color:#ffffff}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__heading{color:#005d92}pn-spotlight[data-cta-color=hybrid] .quick-cta__content__preamble{color:#2d2013}";const i=a;const o=class{constructor(c){t(this,c);this.heading=null;this.preamble=null}get hostElement(){return c(this)}render(){return e(n,{key:"ab5954c7894705ca1d6faeb541b63ef9a28ce39e"},e("div",{key:"2fe82eb368e7c6f13a1e541e54f4f2679b99ed20",class:"quick-cta__content"},this.heading&&e("h2",{key:"7f766e4fb92eaa1e9ecc5ae90ec850dd80348585",class:"quick-cta__content__heading"},this.heading),e("p",{key:"1ac42d8d5d8c4995d5122b1f1fa68b42915b18b9",class:"quick-cta__content__preamble"},this.preamble),e("slot",{key:"85be5b2684e761d02886325cd7b3b55a01dbacb4",name:"quick-cta-cta"})))}};o.style=i;export{o as pn_quick_cta};
2
+ //# sourceMappingURL=p-59bf4b98.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pnQuickCtaCss","PnQuickCtaStyle0","PnQuickCta","render","h","Host","key","class","this","heading","preamble","name"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $blue200;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,krDACtB,MAAAC,EAAeD,E,MCKFE,EAAU,M,sCAEK,K,cACC,I,kCAE3B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACPC,KAAKC,SAAWL,EAAA,MAAAE,IAAA,2CAAIC,MAAM,+BAA+BC,KAAKC,SAChEL,EAAA,KAAAE,IAAA,2CAAGC,MAAM,gCAAgCC,KAAKE,UAC9CN,EAAA,QAAAE,IAAA,2CAAMK,KAAK,mB","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{r as e,g as a,h as t,d as n}from"./p-82546a44.js";import{H as r}from"./p-0b920554.js";const c="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#f06365}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";const o=c;const i=class{constructor(a){e(this,a);this.text=null;this.heading=null;this.label=null;this.headingLevel="h3";this.dataCardColor="coral";this.dataCardAlignment="left";this.hasCtaSlotContent=false;this.hasIllustrationSlot=true}get hostElement(){return a(this)}componentWillLoad(){this.hasCtaSlotContent=!!this.hostElement.querySelector('[slot="cta"]');this.hasIllustrationSlot=!!this.hostElement.querySelector('[slot="illustration"]')}render(){const e=this.label?.toUpperCase();return t(n,{key:"b5ee6a71383c676dff65be68bd2c583af8d4b73e"},t("slot",{key:"26f672cccdf0b4a647608dec90d9da91d5326f2e",name:"clickable-block-wrapper"}),t("div",{key:"664a86e96d02078ad7d3b9feec848620b08a64e7",class:"pn-teaser-card__container"},t("div",{key:"b2690687573bc1421b4087b25574aac4e1bf210e",class:`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot?"pn-teaser-card__container__image__container--no-image":""}`},t("slot",{key:"92c205f97f90b35df8f34f6905ebb5f858ba3115",name:"illustration"})),t("div",{key:"f9b96157ea921c801f993133b0b4e7d785224a3b",class:"pn-teaser-card__container__content"},t("div",{key:"150b6993e403a65c3d75794554b39a2c4c073099",class:"pn-teaser-card__container__content__text__container"},e&&t("span",{key:"20973e8c988b6f3c5bed312ad6f5e339f22565f4",class:"pn-teaser-card__container__content__text__container__label"},e),this.heading&&t(r,{key:"64cdb89e6106839ef6bd7d6a6912c69bad4e1d85",level:this.headingLevel,cssClass:"pn-teaser-card__container__content__text__container__heading"},this.heading),t("p",{key:"7366108ac28438903a71cb89e6a4d70d3e5ef96a",class:"pn-teaser-card__container__content__text__container__preamble"},this.text)),this.hasCtaSlotContent&&t("div",{key:"dcee0ddb4c36f90e321db3c8817b444794851b93",class:"pn-teaser-card__container__content__cta"},t("slot",{key:"1aedb8f19e547e163676b76b502a155603c0b3ce",name:"cta"})))))}};i.style=o;export{i as pn_teaser_card};
2
- //# sourceMappingURL=p-cda742ba.entry.js.map
1
+ import{r as e,g as a,h as t,d as n}from"./p-82546a44.js";import{H as r}from"./p-0b920554.js";const c="pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}.block.teasercardblock a[data-block-clickable-link=true]{z-index:1}pn-teaser-card{width:100%;height:100%;display:flex}pn-teaser-card .pn-teaser-card__container{display:flex;flex-direction:column;justify-content:flex-start;border-radius:2.4rem;width:100%}pn-teaser-card .pn-teaser-card__container__image__container{width:100%;position:relative}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{clip-path:ellipse(100% 90% at 50% 0%);height:100%;overflow:hidden;border-top-left-radius:2.4rem;border-top-right-radius:2.4rem}pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{width:100%;height:auto;transition:0.4s ease-in-out;transform:scale(1);aspect-ratio:16/9;object-fit:cover;object-position:50% 0}pn-teaser-card .pn-teaser-card__container__content{display:flex;flex-direction:column;justify-content:space-between;flex:1 1 100%;gap:3.2rem;padding:2.4rem 2.4rem;padding-top:0}pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:2.4rem;line-height:2.64rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{padding-top:1.6rem;font-weight:400;font-size:1.6rem;line-height:2.24rem;margin-bottom:0}pn-teaser-card .pn-teaser-card__container__content__text__container__label{display:block;margin-bottom:1.6rem;font-weight:400;font-size:1.2rem;line-height:140%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{align-self:flex-end;width:100%}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button a:hover{text-decoration:none}pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>button>.pn-button-bg,pn-teaser-card .pn-teaser-card__container__content__cta>pn-button>a>.pn-button-bg{transition:0.4s ease-in-out}@media screen and (min-width: 768px){pn-teaser-card .pn-teaser-card__container__content__cta>pn-button{width:fit-content}}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500;font-size:1.6rem;text-decoration:none;color:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg{transition:0.3s ease-in-out;position:relative;left:-0.3rem}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated pn-icon svg path{fill:#005d92}pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated[target=_blank]:not(.pn-button):after{display:none}pn-teaser-card[data-card-color=coral]>.pn-teaser-card__container{background-color:#fdefee}pn-teaser-card[data-card-color=green]>.pn-teaser-card__container{background-color:#dcf6e7}pn-teaser-card[data-card-color=blue]>.pn-teaser-card__container{background-color:#effbff}pn-teaser-card[data-card-color=blue50]>.pn-teaser-card__container{background-color:#e0f8ff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container{background-color:#00a0d6}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue400]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container{background-color:#0d234b}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__heading{color:#8eddf9}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__label,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__text__container__preamble,pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .pn-teaser-card__container__content__cta .secondary-link--animated{color:#ffffff}pn-teaser-card[data-card-color=blue900]>.pn-teaser-card__container .secondary-link--animated>pn-icon>svg>path{fill:#ffffff}pn-teaser-card[data-card-color=white]>.pn-teaser-card__container{background-color:#ffffff}.teasercardlistblock .teasercardblock.has-bg{background-color:transparent;background:transparent}@media screen and (min-width: 1200px){.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__text__container__label{margin-bottom:0.8rem}}.onethirdwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image,.onequarterwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}.onethirdwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated,.onequarterwidth:not(.familywrapperblock) .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:2.4rem}@media screen and (min-width: 992px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}}@media screen and (min-width: 1200px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 4rem 4rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:3.2rem;line-height:3.52rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-weight:400;font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 1640px){.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{padding-top:5.6rem}.halfwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:0 5.6rem 5.6rem}}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:400}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container--no-image{width:auto;padding-top:2.4rem}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:35rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__cta .secondary-link--animated{font-weight:500}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container{flex-direction:row}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{align-self:center;gap:2.4rem;padding:3.2rem 3.2rem 3.2rem 2.4rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]{border-top-left-radius:2.4rem;border-bottom-left-radius:2.4rem;clip-path:ellipse(100% 100% at 0% 50%)}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__image__container>[slot=illustration]>picture>img{height:100%;object-fit:cover}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card{min-height:52rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content{padding:4rem 4rem 4rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__heading{font-weight:700;font-size:4.8rem;line-height:5.28rem}.fullwidth:not(.familywrapperblock) pn-teaser-card .pn-teaser-card__container__content__text__container__preamble{font-size:2rem;line-height:2.8rem}}@media screen and (min-width: 768px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container{flex-direction:row-reverse}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:3.2rem 2.4rem 3.2rem 3.2rem}.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__image__container>[slot=illustration]{border-bottom-right-radius:2.4rem;clip-path:ellipse(100% 100% at 100% 50%)}}@media screen and (min-width: 1200px){.fullwidth:not(.familywrapperblock) pn-teaser-card[data-card-alignment=right] .pn-teaser-card__container__content{padding:4rem 3.2rem 4rem 4rem}}pn-teaser-card.teaser-card--hover-effect:hover{cursor:pointer}pn-teaser-card.teaser-card--hover-effect:hover .pn-teaser-card__container__image__container [slot=illustration] picture>img{transform:scale(1.02);filter:brightness(0.85)}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated{text-decoration:underline}pn-teaser-card.teaser-card--hover-effect:hover .secondary-link--animated pn-icon svg{left:0}pn-teaser-card.teaser-card--hover-effect:hover pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover pn-button a .pn-button-bg{background-color:#0d234b}pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button button .pn-button-bg,pn-teaser-card.teaser-card--hover-effect:hover[data-card-color=blue900] pn-button a .pn-button-bg{background-color:#00a0d6}";const o=c;const i=class{constructor(a){e(this,a);this.text=null;this.heading=null;this.label=null;this.headingLevel="h3";this.dataCardColor="coral";this.dataCardAlignment="left";this.hasCtaSlotContent=false;this.hasIllustrationSlot=true}get hostElement(){return a(this)}componentWillLoad(){this.hasCtaSlotContent=!!this.hostElement.querySelector('[slot="cta"]');this.hasIllustrationSlot=!!this.hostElement.querySelector('[slot="illustration"]')}render(){const e=this.label?.toUpperCase();return t(n,{key:"b5ee6a71383c676dff65be68bd2c583af8d4b73e"},t("slot",{key:"26f672cccdf0b4a647608dec90d9da91d5326f2e",name:"clickable-block-wrapper"}),t("div",{key:"664a86e96d02078ad7d3b9feec848620b08a64e7",class:"pn-teaser-card__container"},t("div",{key:"b2690687573bc1421b4087b25574aac4e1bf210e",class:`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot?"pn-teaser-card__container__image__container--no-image":""}`},t("slot",{key:"92c205f97f90b35df8f34f6905ebb5f858ba3115",name:"illustration"})),t("div",{key:"f9b96157ea921c801f993133b0b4e7d785224a3b",class:"pn-teaser-card__container__content"},t("div",{key:"150b6993e403a65c3d75794554b39a2c4c073099",class:"pn-teaser-card__container__content__text__container"},e&&t("span",{key:"20973e8c988b6f3c5bed312ad6f5e339f22565f4",class:"pn-teaser-card__container__content__text__container__label"},e),this.heading&&t(r,{key:"64cdb89e6106839ef6bd7d6a6912c69bad4e1d85",level:this.headingLevel,cssClass:"pn-teaser-card__container__content__text__container__heading"},this.heading),t("p",{key:"7366108ac28438903a71cb89e6a4d70d3e5ef96a",class:"pn-teaser-card__container__content__text__container__preamble"},this.text)),this.hasCtaSlotContent&&t("div",{key:"dcee0ddb4c36f90e321db3c8817b444794851b93",class:"pn-teaser-card__container__content__cta"},t("slot",{key:"1aedb8f19e547e163676b76b502a155603c0b3ce",name:"cta"})))))}};i.style=o;export{i as pn_teaser_card};
2
+ //# sourceMappingURL=p-bfd604f2.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["pnTeaserCardCss","PnTeaserCardStyle0","PnTeaserCard","componentWillLoad","this","hasCtaSlotContent","hostElement","querySelector","hasIllustrationSlot","render","labelToCapitals","label","toUpperCase","h","Host","key","name","class","heading","HeadingTag","level","headingLevel","cssClass","text"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $blue200;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"6FAAA,MAAMA,EAAkB,w3TACxB,MAAAC,EAAeD,E,MCMFE,EAAY,M,mCAGA,K,aACG,K,WACD,K,kBACO,K,mBACiB,Q,uBACI,O,uBAEf,M,yBACE,I,kCAExC,iBAAAC,GACEC,KAAKC,oBAAsBD,KAAKE,YAAYC,cAAc,gBAC1DH,KAAKI,sBAAwBJ,KAAKE,YAAYC,cAAc,wB,CAG9D,MAAAE,GACE,MAAMC,EAAkBN,KAAKO,OAAOC,cAEpC,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,2CAAMC,KAAK,4BACXH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,6BACTJ,EAAA,OAAAE,IAAA,2CAAKE,MAAO,gDAAgDb,KAAKI,oBAAsB,wDAA0D,MAC/IK,EAAA,QAAAE,IAAA,2CAAMC,KAAK,kBAEbH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,sCACTJ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,uDACRP,GAAmBG,EAAA,QAAAE,IAAA,2CAAME,MAAM,8DAA8DP,GAC7FN,KAAKc,SAAWL,EAACM,EAAU,CAAAJ,IAAA,2CAACK,MAAOhB,KAAKiB,aAAcC,SAAS,gEAC3DlB,KAAKc,SAEVL,EAAA,KAAAE,IAAA,2CAAGE,MAAM,iEAAiEb,KAAKmB,OAEhFnB,KAAKC,mBACJQ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,2CACTJ,EAAA,QAAAE,IAAA,2CAAMC,KAAK,W","ignoreList":[]}
@@ -1,2 +1,2 @@
1
- import{p as e,H as a,b as t}from"./p-82546a44.js";export{s as setNonce}from"./p-82546a44.js";import{g as n}from"./p-e1255160.js";var o=()=>{{r(a.prototype)}const t=import.meta.url;const n={};if(t!==""){n.resourcesUrl=new URL(".",t).href}return e(n)};var r=e=>{const a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}const t=a.call(this,false);const n=this.childNodes;if(e){for(let e=0;e<n.length;e++){if(n[e].nodeType!==2){t.appendChild(n[e].cloneNode(true))}}}return t}};o().then((async e=>{await n();return t(JSON.parse('[["p-f28d0971",[[4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"siteid":[1],"environment":[1537],"userToken":[1,"user-token"],"userFullname":[1,"user-fullname"],"userLoggedin":[516,"user-loggedin"],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideHomeMenuItem":[1540,"hide-home-menu-item"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"showProfileSelection":[1540,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"siteDomainInUrls":[4,"site-domain-in-urls"],"AutocompleteEndpoint":[1,"autocomplete-endpoint"],"sessionForward":[4,"session-forward"],"cache":[4],"searchPlaceholder":[1,"search-placeholder"],"spaMode":[4,"spa-mode"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"useMarketwebLogin":[4,"use-marketweb-login"],"pageId":[1,"page-id"],"i18n":[32],"gotData":[32],"fetchingData":[32],"homePageLink":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"languageOptions":[32],"loginDialog":[32],"minimizeSearch":[32],"loggedIn":[32]},[[0,"setLanguage","onLanguageSelectorChange"],[0,"loginStateChange","onLoginStateChange"],[9,"resize","handleResize"]],{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-95d32ab4",[[0,"pn-proxio-findprice",{"endpoint":[1025],"language":[1025],"market":[1025],"showMedium":[4,"show-medium"],"showInternational":[4,"show-international"],"maxAbroadKg":[2,"max-abroad-kg"],"weightListName":[1,"weight-list-name"],"cache":[4],"filteredItems":[32],"weight":[32],"weightvalue":[32],"countrycodevalue":[32],"sizecategory":[32],"data":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"],"countrycodevalue":["filterItems"]}]]],["p-a73e4811",[[0,"pn-find-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"weight":[32],"weightvalue":[32],"sourceData":[32],"sizecategory":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"]}]]],["p-c9038b03",[[0,"pn-find-service-and-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"postagetype":[32],"weight":[32],"weightvalue":[32],"deliveryscope":[32],"sourceData":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"deliveryscope":["filterItems"],"weightvalue":["filterItems"]}]]],["p-f5d03222",[[4,"pn-product-pricelist",{"source":[1],"language":[1025],"market":[1025],"productid":[1],"filteredItems":[32],"sourceData":[32],"gotData":[32],"loading":[32],"postagetype":[32],"weight":[32],"weightvalue":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"weightvalue":["filterItems"]}]]],["p-389a94e7",[[0,"pn-proxio-pricegroup",{"endpoint":[1025],"language":[1],"market":[1],"tariffid":[1],"cache":[4],"activeWeightIndex":[32],"data":[32],"i18n":[32]},[[0,"activeWeightIndex","setActiveWeightIndex"],[0,"language","setLanguage"]]]]],["p-659a4db5",[[0,"pn-product-pricelist-result",{"item":[1040],"description":[16],"shownitems":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-0b5a125d",[[4,"pn-marketweb-sitefooter",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"siteDomainInUrls":[4,"site-domain-in-urls"],"cache":[4],"theme":[513],"backgroundcolor":[513],"showSwan":[4,"show-swan"],"headingLevel":[1,"heading-level"],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]},null,{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-eb21f772",[[4,"pn-media-block",{"blockHeight":[1,"block-height"],"imageSrc":[1,"image-src"],"imageSrcSmallScreenFormat":[1,"image-src-small-screen-format"],"imageAltText":[1,"image-alt-text"],"videoSrc":[1,"video-src"],"parallaxScroll":[4,"parallax-scroll"],"showOverlayLayer":[4,"show-overlay-layer"],"customOverlayBackground":[1,"custom-overlay-background"],"animateOverlayBackground":[4,"animate-overlay-background"],"scrollSnapBlock":[4,"scroll-snap-block"],"fixedBackground":[4,"fixed-background"],"blockHeading":[1,"block-heading"],"blockHeadingLevel":[1,"block-heading-level"],"blockPreamble":[1,"block-preamble"],"marginBottom":[4,"margin-bottom"],"pnPlayOnScrollObserverOptions":[32],"calculatedBlockHeight":[32],"hasButtonSlot":[32]}]]],["p-a298a263",[[0,"pn-chat",{"endpoint":[1],"customerSegment":[1,"customer-segment"],"mainHeading":[1,"main-heading"],"relatedContentAriaLabel":[1,"related-content-aria-label"],"chatMinimizedAriaLabel":[1,"chat-minimized-aria-label"],"chatOpenedAriaLabel":[1,"chat-opened-aria-label"],"minimizeChatAriaLabel":[1,"minimize-chat-aria-label"],"closeChatAriaLabel":[1,"close-chat-aria-label"],"openChatAriaLabel":[1,"open-chat-aria-label"],"chatControlsAriaLabel":[1,"chat-controls-aria-label"],"chatMessagesAriaLabel":[1,"chat-messages-aria-label"],"sentMessageAriaLabel":[1,"sent-message-aria-label"],"writeChatMessagePlaceholder":[1,"write-chat-message-placeholder"],"waitingForAnswerLabel":[1,"waiting-for-answer-label"],"sendButtonText":[1,"send-button-text"],"loadingText":[1,"loading-text"],"carouselSlidesToShow":[2,"carousel-slides-to-show"],"messages":[1],"language":[1],"market":[1],"itemId":[1,"item-id"],"pnChatId":[1,"pn-chat-id"],"forceOpen":[4,"force-open"],"isLoggedIn":[4,"is-logged-in"],"message":[32],"messagesData":[32],"isMinimized":[32],"isClosed":[32],"lastMessageId":[32],"i18n":[32]},[[0,"keydown","handleKeyDown"]],{"messages":["handleMessagesChange"],"pnChatId":["handleNewChatId"],"forceOpen":["handleSameChatId"],"isMinimized":["scrollToBottom"]}]]],["p-28d2f7fa",[[0,"pn-level-up",{"heading":[1],"headingLevel":[8,"heading-level"],"preamble":[1],"imageUrl":[1,"image-url"],"imageAltText":[1,"image-alt-text"],"endpoint":[1],"webModalContinueOtherDeviceLabel":[1,"web-modal-continue-other-device-label"],"webModalContinueThisDeviceLabel":[1,"web-modal-continue-this-device-label"],"mobileModalContinueThisDeviceLabel":[1,"mobile-modal-continue-this-device-label"],"mobileModalContinueOtherDeviceLabel":[1,"mobile-modal-continue-other-device-label"],"modalInstructionPhoneLineOne":[1,"modal-instruction-phone-line-one"],"modalInstructionPhoneLineTwo":[1,"modal-instruction-phone-line-two"],"modalInstructionPhoneLineThree":[1,"modal-instruction-phone-line-three"],"modalHeadingText":[1,"modal-heading-text"],"modalOutdatedQRMessage":[1,"modal-outdated-q-r-message"],"modalExpiresInMessage":[1,"modal-expires-in-message"],"qrAriaLabel":[1,"qr-aria-label"],"leveledupMessage":[1,"leveledup-message"],"isLeveledUp":[4,"is-leveled-up"],"isLoading":[32],"isRecentLeveledUp":[32],"errorMessage":[32]}]]],["p-61bd81d7",[[0,"pn-multi-row-connected-dropdown",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFieldLabel":[1,"input-field-label"],"inputFieldPlaceholder":[1,"input-field-placeholder"],"disabledDates":[1,"disabled-dates"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleRows":[4,"allow-multiple-rows"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"minAmount":[2,"min-amount"],"errorMessageEmpty":[1,"error-message-empty"],"errorMessageMinAmount":[1,"error-message-min-amount"],"minWarningAmount":[2,"min-warning-amount"],"warningMessageMinAmount":[1,"warning-message-min-amount"],"rowCount":[32],"rowData":[32],"formValues":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]]]]],["p-d17af75d",[[0,"pn-dropdown-with-multi-input-rows",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"firstDropdownLabel":[1,"first-dropdown-label"],"firstDropdownHelperText":[1,"first-dropdown-helper-text"],"secondDropdownLabel":[1,"second-dropdown-label"],"secondDropdownHelperText":[1,"second-dropdown-helper-text"],"secondDropdownMax":[2,"second-dropdown-max"],"deleteMultipleRowsWarningText":[1,"delete-multiple-rows-warning-text"],"confirmDeleteButtonText":[1,"confirm-delete-button-text"],"abortDeleteButtonText":[1,"abort-delete-button-text"],"firstInputLabel":[1,"first-input-label"],"firstInputPlaceholder":[1,"first-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputLabel":[1,"second-input-label"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"disabledDates":[1,"disabled-dates"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"sumFieldLabel":[1,"sum-field-label"],"addRowText":[1,"add-row-text"],"elementHelperText":[1,"element-helper-text"],"dropdownDataRoot":[32],"secondDropdownArr":[32],"rowData":[32],"formValues":[32],"firstValidDateString":[32],"lastValidDateString":[32],"rowSum":[32],"minRowCount":[32],"showDeleteConfirm":[32],"i18n":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"firstInputChange","predefinedValueChange"],[0,"secondInputChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]],{"languageCode":["setTranslations"]}]]],["p-ad9a7633",[[0,"pn-multiple-input",{"label":[1],"placeholder":[1],"addRowButtonText":[1,"add-row-button-text"],"rowData":[32]}]]],["p-f4b14be8",[[0,"pn-parcel-tracker",{"formActionUrl":[1,"form-action-url"],"heading":[1],"buttonLabel":[1,"button-label"],"locale":[1],"placeholder":[1],"inputName":[1,"input-name"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-41cdac85",[[0,"pn-pex-pricefinder",{"language":[1],"currency":[1],"apiUrl":[1,"api-url"],"i18n":[32],"fromzip":[32],"tozip":[32],"weight":[32],"when":[32],"response":[32]},[[0,"language","setLanguage"]]]]],["p-ce87ff8a",[[0,"pn-share",{"link":[1],"language":[1537],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-08b473e0",[[4,"pn-stats-info",{"heading":[1],"dataArray":[1,"data-array"],"backgroundUrl":[1,"background-url"],"myParsedArray":[32]},null,{"dataArray":["parseMyArrayProp"]}]]],["p-920ce5f2",[[0,"pn-address-autofill",{"market":[1537],"environment":[1537],"endpoint":[1],"cache":[4],"countryCode":[1,"country-code"],"language":[1],"postalCodeProps":[1,"postal-code-props"],"cityProps":[1,"city-props"],"streetAddressProps":[1,"street-address-props"],"streetNumberProps":[1,"street-number-props"],"addressNotFoundError":[1,"address-not-found-error"],"postalCode":[32],"city":[32],"streetAddress":[32],"streetNumber":[32],"validAddress":[32],"translation":[32],"postalCodeRequiredLabel":[32],"streetRequiredLabel":[32],"fullAddress":[32],"isLoading":[32]}]]],["p-7b4f9fdf",[[4,"pn-animated-tile",{"toggled":[32],"transitionClassName":[32],"animateIcon":[32]},null,{"toggled":["onToggledHandler"]}]]],["p-66da6e15",[[0,"pn-app-banner",{"appName":[1,"app-name"],"appDescription":[1,"app-description"],"ctaText":[1,"cta-text"],"appleStoreLink":[1,"apple-store-link"],"googleStoreLink":[1,"google-store-link"],"isClosed":[32],"storeLink":[32],"isLocalStorageAvailable":[32]}]]],["p-7db6ef34",[[4,"pn-bonus-progressbar",{"icon":[1],"heading":[1],"sumtext":[513],"theme":[513],"bonuspercentage":[1],"currency":[513],"value":[1538],"min":[1538],"max":[1538],"valuepercentage":[32],"progresspercentage":[32],"levelValues":[32],"currentLevelAdjustedValue":[32]},null,{"currentLevelAdjustedValue":["setValuePercentage"],"value":["setValuePercentage"],"min":["setValuePercentage"],"max":["setValuePercentage"]}]]],["p-015127bf",[[0,"pn-bonus-progressbar-level",{"current":[516],"value":[1538],"bonuspercentage":[1537],"visualpercentage":[1538],"percentage":[32],"max":[32],"min":[32],"currency":[32]}]]],["p-34a98554",[[0,"pn-breakpoints",{"breakPointClass":[1,"break-point-class"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-f0df7694",[[0,"pn-chart",{"labels":[1],"dataSets":[1,"data-sets"],"dataChartType":[8,"data-chart-type"],"myChartCtxRef":[32]},null,{"dataSets":["dataChangeHandler"],"labels":["labelsChangeHandler"]}]]],["p-230ef9aa",[[4,"pn-charts-card",{"header":[1],"highlight":[1],"preamble":[1],"label":[1],"source":[1],"sourceUrl":[1,"source-url"],"ctaLinkText":[1,"cta-link-text"],"openInNewWindow":[4,"open-in-new-window"]}]]],["p-7b7629c5",[[4,"pn-cta-block",{"heading":[1],"bodyText":[1,"body-text"],"pnBackgroundColor":[1,"pn-background-color"],"isLarge":[4,"is-large"],"isCentered":[4,"is-centered"],"isSmall":[4,"is-small"],"contentTop":[4,"content-top"]}]]],["p-809ed802",[[4,"pn-customernumber-selector",{"language":[1537],"open":[1540],"heading":[1],"description":[1],"i18n":[32]}]]],["p-619f2143",[[4,"pn-customernumber-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-2c19edca",[[0,"pn-date-and-time",{"languageCode":[1,"language-code"],"dateAndTimeLabel":[1,"date-and-time-label"],"dateDaysFromToday":[2,"date-days-from-today"],"validTimeRangeMinutes":[2,"valid-time-range-minutes"],"errorMessage":[1,"error-message"],"dateHelperText":[1,"date-helper-text"],"timeHelperText":[1,"time-helper-text"],"disableWeekends":[4,"disable-weekends"],"disabledDates":[1,"disabled-dates"],"datePlaceholder":[1,"date-placeholder"],"minFromHour":[2,"min-from-hour"],"maxToHour":[2,"max-to-hour"],"language":[32],"hourArr":[32],"minuteArr":[32],"formValue":[32],"invalidTimespan":[32],"selectedDate":[32],"selectedFromHour":[32],"selectedFromMin":[32],"selectedToHour":[32],"selectedToMin":[32],"firstValidDateString":[32],"lastValidDateString":[32]}]]],["p-d75a2f7c",[[4,"pn-dropdown-choice-adds-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"addRowDropdownName":[1,"add-row-dropdown-name"],"addRowDropdownPlaceholder":[1,"add-row-dropdown-placeholder"],"addRowDropdownLabel":[1,"add-row-dropdown-label"],"rowNameLabel":[1,"row-name-label"],"rowHasDropdown":[4,"row-has-dropdown"],"rowDropdownLabel":[1,"row-dropdown-label"],"rowDropdownPlaceholder":[1,"row-dropdown-placeholder"],"rowInputLabel":[1,"row-input-label"],"rowDeleteButtonText":[1,"row-delete-button-text"],"totalInputLimit":[2,"total-input-limit"],"inputLimitWarning":[1,"input-limit-warning"],"inputEmptyWarning":[1,"input-empty-warning"],"dropdownEmptyWarning":[1,"dropdown-empty-warning"],"nextRowIndex":[32],"rowSelectDropdownArr":[32],"formValue":[32]},null,{"dropdownData":["dropdownDataWatcher"]}]]],["p-64851da0",[[4,"pn-hero-block-international",{"heading":[1],"subHeading":[1,"sub-heading"],"preamble":[1],"animateLogo":[4,"animate-logo"],"showSideLoader":[4,"show-side-loader"],"centeredLayout":[4,"centered-layout"]}]]],["p-35847eda",[[0,"pn-line-shape"]]],["p-4f639380",[[4,"pn-link-list",{"heading":[1],"label":[1],"preamble":[1],"url":[1],"showMoreLabel":[1,"show-more-label"],"showMoreUrl":[1,"show-more-url"]}]]],["p-f28059f4",[[0,"pn-marketweb-icon",{"symbol":[1],"small":[4],"color":[1]}]]],["p-51f136f3",[[1,"pn-marketweb-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"list":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4],"suggestionObserver":[32],"hasClonedInput":[32],"listSuggestion":[32]},[[0,"input","inputHandler"]]]]],["p-17c43a96",[[0,"pn-marketweb-siteheader-login-mypage-button",{"label":[1],"myPageUrl":[1,"my-page-url"]}]]],["p-923aa6d2",[[0,"pn-marketweb-table",{"mainHeading":[1,"main-heading"],"mainHeadingLevel":[1,"main-heading-level"],"preamble":[1],"subHeadingLevel":[1,"sub-heading-level"],"headers":[1],"rows":[1],"showHeadersInCells":[4,"show-headers-in-cells"],"cellHeaderLevel":[1,"cell-header-level"],"tableRowCtaActionLabel":[1,"table-row-cta-action-label"],"imageColAriaHeader":[1,"image-col-aria-header"],"ctaColAriaHeader":[1,"cta-col-aria-header"],"checkForNewShipments":[4,"check-for-new-shipments"],"endpoint":[1],"language":[1],"market":[1],"toggleDetailLabel":[1,"toggle-detail-label"],"checkForChat":[4,"check-for-chat"],"value":[1537],"shipmentType":[1,"shipment-type"],"contentId":[1,"content-id"],"takeAmountRow":[2,"take-amount-row"],"shipmentCount":[2,"shipment-count"],"i18n":[32],"_headers":[32],"_rows":[32],"_allKeys":[32],"screenInfo":[32]},null,{"language":["onLanguageChange"]}]]],["p-72f57a04",[[4,"pn-product-tile"]]],["p-c89cb749",[[4,"pn-profile-modal",{"heading":[1],"continueCtaText":[1,"continue-cta-text"],"choosenCompanyText":[1,"choosen-company-text"],"toText":[1,"to-text"],"chooseCustomerNumberText":[1,"choose-customer-number-text"],"isLoading":[32]},[[0,"urlSelected","onUrlSelected"]]]]],["p-9088d3f5",[[4,"pn-profile-modal-customernumber",{"url":[513],"customernumber":[513],"selected":[516]}]]],["p-60b77eed",[[4,"pn-profile-modal-profile",{"heading":[513],"description":[513],"url":[513],"selected":[1028],"showCustomerNumbers":[516,"show-customer-numbers"],"pleaseSelectText":[513,"please-select-text"],"visible":[1540],"identifier":[32]}]]],["p-79e4715c",[[4,"pn-profile-modal-type",{"typeid":[513],"name":[1025],"selected":[1028],"selectedprofile":[1025]},null,{"selected":["onSelectedChange"]}]]],["p-71db6836",[[4,"pn-profile-selector",{"language":[1537],"returnUrl":[1,"return-url"],"heading":[1],"i18n":[32],"isLoading":[32],"numberOfProfiles":[32]}]]],["p-3d10bc37",[[0,"pn-profile-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-e8622338",[[4,"pn-quick-cta",{"heading":[1],"preamble":[1]}]]],["p-763a4e13",[[4,"pn-quote-card",{"quote":[1],"name":[1],"occupation":[1]}]]],["p-8d874454",[[4,"pn-sidenav",{"language":[1],"navLabel":[1,"nav-label"],"i18n":[32]},[[0,"language","setLanguage"],[0,"openSubMenuLevelChange","onOpenSubMenuLevelChange"]]]]],["p-4aedb76c",[[4,"pn-sidenav-level",{"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"alignment":[32]},null,{"isOpen":["onOpen"]}]]],["p-2a58d83b",[[4,"pn-sidenav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"icon":[1],"currentSelection":[4,"current-selection"],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-292db484",[[4,"pn-sidenav-togglebutton",{"label":[1],"i18n":[32]}]]],["p-d7170c0e",[[4,"pn-spotlight",{"heading":[1],"preamble":[1],"isDynamic":[4,"is-dynamic"],"addDynamic":[32]}]]],["p-cda742ba",[[4,"pn-teaser-card",{"text":[1],"heading":[1],"label":[1],"headingLevel":[1,"heading-level"],"dataCardColor":[513,"data-card-color"],"dataCardAlignment":[513,"data-card-alignment"],"hasCtaSlotContent":[32],"hasIllustrationSlot":[32]}]]],["p-da56370b",[[4,"pn-usp-promoter",{"heading":[1],"headingExtension":[1,"heading-extension"],"bodyText":[1,"body-text"],"backgroundGradient":[1,"background-gradient"],"fullWidth":[4,"full-width"],"rightAlign":[4,"right-align"],"hideMobileImage":[4,"hide-mobile-image"]}]]],["p-0fc01d3f",[[0,"pn-proxio-findprice-result",{"item":[1040],"activeweight":[1026],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"showInternational":[4,"show-international"],"selectedCountrycode":[1,"selected-countrycode"],"market":[1],"language":[1025],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32],"i18n":[32]},null,{"item":["composeItems"],"activeweight":["getPriceString","getProductLink"]}]]],["p-5a981927",[[0,"pn-find-service-and-price-result",{"item":[1040],"shownitems":[16],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-8a651698",[[0,"pn-play-on-scroll",{"videoSrc":[1,"video-src"],"observerOptions":[16],"showOverlay":[4,"show-overlay"],"videoId":[32],"isManuallyPaused":[32],"isPaused":[32]}]]],["p-dc2ee6f8",[[0,"pn-level-up-modal",{"open":[513],"endpoint":[1],"instructionPhoneLineOne":[1,"instruction-phone-line-one"],"instructionPhoneLineTwo":[1,"instruction-phone-line-two"],"instructionPhoneLineThree":[1,"instruction-phone-line-three"],"headingText":[1,"heading-text"],"outdatedQRMessage":[1,"outdated-q-r-message"],"expiresInMessage":[1,"expires-in-message"],"system":[1],"qrAriaLabel":[1,"qr-aria-label"],"openModalToggle":[32],"isLoading":[32]},null,{"open":["updateOpen"]}]]],["p-d5c45da2",[[0,"pn-multi-row-connected-dropdown-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFieldLabel":[1,"input-field-label"],"inputFieldPlaceholder":[1,"input-field-placeholder"],"disabledDates":[1,"disabled-dates"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"index":[2],"predefinedValue":[1,"predefined-value"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"minAmount":[2,"min-amount"],"errorMessageEmpty":[1,"error-message-empty"],"errorMessageMinAmount":[1,"error-message-min-amount"],"minWarningAmount":[2,"min-warning-amount"],"warningMessageMinAmount":[1,"warning-message-min-amount"],"buttonsArray":[32],"firstDropdownArr":[32],"secondDropdownArr":[32],"firstDropdownClass":[32],"secondDropdownClass":[32],"firstValidDateString":[32],"lastValidDateString":[32],"firstDropdownPlaceholder":[32],"secondDropdownPlaceholder":[32],"startDateValue":[32],"endDateValue":[32],"generatedDatesArr":[32],"selectedButtonValue":[32],"inputFieldValue":[32],"dateValue":[32],"daysArr":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-daa74e60",[[0,"pn-dropdown-with-multi-input-rows-row",{"languageCode":[1,"language-code"],"firstInputPlaceholder":[1,"first-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"firstValidDate":[1,"first-valid-date"],"lastValidDate":[1,"last-valid-date"],"predefinedValue":[1,"predefined-value"],"rowIndex":[2,"row-index"],"minRowCount":[2,"min-row-count"],"disabledDates":[1,"disabled-dates"],"showFirstInputWarning":[32],"showFirstInputLowError":[32],"showFirstInputHighError":[32],"showSecondInputWarning":[32],"showSecondInputLowError":[32],"showSecondInputHighError":[32],"firstInputValue":[32],"secondInputValue":[32],"dateValue":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-542f949d",[[4,"pn-share-item",{"link":[1],"text":[1]}]]],["p-9454075f",[[0,"pn-stats-info-data",{"format":[1],"formatStyle":[1,"format-style"],"startValue":[2,"start-value"],"data":[2],"unit":[1],"preamble":[1],"duration":[2],"index":[2],"hasBeenShown":[32],"compId":[32]},null,{"hasBeenShown":["watchStateHandlder"]}]]],["p-65a046be",[[0,"pn-find-price-result",{"item":[1040],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32]},null,{"item":["composeItems"]}]]],["p-3a936c5d",[[4,"pn-chat-message",{"category":[1],"customerSegment":[1,"customer-segment"],"agentName":[1,"agent-name"]}],[0,"pn-marketweb-carousel",{"previousButtonLabel":[1,"previous-button-label"],"nextButtonLabel":[1,"next-button-label"],"ariaNavigationLabel":[1,"aria-navigation-label"],"source":[1],"slidesToShow":[2,"slides-to-show"],"showCarouselButtons":[4,"show-carousel-buttons"],"showFirstSlidePrevButton":[4,"show-first-slide-prev-button"],"showLastSlideNextButton":[4,"show-last-slide-next-button"],"slidesData":[32],"currentSlide":[32],"isDragging":[32],"slideWidth":[32],"goToSlide":[64],"getCurrentSlide":[64]},null,{"source":["handleSourceChange"]}]]],["p-8d98f709",[[1,"pn-filter-checkbox",{"value":[520],"name":[1],"checkboxid":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-c4e353b3",[[4,"pn-mainnav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-4e924d13",[[0,"pn-qr-code-generator",{"url":[1],"countdownSeconds":[2,"countdown-seconds"],"outdatedMessage":[1,"outdated-message"],"expiresInMessage":[1,"expires-in-message"],"updateCodeEverySecond":[4,"update-code-every-second"],"ariaLabel":[1,"aria-label"],"remainingSeconds":[32],"isOutdated":[32],"isFullscreen":[32]},null,{"url":["generateQRCode"]}]]],["p-85b42b44",[[4,"pn-site-footer",{"url":[1],"linktitle":[1],"theme":[513]}],[4,"pn-site-footer-col",{"theme":[513]}],[0,"pn-swan",{"licenseNumber":[1,"license-number"],"language":[1537],"linkTo":[1,"link-to"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-ad282b7c",[[4,"pn-choice-button",{"value":[520],"name":[1],"choiceid":[1],"type":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-efab81a9",[[0,"pn-marketweb-input",{"disabled":[4],"error":[1],"invalid":[4],"helpertext":[1],"label":[1],"placeholder":[1],"inputid":[1],"name":[1],"required":[4],"type":[1025],"autocomplete":[1],"valid":[4],"value":[1],"maxlength":[1],"min":[1],"max":[1],"step":[1],"pattern":[1],"showText":[32]}]]],["p-39b75c62",[[0,"pn-product-tile-info",{"label":[1],"text":[1],"icon":[1]}],[0,"pn-product-tile-price",{"label":[1],"amount":[1],"currency":[1],"url":[1]}]]],["p-b9590d81",[[4,"pn-scroll",{"observerOptions":[16],"behaviourClasses":[1,"behaviour-classes"],"transitionDurationSeconds":[2,"transition-duration-seconds"],"shouldLoop":[4,"should-loop"],"intersectFunc":[16],"notIntersectFunc":[16],"compId":[32]}],[0,"pn-video-overlay",{"language":[1],"isPaused":[4,"is-paused"],"showOverlay":[4,"show-overlay"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-3e197670",[[0,"pn-marketweb-siteheader-login-linklist",{"heading":[1],"links":[16],"idNamespace":[1,"id-namespace"],"showUnifiedLogin":[4,"show-unified-login"]}]]],["p-84fc8e05",[[4,"pn-titletag",{"icon":[1],"color":[1537]}]]],["p-268dc1fa",[[0,"pn-marketweb-siteheader-login-links",{"loginDialog":[1040],"idNamespace":[1,"id-namespace"],"loggedin":[516],"username":[1],"showUnifiedLogin":[4,"show-unified-login"]},null,{"loginDialog":["init"]}],[0,"pn-marketweb-siteheader-login-profileselection",{"loginDialog":[1040],"endpoint":[1],"loggedin":[4],"idNamespace":[1,"id-namespace"],"heading":[1],"i18n":[16],"currentProfile":[1040],"profileoptions":[1040],"user":[32],"logoutLink":[32],"userName":[32],"userEmail":[32]}],[0,"pn-marketweb-siteheader-unified-login",{"loggedIn":[4,"logged-in"],"logInLabel":[1,"log-in-label"],"useMarketwebLogin":[4,"use-marketweb-login"],"environment":[1]}],[0,"pn-marketweb-siteheader-login-button",{"label":[1],"useMarketwebLogin":[4,"use-marketweb-login"],"environment":[1]}]]],["p-40bce1b1",[[0,"pn-marketweb-siteheader-login",{"endpoint":[1],"token":[1],"i18n":[16],"siteUrl":[1,"site-url"],"emitEvents":[4,"emit-events"],"loginDialog":[1040],"fullname":[1],"loggedin":[4],"showProfileSelection":[1028,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"environment":[1],"useMarketwebLogin":[4,"use-marketweb-login"],"loginLinks":[32],"toggleButtonText":[32],"username":[32]},null,{"i18n":["init"],"loginDialog":["init"]}],[4,"pn-mainnav-level",{"label":[1537],"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"listCount":[32],"alignment":[32]},null,{"label":["setState"],"isOpen":["onOpen"]}],[4,"pn-language-selector",{"value":[1537],"selectedLanguageName":[32],"options":[32],"i18n":[32]},null,{"value":["setSelectedLanguageName","setTranslations","onValueChange"]}],[0,"pn-language-selector-option",{"name":[1],"code":[1],"url":[1],"selected":[4],"currentLanguage":[1,"current-language"]}],[4,"pn-mainnav",{"market":[1],"language":[1],"navigationId":[1,"navigation-id"],"openMenu":[1028,"open-menu"],"navLabel":[1,"nav-label"]},[[0,"language","setLanguage"],[0,"market","setMarket"],[0,"menuLanguageChange","onLanguageChange"],[0,"setmenuopenstate","setMenuOpenState"],[0,"openMenuLevelChange","onOpenMenuLevelChange"]]],[4,"pn-mainnav-list",{"heading":[1],"linkCount":[32]}],[0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"language":[1537],"siteid":[1],"search":[1040],"primary":[4],"icononly":[4],"autoCompleteOptions":[32]}],[4,"pn-site-selector",{"buttontext":[1537],"heading":[1537],"language":[1537],"i18n":[32]}],[0,"pn-site-selector-item",{"url":[1],"heading":[1],"description":[1],"newwindow":[4]}]]],["p-19bbac6d",[[4,"pn-proxio-productcard"],[0,"pn-proxio-productcard-description",{"heading":[1],"highlight":[1],"description":[1],"list":[1040]}],[0,"pn-proxio-productcard-information",{"label":[1],"information":[16]}],[0,"pn-proxio-productcard-pricelink",{"price":[1],"vatText":[1,"vat-text"],"link":[1],"linktext":[1]}]]],["p-cbb1d57d",[[0,"pn-product-card-info",{"rulle":[1],"paket":[1],"label":[1],"text":[1]}],[0,"pn-product-card-price",{"label":[1],"amount":[1],"currency":[1],"note":[1],"url":[1],"service":[1],"linkid":[1]}],[4,"pn-product-card"]]]]'),e)}));
1
+ import{p as e,H as a,b as t}from"./p-82546a44.js";export{s as setNonce}from"./p-82546a44.js";import{g as n}from"./p-e1255160.js";var o=()=>{{r(a.prototype)}const t=import.meta.url;const n={};if(t!==""){n.resourcesUrl=new URL(".",t).href}return e(n)};var r=e=>{const a=e.cloneNode;e.cloneNode=function(e){if(this.nodeName==="TEMPLATE"){return a.call(this,e)}const t=a.call(this,false);const n=this.childNodes;if(e){for(let e=0;e<n.length;e++){if(n[e].nodeType!==2){t.appendChild(n[e].cloneNode(true))}}}return t}};o().then((async e=>{await n();return t(JSON.parse('[["p-f28d0971",[[4,"pn-marketweb-siteheader",{"market":[1537],"language":[1537],"siteid":[1],"environment":[1537],"userToken":[1,"user-token"],"userFullname":[1,"user-fullname"],"userLoggedin":[516,"user-loggedin"],"endpoint":[1],"hideSiteSelector":[1540,"hide-site-selector"],"hideHomeMenuItem":[1540,"hide-home-menu-item"],"hideLanguageSelector":[1540,"hide-language-selector"],"hideSearch":[1540,"hide-search"],"hideLogin":[1540,"hide-login"],"showProfileSelection":[1540,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"siteDomainInUrls":[4,"site-domain-in-urls"],"AutocompleteEndpoint":[1,"autocomplete-endpoint"],"sessionForward":[4,"session-forward"],"cache":[4],"searchPlaceholder":[1,"search-placeholder"],"spaMode":[4,"spa-mode"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"useMarketwebLogin":[4,"use-marketweb-login"],"pageId":[1,"page-id"],"i18n":[32],"gotData":[32],"fetchingData":[32],"homePageLink":[32],"menuItems":[32],"siteDefinition":[32],"search":[32],"siteSelector":[32],"languageSelector":[32],"languageOptions":[32],"loginDialog":[32],"minimizeSearch":[32],"loggedIn":[32]},[[0,"setLanguage","onLanguageSelectorChange"],[0,"loginStateChange","onLoginStateChange"],[9,"resize","handleResize"]],{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-95d32ab4",[[0,"pn-proxio-findprice",{"endpoint":[1025],"language":[1025],"market":[1025],"showMedium":[4,"show-medium"],"showInternational":[4,"show-international"],"maxAbroadKg":[2,"max-abroad-kg"],"weightListName":[1,"weight-list-name"],"cache":[4],"filteredItems":[32],"weight":[32],"weightvalue":[32],"countrycodevalue":[32],"sizecategory":[32],"data":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"],"countrycodevalue":["filterItems"]}]]],["p-a73e4811",[[0,"pn-find-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"weight":[32],"weightvalue":[32],"sourceData":[32],"sizecategory":[32]},null,{"market":["setState"],"language":["setState"],"sizecategory":["filterItems"],"weightvalue":["filterItems"]}]]],["p-c9038b03",[[0,"pn-find-service-and-price",{"source":[1],"language":[1025],"market":[1025],"filteredItems":[32],"postagetype":[32],"weight":[32],"weightvalue":[32],"deliveryscope":[32],"sourceData":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"deliveryscope":["filterItems"],"weightvalue":["filterItems"]}]]],["p-f5d03222",[[4,"pn-product-pricelist",{"source":[1],"language":[1025],"market":[1025],"productid":[1],"filteredItems":[32],"sourceData":[32],"gotData":[32],"loading":[32],"postagetype":[32],"weight":[32],"weightvalue":[32]},null,{"market":["setState"],"language":["setState"],"postagetype":["filterItems"],"weightvalue":["filterItems"]}]]],["p-389a94e7",[[0,"pn-proxio-pricegroup",{"endpoint":[1025],"language":[1],"market":[1],"tariffid":[1],"cache":[4],"activeWeightIndex":[32],"data":[32],"i18n":[32]},[[0,"activeWeightIndex","setActiveWeightIndex"],[0,"language","setLanguage"]]]]],["p-659a4db5",[[0,"pn-product-pricelist-result",{"item":[1040],"description":[16],"shownitems":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-0b5a125d",[[4,"pn-marketweb-sitefooter",{"market":[1537],"language":[1537],"environment":[1537],"endpoint":[1],"siteDomainInUrls":[4,"site-domain-in-urls"],"cache":[4],"theme":[513],"backgroundcolor":[513],"showSwan":[4,"show-swan"],"headingLevel":[1,"heading-level"],"siteDefinition":[32],"footerContent":[32],"i18n":[32],"gotData":[32],"fetchingData":[32]},null,{"language":["onLanguageChange"],"market":["onMarketChange"]}]]],["p-eb21f772",[[4,"pn-media-block",{"blockHeight":[1,"block-height"],"imageSrc":[1,"image-src"],"imageSrcSmallScreenFormat":[1,"image-src-small-screen-format"],"imageAltText":[1,"image-alt-text"],"videoSrc":[1,"video-src"],"parallaxScroll":[4,"parallax-scroll"],"showOverlayLayer":[4,"show-overlay-layer"],"customOverlayBackground":[1,"custom-overlay-background"],"animateOverlayBackground":[4,"animate-overlay-background"],"scrollSnapBlock":[4,"scroll-snap-block"],"fixedBackground":[4,"fixed-background"],"blockHeading":[1,"block-heading"],"blockHeadingLevel":[1,"block-heading-level"],"blockPreamble":[1,"block-preamble"],"marginBottom":[4,"margin-bottom"],"pnPlayOnScrollObserverOptions":[32],"calculatedBlockHeight":[32],"hasButtonSlot":[32]}]]],["p-a298a263",[[0,"pn-chat",{"endpoint":[1],"customerSegment":[1,"customer-segment"],"mainHeading":[1,"main-heading"],"relatedContentAriaLabel":[1,"related-content-aria-label"],"chatMinimizedAriaLabel":[1,"chat-minimized-aria-label"],"chatOpenedAriaLabel":[1,"chat-opened-aria-label"],"minimizeChatAriaLabel":[1,"minimize-chat-aria-label"],"closeChatAriaLabel":[1,"close-chat-aria-label"],"openChatAriaLabel":[1,"open-chat-aria-label"],"chatControlsAriaLabel":[1,"chat-controls-aria-label"],"chatMessagesAriaLabel":[1,"chat-messages-aria-label"],"sentMessageAriaLabel":[1,"sent-message-aria-label"],"writeChatMessagePlaceholder":[1,"write-chat-message-placeholder"],"waitingForAnswerLabel":[1,"waiting-for-answer-label"],"sendButtonText":[1,"send-button-text"],"loadingText":[1,"loading-text"],"carouselSlidesToShow":[2,"carousel-slides-to-show"],"messages":[1],"language":[1],"market":[1],"itemId":[1,"item-id"],"pnChatId":[1,"pn-chat-id"],"forceOpen":[4,"force-open"],"isLoggedIn":[4,"is-logged-in"],"message":[32],"messagesData":[32],"isMinimized":[32],"isClosed":[32],"lastMessageId":[32],"i18n":[32]},[[0,"keydown","handleKeyDown"]],{"messages":["handleMessagesChange"],"pnChatId":["handleNewChatId"],"forceOpen":["handleSameChatId"],"isMinimized":["scrollToBottom"]}]]],["p-28d2f7fa",[[0,"pn-level-up",{"heading":[1],"headingLevel":[8,"heading-level"],"preamble":[1],"imageUrl":[1,"image-url"],"imageAltText":[1,"image-alt-text"],"endpoint":[1],"webModalContinueOtherDeviceLabel":[1,"web-modal-continue-other-device-label"],"webModalContinueThisDeviceLabel":[1,"web-modal-continue-this-device-label"],"mobileModalContinueThisDeviceLabel":[1,"mobile-modal-continue-this-device-label"],"mobileModalContinueOtherDeviceLabel":[1,"mobile-modal-continue-other-device-label"],"modalInstructionPhoneLineOne":[1,"modal-instruction-phone-line-one"],"modalInstructionPhoneLineTwo":[1,"modal-instruction-phone-line-two"],"modalInstructionPhoneLineThree":[1,"modal-instruction-phone-line-three"],"modalHeadingText":[1,"modal-heading-text"],"modalOutdatedQRMessage":[1,"modal-outdated-q-r-message"],"modalExpiresInMessage":[1,"modal-expires-in-message"],"qrAriaLabel":[1,"qr-aria-label"],"leveledupMessage":[1,"leveledup-message"],"isLeveledUp":[4,"is-leveled-up"],"isLoading":[32],"isRecentLeveledUp":[32],"errorMessage":[32]}]]],["p-61bd81d7",[[0,"pn-multi-row-connected-dropdown",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFieldLabel":[1,"input-field-label"],"inputFieldPlaceholder":[1,"input-field-placeholder"],"disabledDates":[1,"disabled-dates"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleRows":[4,"allow-multiple-rows"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"minAmount":[2,"min-amount"],"errorMessageEmpty":[1,"error-message-empty"],"errorMessageMinAmount":[1,"error-message-min-amount"],"minWarningAmount":[2,"min-warning-amount"],"warningMessageMinAmount":[1,"warning-message-min-amount"],"rowCount":[32],"rowData":[32],"formValues":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]]]]],["p-d17af75d",[[0,"pn-dropdown-with-multi-input-rows",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"firstDropdownLabel":[1,"first-dropdown-label"],"firstDropdownHelperText":[1,"first-dropdown-helper-text"],"secondDropdownLabel":[1,"second-dropdown-label"],"secondDropdownHelperText":[1,"second-dropdown-helper-text"],"secondDropdownMax":[2,"second-dropdown-max"],"deleteMultipleRowsWarningText":[1,"delete-multiple-rows-warning-text"],"confirmDeleteButtonText":[1,"confirm-delete-button-text"],"abortDeleteButtonText":[1,"abort-delete-button-text"],"firstInputLabel":[1,"first-input-label"],"firstInputPlaceholder":[1,"first-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputLabel":[1,"second-input-label"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"disabledDates":[1,"disabled-dates"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"sumFieldLabel":[1,"sum-field-label"],"addRowText":[1,"add-row-text"],"elementHelperText":[1,"element-helper-text"],"dropdownDataRoot":[32],"secondDropdownArr":[32],"rowData":[32],"formValues":[32],"firstValidDateString":[32],"lastValidDateString":[32],"rowSum":[32],"minRowCount":[32],"showDeleteConfirm":[32],"i18n":[32]},[[0,"rowValueChange","predefinedValueChange"],[0,"firstInputChange","predefinedValueChange"],[0,"secondInputChange","predefinedValueChange"],[0,"deleteRowEvent","deleteRowEvent"]],{"languageCode":["setTranslations"]}]]],["p-ad9a7633",[[0,"pn-multiple-input",{"label":[1],"placeholder":[1],"addRowButtonText":[1,"add-row-button-text"],"rowData":[32]}]]],["p-f4b14be8",[[0,"pn-parcel-tracker",{"formActionUrl":[1,"form-action-url"],"heading":[1],"buttonLabel":[1,"button-label"],"locale":[1],"placeholder":[1],"inputName":[1,"input-name"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-41cdac85",[[0,"pn-pex-pricefinder",{"language":[1],"currency":[1],"apiUrl":[1,"api-url"],"i18n":[32],"fromzip":[32],"tozip":[32],"weight":[32],"when":[32],"response":[32]},[[0,"language","setLanguage"]]]]],["p-ce87ff8a",[[0,"pn-share",{"link":[1],"language":[1537],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-08b473e0",[[4,"pn-stats-info",{"heading":[1],"dataArray":[1,"data-array"],"backgroundUrl":[1,"background-url"],"myParsedArray":[32]},null,{"dataArray":["parseMyArrayProp"]}]]],["p-920ce5f2",[[0,"pn-address-autofill",{"market":[1537],"environment":[1537],"endpoint":[1],"cache":[4],"countryCode":[1,"country-code"],"language":[1],"postalCodeProps":[1,"postal-code-props"],"cityProps":[1,"city-props"],"streetAddressProps":[1,"street-address-props"],"streetNumberProps":[1,"street-number-props"],"addressNotFoundError":[1,"address-not-found-error"],"postalCode":[32],"city":[32],"streetAddress":[32],"streetNumber":[32],"validAddress":[32],"translation":[32],"postalCodeRequiredLabel":[32],"streetRequiredLabel":[32],"fullAddress":[32],"isLoading":[32]}]]],["p-7b4f9fdf",[[4,"pn-animated-tile",{"toggled":[32],"transitionClassName":[32],"animateIcon":[32]},null,{"toggled":["onToggledHandler"]}]]],["p-66da6e15",[[0,"pn-app-banner",{"appName":[1,"app-name"],"appDescription":[1,"app-description"],"ctaText":[1,"cta-text"],"appleStoreLink":[1,"apple-store-link"],"googleStoreLink":[1,"google-store-link"],"isClosed":[32],"storeLink":[32],"isLocalStorageAvailable":[32]}]]],["p-7db6ef34",[[4,"pn-bonus-progressbar",{"icon":[1],"heading":[1],"sumtext":[513],"theme":[513],"bonuspercentage":[1],"currency":[513],"value":[1538],"min":[1538],"max":[1538],"valuepercentage":[32],"progresspercentage":[32],"levelValues":[32],"currentLevelAdjustedValue":[32]},null,{"currentLevelAdjustedValue":["setValuePercentage"],"value":["setValuePercentage"],"min":["setValuePercentage"],"max":["setValuePercentage"]}]]],["p-015127bf",[[0,"pn-bonus-progressbar-level",{"current":[516],"value":[1538],"bonuspercentage":[1537],"visualpercentage":[1538],"percentage":[32],"max":[32],"min":[32],"currency":[32]}]]],["p-34a98554",[[0,"pn-breakpoints",{"breakPointClass":[1,"break-point-class"],"currentWidth":[32]},[[9,"resize","handleViewportSizeChange"]]]]],["p-f0df7694",[[0,"pn-chart",{"labels":[1],"dataSets":[1,"data-sets"],"dataChartType":[8,"data-chart-type"],"myChartCtxRef":[32]},null,{"dataSets":["dataChangeHandler"],"labels":["labelsChangeHandler"]}]]],["p-230ef9aa",[[4,"pn-charts-card",{"header":[1],"highlight":[1],"preamble":[1],"label":[1],"source":[1],"sourceUrl":[1,"source-url"],"ctaLinkText":[1,"cta-link-text"],"openInNewWindow":[4,"open-in-new-window"]}]]],["p-7b7629c5",[[4,"pn-cta-block",{"heading":[1],"bodyText":[1,"body-text"],"pnBackgroundColor":[1,"pn-background-color"],"isLarge":[4,"is-large"],"isCentered":[4,"is-centered"],"isSmall":[4,"is-small"],"contentTop":[4,"content-top"]}]]],["p-809ed802",[[4,"pn-customernumber-selector",{"language":[1537],"open":[1540],"heading":[1],"description":[1],"i18n":[32]}]]],["p-619f2143",[[4,"pn-customernumber-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-2c19edca",[[0,"pn-date-and-time",{"languageCode":[1,"language-code"],"dateAndTimeLabel":[1,"date-and-time-label"],"dateDaysFromToday":[2,"date-days-from-today"],"validTimeRangeMinutes":[2,"valid-time-range-minutes"],"errorMessage":[1,"error-message"],"dateHelperText":[1,"date-helper-text"],"timeHelperText":[1,"time-helper-text"],"disableWeekends":[4,"disable-weekends"],"disabledDates":[1,"disabled-dates"],"datePlaceholder":[1,"date-placeholder"],"minFromHour":[2,"min-from-hour"],"maxToHour":[2,"max-to-hour"],"language":[32],"hourArr":[32],"minuteArr":[32],"formValue":[32],"invalidTimespan":[32],"selectedDate":[32],"selectedFromHour":[32],"selectedFromMin":[32],"selectedToHour":[32],"selectedToMin":[32],"firstValidDateString":[32],"lastValidDateString":[32]}]]],["p-d75a2f7c",[[4,"pn-dropdown-choice-adds-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"addRowDropdownName":[1,"add-row-dropdown-name"],"addRowDropdownPlaceholder":[1,"add-row-dropdown-placeholder"],"addRowDropdownLabel":[1,"add-row-dropdown-label"],"rowNameLabel":[1,"row-name-label"],"rowHasDropdown":[4,"row-has-dropdown"],"rowDropdownLabel":[1,"row-dropdown-label"],"rowDropdownPlaceholder":[1,"row-dropdown-placeholder"],"rowInputLabel":[1,"row-input-label"],"rowDeleteButtonText":[1,"row-delete-button-text"],"totalInputLimit":[2,"total-input-limit"],"inputLimitWarning":[1,"input-limit-warning"],"inputEmptyWarning":[1,"input-empty-warning"],"dropdownEmptyWarning":[1,"dropdown-empty-warning"],"nextRowIndex":[32],"rowSelectDropdownArr":[32],"formValue":[32]},null,{"dropdownData":["dropdownDataWatcher"]}]]],["p-64851da0",[[4,"pn-hero-block-international",{"heading":[1],"subHeading":[1,"sub-heading"],"preamble":[1],"animateLogo":[4,"animate-logo"],"showSideLoader":[4,"show-side-loader"],"centeredLayout":[4,"centered-layout"]}]]],["p-35847eda",[[0,"pn-line-shape"]]],["p-4f639380",[[4,"pn-link-list",{"heading":[1],"label":[1],"preamble":[1],"url":[1],"showMoreLabel":[1,"show-more-label"],"showMoreUrl":[1,"show-more-url"]}]]],["p-f28059f4",[[0,"pn-marketweb-icon",{"symbol":[1],"small":[4],"color":[1]}]]],["p-51f136f3",[[1,"pn-marketweb-search",{"disabled":[4],"placeholder":[1],"inputid":[1],"name":[1],"autocomplete":[1],"list":[1],"value":[1],"label":[1],"loading":[4],"button":[1],"light":[4],"suggestionObserver":[32],"hasClonedInput":[32],"listSuggestion":[32]},[[0,"input","inputHandler"]]]]],["p-17c43a96",[[0,"pn-marketweb-siteheader-login-mypage-button",{"label":[1],"myPageUrl":[1,"my-page-url"]}]]],["p-923aa6d2",[[0,"pn-marketweb-table",{"mainHeading":[1,"main-heading"],"mainHeadingLevel":[1,"main-heading-level"],"preamble":[1],"subHeadingLevel":[1,"sub-heading-level"],"headers":[1],"rows":[1],"showHeadersInCells":[4,"show-headers-in-cells"],"cellHeaderLevel":[1,"cell-header-level"],"tableRowCtaActionLabel":[1,"table-row-cta-action-label"],"imageColAriaHeader":[1,"image-col-aria-header"],"ctaColAriaHeader":[1,"cta-col-aria-header"],"checkForNewShipments":[4,"check-for-new-shipments"],"endpoint":[1],"language":[1],"market":[1],"toggleDetailLabel":[1,"toggle-detail-label"],"checkForChat":[4,"check-for-chat"],"value":[1537],"shipmentType":[1,"shipment-type"],"contentId":[1,"content-id"],"takeAmountRow":[2,"take-amount-row"],"shipmentCount":[2,"shipment-count"],"i18n":[32],"_headers":[32],"_rows":[32],"_allKeys":[32],"screenInfo":[32]},null,{"language":["onLanguageChange"]}]]],["p-72f57a04",[[4,"pn-product-tile"]]],["p-c89cb749",[[4,"pn-profile-modal",{"heading":[1],"continueCtaText":[1,"continue-cta-text"],"choosenCompanyText":[1,"choosen-company-text"],"toText":[1,"to-text"],"chooseCustomerNumberText":[1,"choose-customer-number-text"],"isLoading":[32]},[[0,"urlSelected","onUrlSelected"]]]]],["p-9088d3f5",[[4,"pn-profile-modal-customernumber",{"url":[513],"customernumber":[513],"selected":[516]}]]],["p-60b77eed",[[4,"pn-profile-modal-profile",{"heading":[513],"description":[513],"url":[513],"selected":[1028],"showCustomerNumbers":[516,"show-customer-numbers"],"pleaseSelectText":[513,"please-select-text"],"visible":[1540],"identifier":[32]}]]],["p-79e4715c",[[4,"pn-profile-modal-type",{"typeid":[513],"name":[1025],"selected":[1028],"selectedprofile":[1025]},null,{"selected":["onSelectedChange"]}]]],["p-71db6836",[[4,"pn-profile-selector",{"language":[1537],"returnUrl":[1,"return-url"],"heading":[1],"i18n":[32],"isLoading":[32],"numberOfProfiles":[32]}]]],["p-3d10bc37",[[0,"pn-profile-selector-option",{"heading":[1],"description":[1],"url":[1]}]]],["p-59bf4b98",[[4,"pn-quick-cta",{"heading":[1],"preamble":[1]}]]],["p-763a4e13",[[4,"pn-quote-card",{"quote":[1],"name":[1],"occupation":[1]}]]],["p-8d874454",[[4,"pn-sidenav",{"language":[1],"navLabel":[1,"nav-label"],"i18n":[32]},[[0,"language","setLanguage"],[0,"openSubMenuLevelChange","onOpenSubMenuLevelChange"]]]]],["p-4aedb76c",[[4,"pn-sidenav-level",{"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"alignment":[32]},null,{"isOpen":["onOpen"]}]]],["p-2a58d83b",[[4,"pn-sidenav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"icon":[1],"currentSelection":[4,"current-selection"],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-292db484",[[4,"pn-sidenav-togglebutton",{"label":[1],"i18n":[32]}]]],["p-d7170c0e",[[4,"pn-spotlight",{"heading":[1],"preamble":[1],"isDynamic":[4,"is-dynamic"],"addDynamic":[32]}]]],["p-bfd604f2",[[4,"pn-teaser-card",{"text":[1],"heading":[1],"label":[1],"headingLevel":[1,"heading-level"],"dataCardColor":[513,"data-card-color"],"dataCardAlignment":[513,"data-card-alignment"],"hasCtaSlotContent":[32],"hasIllustrationSlot":[32]}]]],["p-da56370b",[[4,"pn-usp-promoter",{"heading":[1],"headingExtension":[1,"heading-extension"],"bodyText":[1,"body-text"],"backgroundGradient":[1,"background-gradient"],"fullWidth":[4,"full-width"],"rightAlign":[4,"right-align"],"hideMobileImage":[4,"hide-mobile-image"]}]]],["p-0fc01d3f",[[0,"pn-proxio-findprice-result",{"item":[1040],"activeweight":[1026],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"showInternational":[4,"show-international"],"selectedCountrycode":[1,"selected-countrycode"],"market":[1],"language":[1025],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32],"i18n":[32]},null,{"item":["composeItems"],"activeweight":["getPriceString","getProductLink"]}]]],["p-5a981927",[[0,"pn-find-service-and-price-result",{"item":[1040],"shownitems":[16],"weightText":[32]},null,{"item":["composeItems"]}]]],["p-8a651698",[[0,"pn-play-on-scroll",{"videoSrc":[1,"video-src"],"observerOptions":[16],"showOverlay":[4,"show-overlay"],"videoId":[32],"isManuallyPaused":[32],"isPaused":[32]}]]],["p-dc2ee6f8",[[0,"pn-level-up-modal",{"open":[513],"endpoint":[1],"instructionPhoneLineOne":[1,"instruction-phone-line-one"],"instructionPhoneLineTwo":[1,"instruction-phone-line-two"],"instructionPhoneLineThree":[1,"instruction-phone-line-three"],"headingText":[1,"heading-text"],"outdatedQRMessage":[1,"outdated-q-r-message"],"expiresInMessage":[1,"expires-in-message"],"system":[1],"qrAriaLabel":[1,"qr-aria-label"],"openModalToggle":[32],"isLoading":[32]},null,{"open":["updateOpen"]}]]],["p-d5c45da2",[[0,"pn-multi-row-connected-dropdown-row",{"dropdownData":[1,"dropdown-data"],"languageCode":[1,"language-code"],"label":[1],"firstDropdownLabel":[1,"first-dropdown-label"],"secondDropdownLabel":[1,"second-dropdown-label"],"dropdownPlaceholder":[1,"dropdown-placeholder"],"addRowText":[1,"add-row-text"],"inputFieldLabel":[1,"input-field-label"],"inputFieldPlaceholder":[1,"input-field-placeholder"],"disabledDates":[1,"disabled-dates"],"dateButtonText":[1,"date-button-text"],"datePlaceholder":[1,"date-placeholder"],"dateDaysFromToday":[2,"date-days-from-today"],"allowMultipleDates":[4,"allow-multiple-dates"],"startDateLabel":[1,"start-date-label"],"endDateLabel":[1,"end-date-label"],"multiDateHelperText":[1,"multi-date-helper-text"],"generateDatesButtonText":[1,"generate-dates-button-text"],"saveDateButtonText":[1,"save-date-button-text"],"noDatesText":[1,"no-dates-text"],"index":[2],"predefinedValue":[1,"predefined-value"],"yearsToAddToEndDate":[2,"years-to-add-to-end-date"],"minAmount":[2,"min-amount"],"errorMessageEmpty":[1,"error-message-empty"],"errorMessageMinAmount":[1,"error-message-min-amount"],"minWarningAmount":[2,"min-warning-amount"],"warningMessageMinAmount":[1,"warning-message-min-amount"],"buttonsArray":[32],"firstDropdownArr":[32],"secondDropdownArr":[32],"firstDropdownClass":[32],"secondDropdownClass":[32],"firstValidDateString":[32],"lastValidDateString":[32],"firstDropdownPlaceholder":[32],"secondDropdownPlaceholder":[32],"startDateValue":[32],"endDateValue":[32],"generatedDatesArr":[32],"selectedButtonValue":[32],"inputFieldValue":[32],"dateValue":[32],"daysArr":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-daa74e60",[[0,"pn-dropdown-with-multi-input-rows-row",{"languageCode":[1,"language-code"],"firstInputPlaceholder":[1,"first-input-placeholder"],"firstInputMin":[2,"first-input-min"],"firstInputMax":[2,"first-input-max"],"firstInputWarning":[2,"first-input-warning"],"firstInputWarningText":[1,"first-input-warning-text"],"firstInputLowErrorText":[1,"first-input-low-error-text"],"firstInputHighErrorText":[1,"first-input-high-error-text"],"secondInputPlaceholder":[1,"second-input-placeholder"],"secondInputMin":[2,"second-input-min"],"secondInputMax":[2,"second-input-max"],"secondInputWarning":[2,"second-input-warning"],"secondInputWarningText":[1,"second-input-warning-text"],"secondInputLowErrorText":[1,"second-input-low-error-text"],"secondInputHighErrorText":[1,"second-input-high-error-text"],"dateLabel":[1,"date-label"],"datePlaceholder":[1,"date-placeholder"],"firstValidDate":[1,"first-valid-date"],"lastValidDate":[1,"last-valid-date"],"predefinedValue":[1,"predefined-value"],"rowIndex":[2,"row-index"],"minRowCount":[2,"min-row-count"],"disabledDates":[1,"disabled-dates"],"showFirstInputWarning":[32],"showFirstInputLowError":[32],"showFirstInputHighError":[32],"showSecondInputWarning":[32],"showSecondInputLowError":[32],"showSecondInputHighError":[32],"firstInputValue":[32],"secondInputValue":[32],"dateValue":[32]},null,{"predefinedValue":["applyPredefinedValue"]}]]],["p-542f949d",[[4,"pn-share-item",{"link":[1],"text":[1]}]]],["p-9454075f",[[0,"pn-stats-info-data",{"format":[1],"formatStyle":[1,"format-style"],"startValue":[2,"start-value"],"data":[2],"unit":[1],"preamble":[1],"duration":[2],"index":[2],"hasBeenShown":[32],"compId":[32]},null,{"hasBeenShown":["watchStateHandlder"]}]]],["p-65a046be",[[0,"pn-find-price-result",{"item":[1040],"shownitems":[16],"Usp1":[1,"usp-1"],"Usp2":[1,"usp-2"],"Usp3":[1,"usp-3"],"description":[16],"showMeasurement":[4,"show-measurement"],"weightText":[32],"linkId":[32],"shopLabel":[32],"shopUrl":[32],"shopId":[32]},null,{"item":["composeItems"]}]]],["p-3a936c5d",[[4,"pn-chat-message",{"category":[1],"customerSegment":[1,"customer-segment"],"agentName":[1,"agent-name"]}],[0,"pn-marketweb-carousel",{"previousButtonLabel":[1,"previous-button-label"],"nextButtonLabel":[1,"next-button-label"],"ariaNavigationLabel":[1,"aria-navigation-label"],"source":[1],"slidesToShow":[2,"slides-to-show"],"showCarouselButtons":[4,"show-carousel-buttons"],"showFirstSlidePrevButton":[4,"show-first-slide-prev-button"],"showLastSlideNextButton":[4,"show-last-slide-next-button"],"slidesData":[32],"currentSlide":[32],"isDragging":[32],"slideWidth":[32],"goToSlide":[64],"getCurrentSlide":[64]},null,{"source":["handleSourceChange"]}]]],["p-8d98f709",[[1,"pn-filter-checkbox",{"value":[520],"name":[1],"checkboxid":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-c4e353b3",[[4,"pn-mainnav-link",{"name":[1],"href":[1],"target":[1],"linkid":[1],"levelId":[32],"open":[32],"hasChildren":[32]}]]],["p-4e924d13",[[0,"pn-qr-code-generator",{"url":[1],"countdownSeconds":[2,"countdown-seconds"],"outdatedMessage":[1,"outdated-message"],"expiresInMessage":[1,"expires-in-message"],"updateCodeEverySecond":[4,"update-code-every-second"],"ariaLabel":[1,"aria-label"],"remainingSeconds":[32],"isOutdated":[32],"isFullscreen":[32]},null,{"url":["generateQRCode"]}]]],["p-85b42b44",[[4,"pn-site-footer",{"url":[1],"linktitle":[1],"theme":[513]}],[4,"pn-site-footer-col",{"theme":[513]}],[0,"pn-swan",{"licenseNumber":[1,"license-number"],"language":[1537],"linkTo":[1,"link-to"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-ad282b7c",[[4,"pn-choice-button",{"value":[520],"name":[1],"choiceid":[1],"type":[1],"disabled":[4],"checked":[4],"indeterminate":[1028]},[[0,"change","handlechange"]]]]],["p-efab81a9",[[0,"pn-marketweb-input",{"disabled":[4],"error":[1],"invalid":[4],"helpertext":[1],"label":[1],"placeholder":[1],"inputid":[1],"name":[1],"required":[4],"type":[1025],"autocomplete":[1],"valid":[4],"value":[1],"maxlength":[1],"min":[1],"max":[1],"step":[1],"pattern":[1],"showText":[32]}]]],["p-39b75c62",[[0,"pn-product-tile-info",{"label":[1],"text":[1],"icon":[1]}],[0,"pn-product-tile-price",{"label":[1],"amount":[1],"currency":[1],"url":[1]}]]],["p-b9590d81",[[4,"pn-scroll",{"observerOptions":[16],"behaviourClasses":[1,"behaviour-classes"],"transitionDurationSeconds":[2,"transition-duration-seconds"],"shouldLoop":[4,"should-loop"],"intersectFunc":[16],"notIntersectFunc":[16],"compId":[32]}],[0,"pn-video-overlay",{"language":[1],"isPaused":[4,"is-paused"],"showOverlay":[4,"show-overlay"],"i18n":[32]},null,{"language":["onLanguageChange"]}]]],["p-3e197670",[[0,"pn-marketweb-siteheader-login-linklist",{"heading":[1],"links":[16],"idNamespace":[1,"id-namespace"],"showUnifiedLogin":[4,"show-unified-login"]}]]],["p-84fc8e05",[[4,"pn-titletag",{"icon":[1],"color":[1537]}]]],["p-268dc1fa",[[0,"pn-marketweb-siteheader-login-links",{"loginDialog":[1040],"idNamespace":[1,"id-namespace"],"loggedin":[516],"username":[1],"showUnifiedLogin":[4,"show-unified-login"]},null,{"loginDialog":["init"]}],[0,"pn-marketweb-siteheader-login-profileselection",{"loginDialog":[1040],"endpoint":[1],"loggedin":[4],"idNamespace":[1,"id-namespace"],"heading":[1],"i18n":[16],"currentProfile":[1040],"profileoptions":[1040],"user":[32],"logoutLink":[32],"userName":[32],"userEmail":[32]}],[0,"pn-marketweb-siteheader-unified-login",{"loggedIn":[4,"logged-in"],"logInLabel":[1,"log-in-label"],"useMarketwebLogin":[4,"use-marketweb-login"],"environment":[1]}],[0,"pn-marketweb-siteheader-login-button",{"label":[1],"useMarketwebLogin":[4,"use-marketweb-login"],"environment":[1]}]]],["p-40bce1b1",[[0,"pn-marketweb-siteheader-login",{"endpoint":[1],"token":[1],"i18n":[16],"siteUrl":[1,"site-url"],"emitEvents":[4,"emit-events"],"loginDialog":[1040],"fullname":[1],"loggedin":[4],"showProfileSelection":[1028,"show-profile-selection"],"showUnifiedLogin":[4,"show-unified-login"],"checkUserLoggedInStateInterval":[2,"check-user-logged-in-state-interval"],"environment":[1],"useMarketwebLogin":[4,"use-marketweb-login"],"loginLinks":[32],"toggleButtonText":[32],"username":[32]},null,{"i18n":["init"],"loginDialog":["init"]}],[4,"pn-mainnav-level",{"label":[1537],"level":[32],"levelId":[32],"isOpen":[32],"parentName":[32],"parentHref":[32],"parentLinkId":[32],"listCount":[32],"alignment":[32]},null,{"label":["setState"],"isOpen":["onOpen"]}],[4,"pn-language-selector",{"value":[1537],"selectedLanguageName":[32],"options":[32],"i18n":[32]},null,{"value":["setSelectedLanguageName","setTranslations","onValueChange"]}],[0,"pn-language-selector-option",{"name":[1],"code":[1],"url":[1],"selected":[4],"currentLanguage":[1,"current-language"]}],[4,"pn-mainnav",{"market":[1],"language":[1],"navigationId":[1,"navigation-id"],"openMenu":[1028,"open-menu"],"navLabel":[1,"nav-label"]},[[0,"language","setLanguage"],[0,"market","setMarket"],[0,"menuLanguageChange","onLanguageChange"],[0,"setmenuopenstate","setMenuOpenState"],[0,"openMenuLevelChange","onOpenMenuLevelChange"]]],[4,"pn-mainnav-list",{"heading":[1],"linkCount":[32]}],[0,"pn-marketweb-siteheader-search",{"i18n":[8,"i-1-8n"],"showOnlyLink":[1028,"show-only-link"],"hideSearch":[1028,"hide-search"],"language":[1537],"siteid":[1],"search":[1040],"primary":[4],"icononly":[4],"autoCompleteOptions":[32]}],[4,"pn-site-selector",{"buttontext":[1537],"heading":[1537],"language":[1537],"i18n":[32]}],[0,"pn-site-selector-item",{"url":[1],"heading":[1],"description":[1],"newwindow":[4]}]]],["p-19bbac6d",[[4,"pn-proxio-productcard"],[0,"pn-proxio-productcard-description",{"heading":[1],"highlight":[1],"description":[1],"list":[1040]}],[0,"pn-proxio-productcard-information",{"label":[1],"information":[16]}],[0,"pn-proxio-productcard-pricelink",{"price":[1],"vatText":[1,"vat-text"],"link":[1],"linktext":[1]}]]],["p-cbb1d57d",[[0,"pn-product-card-info",{"rulle":[1],"paket":[1],"label":[1],"text":[1]}],[0,"pn-product-card-price",{"label":[1],"amount":[1],"currency":[1],"note":[1],"url":[1],"service":[1],"linkid":[1]}],[4,"pn-product-card"]]]]'),e)}));
2
2
  //# sourceMappingURL=pn-market-web-components.esm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"names":["pnTeaserCardCss","PnTeaserCardStyle0","PnTeaserCard","componentWillLoad","this","hasCtaSlotContent","hostElement","querySelector","hasIllustrationSlot","render","labelToCapitals","label","toUpperCase","h","Host","key","name","class","heading","HeadingTag","level","headingLevel","cssClass","text"],"sources":["src/components/cards/pn-teaser-card/pn-teaser-card.scss?tag=pn-teaser-card","src/components/cards/pn-teaser-card/pn-teaser-card.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\n//making pn wrapping link clickable over card image\n.block.teasercardblock {\n a[data-block-clickable-link='true'] {\n z-index: 1;\n }\n}\n\n//mobile first\npn-teaser-card {\n width: 100%;\n height: 100%;\n display: flex;\n\n .pn-teaser-card__container {\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n border-radius: 2.4rem;\n width: 100%;\n }\n\n .pn-teaser-card__container__image__container {\n width: 100%;\n position: relative;\n\n & > [slot='illustration'] {\n clip-path: ellipse(100% 90% at 50% 0%);\n height: 100%;\n overflow: hidden;\n border-top-left-radius: 2.4rem;\n border-top-right-radius: 2.4rem;\n\n & > picture > img {\n width: 100%;\n height: auto;\n transition: 0.4s ease-in-out;\n transform: scale(1);\n aspect-ratio: 16/9;\n object-fit: cover;\n object-position: 50% 0;\n }\n }\n }\n\n .pn-teaser-card__container__content {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n flex: 1 1 100%;\n gap: 3.2rem;\n padding: 2.4rem 2.4rem;\n padding-top: 0;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 2.4rem;\n line-height: 2.64rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n padding-top: 1.6rem;\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 2.24rem;\n margin-bottom: 0;\n }\n\n .pn-teaser-card__container__content__text__container__label {\n display: block;\n margin-bottom: 1.6rem;\n font-weight: 400;\n font-size: 1.2rem;\n line-height: 140%;\n }\n\n .pn-teaser-card__container__content__cta {\n & > pn-button {\n align-self: flex-end;\n width: 100%;\n\n & a:hover {\n text-decoration: none;\n }\n\n & > button,\n & > a {\n & > .pn-button-bg {\n transition: 0.4s ease-in-out;\n }\n }\n\n @media screen and (min-width: $min-width-md) {\n width: fit-content;\n }\n }\n\n .secondary-link--animated {\n font-weight: 500;\n font-size: 1.6rem;\n text-decoration: none;\n color: $blue700;\n\n pn-icon svg {\n transition: 0.3s ease-in-out;\n position: relative;\n left: -0.3rem;\n\n path {\n fill: $blue700;\n }\n }\n\n &[target='_blank']:not(.pn-button):after {\n display: none;\n }\n }\n }\n}\n\n//colors\npn-teaser-card[data-card-color='coral'] {\n & > .pn-teaser-card__container {\n background-color: $coral50;\n }\n}\n\npn-teaser-card[data-card-color='green'] {\n & > .pn-teaser-card__container {\n background-color: $green50;\n }\n}\n\npn-teaser-card[data-card-color='blue'] {\n & > .pn-teaser-card__container {\n background-color: $blue25;\n }\n}\n\npn-teaser-card[data-card-color='blue50'] {\n & > .pn-teaser-card__container {\n background-color: $blue50;\n }\n}\n\npn-teaser-card[data-card-color='blue400'] {\n & > .pn-teaser-card__container {\n background-color: $blue400;\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__heading,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='blue900'] {\n & > .pn-teaser-card__container {\n background-color: $blue900;\n .pn-teaser-card__container__content__text__container__heading {\n color: $coral400;\n }\n\n .pn-teaser-card__container__content__text__container__label,\n .pn-teaser-card__container__content__text__container__preamble,\n .pn-teaser-card__container__content__cta .secondary-link--animated {\n color: $white;\n }\n\n .secondary-link--animated {\n & > pn-icon > svg > path {\n fill: $white;\n }\n }\n }\n}\n\npn-teaser-card[data-card-color='white'] {\n & > .pn-teaser-card__container {\n background-color: $white;\n }\n}\n\n//color override when in a listblock\n.teasercardlistblock {\n .teasercardblock.has-bg {\n background-color: transparent;\n background: transparent;\n }\n}\n\n// variants\n\n.onequarterwidth:not(.familywrapperblock) {\n .pn-teaser-card__container__content__text__container__label {\n @media screen and (min-width: $min-width-xl) {\n margin-bottom: 0.8rem;\n }\n }\n}\n\n.onethirdwidth:not(.familywrapperblock),\n.onequarterwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n }\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n}\n\n.halfwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-lg) {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 4rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 4rem 4rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 3.2rem;\n line-height: 3.52rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-weight: 400;\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n\n @media screen and (min-width: $min-width-xxl) {\n .pn-teaser-card__container__image__container--no-image {\n padding-top: 5.6rem;\n }\n\n .pn-teaser-card__container__content {\n padding: 0 5.6rem 5.6rem;\n }\n }\n }\n}\n\n.fullwidth:not(.familywrapperblock) {\n & pn-teaser-card {\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 400;\n }\n }\n\n .pn-teaser-card__container__image__container--no-image {\n width: auto;\n padding-top: 2.4rem;\n }\n\n @media screen and (min-width: $min-width-md) {\n min-height: 35rem;\n\n .pn-teaser-card__container__content__cta {\n .secondary-link--animated {\n font-weight: 500;\n }\n }\n\n .pn-teaser-card__container {\n flex-direction: row;\n }\n\n .pn-teaser-card__container__content {\n align-self: center;\n gap: 2.4rem;\n padding: 3.2rem 3.2rem 3.2rem 2.4rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-top-left-radius: 2.4rem;\n border-bottom-left-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 0% 50%);\n\n & > picture > img {\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n min-height: 52rem;\n\n .pn-teaser-card__container__content {\n padding: 4rem 4rem 4rem 3.2rem;\n }\n\n .pn-teaser-card__container__content__text__container__heading {\n font-weight: 700;\n font-size: 4.8rem;\n line-height: 5.28rem;\n }\n\n .pn-teaser-card__container__content__text__container__preamble {\n font-size: 2rem;\n line-height: 2.8rem;\n }\n }\n }\n\n pn-teaser-card[data-card-alignment='right'] {\n @media screen and (min-width: $min-width-md) {\n .pn-teaser-card__container {\n flex-direction: row-reverse;\n }\n\n .pn-teaser-card__container__content {\n padding: 3.2rem 2.4rem 3.2rem 3.2rem;\n }\n\n .pn-teaser-card__container__image__container {\n & > [slot='illustration'] {\n border-bottom-right-radius: 2.4rem;\n clip-path: ellipse(100% 100% at 100% 50%);\n }\n }\n }\n\n @media screen and (min-width: $min-width-xl) {\n .pn-teaser-card__container__content {\n padding: 4rem 3.2rem 4rem 4rem;\n }\n }\n }\n}\n\n//effect class\npn-teaser-card.teaser-card--hover-effect {\n &:hover {\n cursor: pointer;\n .pn-teaser-card__container__image__container {\n & [slot='illustration'] {\n & picture > img {\n transform: scale(1.02);\n filter: brightness(0.85);\n }\n }\n }\n\n .secondary-link--animated {\n text-decoration: underline;\n\n pn-icon svg {\n left: 0;\n }\n }\n\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue900;\n }\n }\n }\n\n &[data-card-color='blue900'] {\n pn-button {\n button,\n a {\n .pn-button-bg {\n background-color: $blue400;\n }\n }\n }\n }\n }\n}\n","import { Component, Prop, h, Element, State, Host } from \"@stencil/core\";\nimport { HeadingTag } from '@/globals/HeadingTag';\n\n@Component({\n tag: 'pn-teaser-card',\n styleUrl: 'pn-teaser-card.scss'\n})\nexport class PnTeaserCard {\n @Element() hostElement: HTMLElement;\n \n @Prop() text: string = null;\n @Prop() heading: string = null;\n @Prop() label?: string = null;\n @Prop() headingLevel?: string = 'h3';\n @Prop({ reflect: true }) dataCardColor: string = 'coral';\n @Prop({ reflect: true }) dataCardAlignment: string = 'left';\n\n @State() hasCtaSlotContent: boolean = false;\n @State() hasIllustrationSlot: boolean = true;\n\n componentWillLoad() {\n this.hasCtaSlotContent = !!this.hostElement.querySelector('[slot=\"cta\"]');\n this.hasIllustrationSlot = !!this.hostElement.querySelector('[slot=\"illustration\"]');\n }\n\n render() {\n const labelToCapitals = this.label?.toUpperCase();\n\n return (\n <Host>\n <slot name=\"clickable-block-wrapper\" />\n <div class=\"pn-teaser-card__container\">\n <div class={`pn-teaser-card__container__image__container ${!this.hasIllustrationSlot ? 'pn-teaser-card__container__image__container--no-image' : ''}`}>\n <slot name=\"illustration\" />\n </div>\n <div class=\"pn-teaser-card__container__content\">\n <div class=\"pn-teaser-card__container__content__text__container\">\n {labelToCapitals && <span class=\"pn-teaser-card__container__content__text__container__label\">{labelToCapitals}</span>}\n {this.heading && <HeadingTag level={this.headingLevel} cssClass=\"pn-teaser-card__container__content__text__container__heading\">\n {this.heading}\n </HeadingTag>}\n <p class=\"pn-teaser-card__container__content__text__container__preamble\">{this.text}</p>\n </div>\n {this.hasCtaSlotContent && (\n <div class=\"pn-teaser-card__container__content__cta\">\n <slot name=\"cta\" />\n </div>\n )}\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"6FAAA,MAAMA,EAAkB,w3TACxB,MAAAC,EAAeD,E,MCMFE,EAAY,M,mCAGA,K,aACG,K,WACD,K,kBACO,K,mBACiB,Q,uBACI,O,uBAEf,M,yBACE,I,kCAExC,iBAAAC,GACEC,KAAKC,oBAAsBD,KAAKE,YAAYC,cAAc,gBAC1DH,KAAKI,sBAAwBJ,KAAKE,YAAYC,cAAc,wB,CAG9D,MAAAE,GACE,MAAMC,EAAkBN,KAAKO,OAAOC,cAEpC,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,QAAAE,IAAA,2CAAMC,KAAK,4BACXH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,6BACTJ,EAAA,OAAAE,IAAA,2CAAKE,MAAO,gDAAgDb,KAAKI,oBAAsB,wDAA0D,MAC/IK,EAAA,QAAAE,IAAA,2CAAMC,KAAK,kBAEbH,EAAA,OAAAE,IAAA,2CAAKE,MAAM,sCACTJ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,uDACRP,GAAmBG,EAAA,QAAAE,IAAA,2CAAME,MAAM,8DAA8DP,GAC7FN,KAAKc,SAAWL,EAACM,EAAU,CAAAJ,IAAA,2CAACK,MAAOhB,KAAKiB,aAAcC,SAAS,gEAC3DlB,KAAKc,SAEVL,EAAA,KAAAE,IAAA,2CAAGE,MAAM,iEAAiEb,KAAKmB,OAEhFnB,KAAKC,mBACJQ,EAAA,OAAAE,IAAA,2CAAKE,MAAM,2CACTJ,EAAA,QAAAE,IAAA,2CAAMC,KAAK,W","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"names":["pnQuickCtaCss","PnQuickCtaStyle0","PnQuickCta","render","h","Host","key","class","this","heading","preamble","name"],"sources":["src/components/cta/pn-quick-cta/pn-quick-cta.scss?tag=pn-quick-cta","src/components/cta/pn-quick-cta/pn-quick-cta.tsx"],"sourcesContent":["@import '../../../globals/main.scss';\n\npn-quick-cta {\n width: 100%;\n\n .quick-cta__content {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: flex-end;\n gap: 2.4rem;\n\n width: 100%;\n\n .quick-cta__content__heading {\n padding: 0;\n margin: 0;\n\n font-size: 2.4rem;\n font-weight: 500;\n color: $blue900;\n\n @media screen and (max-width: $min-width-md) {\n display: none;\n }\n\n @media screen and (min-width: $min-width-xxl) {\n font-size: 2.8rem;\n font-weight: 700;\n }\n }\n\n .quick-cta__content__preamble {\n font-weight: 400;\n font-size: 1.6rem;\n line-height: 140%;\n\n padding: 0;\n margin: 0;\n color: $gray900;\n }\n\n [slot='quick-cta-cta'] {\n a {\n white-space: nowrap;\n &:hover {\n text-decoration: none;\n }\n }\n }\n }\n}\n\n//colors\npn-spotlight[data-cta-color='business'] {\n .quick-cta__content__heading {\n color: $coral400;\n }\n .quick-cta__content__preamble {\n color: $blue25;\n }\n}\n\npn-spotlight[data-cta-color='private'] {\n .quick-cta__content__heading,\n .quick-cta__content__preamble {\n color: $white;\n }\n}\n\npn-spotlight[data-cta-color='hybrid'] {\n .quick-cta__content__heading {\n color: $blue700;\n }\n .quick-cta__content__preamble {\n color: $gray900;\n }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'pn-quick-cta',\n styleUrl: 'pn-quick-cta.scss',\n})\nexport class PnQuickCta {\n @Element() hostElement: HTMLElement;\n @Prop() heading: string = null;\n @Prop() preamble: string = null;\n\n render() {\n return (\n <Host>\n <div class=\"quick-cta__content\">\n { this.heading && <h2 class=\"quick-cta__content__heading\">{this.heading}</h2> }\n <p class=\"quick-cta__content__preamble\">{this.preamble}</p>\n <slot name=\"quick-cta-cta\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,krDACtB,MAAAC,EAAeD,E,MCKFE,EAAU,M,sCAEK,K,cACC,I,kCAE3B,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,OAAAE,IAAA,2CAAKC,MAAM,sBACPC,KAAKC,SAAWL,EAAA,MAAAE,IAAA,2CAAIC,MAAM,+BAA+BC,KAAKC,SAChEL,EAAA,KAAAE,IAAA,2CAAGC,MAAM,gCAAgCC,KAAKE,UAC9CN,EAAA,QAAAE,IAAA,2CAAMK,KAAK,mB","ignoreList":[]}