{"version":3,"names":["kdxComparisonCardCss","StComparisonCard","guid","componentWillLoad","this","ctaPrimarySpeedbump","ctaPrimaryTarget","toLowerCase","ctaPrimaryRel","ctaSecondarySpeedbump","ctaSecondaryTarget","ctaSecondaryRel","render","h","classes","heading","ctaPrimaryText","ctaPrimaryHref","ctaPrimaryAriaLabel","ctaPrimaryIcon","ctaPrimaryStyle","ctaSecondaryText","ctaSecondaryHref","ctaSecondaryAriaLabel","ctaSecondaryStyle","class"],"sources":["src/layouts/kdx-comparison-cards/partials/kdx-comparison-card.scss?tag=kdx-comparison-card","src/layouts/kdx-comparison-cards/partials/kdx-comparison-card.tsx"],"sourcesContent":["kdx-comparison-card { \r\n    height: 100%; \r\n\r\n    kdx-card { \r\n        height: 100%; \r\n\r\n        &.hydrated { height: 100%; }\r\n    }\r\n}\r\n.kdx-card.kdx-comparison-card {    \r\n    margin: 10px 0;\r\n    padding: 20px 30px;\r\n    @include text-size(13);\r\n    box-shadow: 0 5px 18px rgba(0, 0, 0, .12);\r\n    border: none;\r\n    border-radius: 2px;\r\n/*    background: #FFF;*/\r\n    @include text-size(14);\r\n    @include line-height(22);\r\n\r\n    p {\r\n        margin-bottom: 18px;\r\n        text-align: center;\r\n    }\r\n\r\n    .card-title {\r\n        color: $compareCard_heading;\r\n        position: relative;\r\n        text-align: center;\r\n        @include text-size(21);\r\n        @include line-height(24);\r\n        padding-bottom: 8px;\r\n        margin: 0 0 24px 0;\r\n\r\n        &::after {\r\n            content: '';\r\n            width: 100%;\r\n            max-width: 65px;\r\n            height: 3px;\r\n            background: $compareCard_headingBorder;\r\n            position: absolute;\r\n            top: 100%;\r\n            left: 50%;\r\n            transform: translateX(-50%);\r\n        }\r\n    }\r\n\r\n    .sub-layer{\r\n        margin: 30px 0px;\r\n        padding: 0px 30px;\r\n\r\n        h3{\r\n            text-align: left;\r\n            border-bottom: solid 1px $quarternary;\r\n            margin: 0px -30px 20px;\r\n            padding: 0 5px 10px;\r\n            @include text-size(16);\r\n        }\r\n\r\n        ul {\r\n\r\n            height: fit-content;\r\n            li {\r\n                list-style: none;\r\n                padding: 0 0 20px 0 !important;\r\n\r\n                &:before {\r\n                    left: -25px !important;\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    .product-content {\r\n        ul {\r\n            padding: 0 0 0 30px;\r\n            margin: 0;\r\n            text-align: left;\r\n\r\n            li {\r\n                position: relative;\r\n                list-style: disc;\r\n                padding: 0 0 20px 4px;\r\n\r\n                &::before {\r\n                    top: 2px;\r\n                    left: 0;\r\n                }\r\n            }\r\n        }\r\n    }\r\n\r\n    .card-body {\r\n        padding: 0;\r\n    }\r\n\r\n    .card-footer {\r\n        text-align: center;\r\n        background: none;\r\n        border: none;\r\n        padding: $gutter-def 0 0;\r\n\r\n        &.ctas {\r\n            display: flex;\r\n            flex-direction: column;\r\n            min-height: 1px;\r\n            height: auto;\r\n            align-items: center;\r\n\r\n            a {\r\n                margin-bottom: 16px;\r\n                \r\n                &.btn { width: 100%; }\r\n                &:last-child { margin-bottom: 0; }\r\n            }\r\n        }        \r\n    }     \r\n}\r\n\r\n\r\n\r\n@include media-breakpoint-down(lg) {\r\n    .kdx-card.kdx-comparison-card { margin: 0 10px; }    \r\n}\r\n","import { Component, h, ComponentInterface, State, Prop } from '@stencil/core';\r\nimport { guid } from 'utils';\r\n\r\n\r\n@Component({\r\n\ttag: 'kdx-comparison-card',\r\n\tstyleUrl: 'kdx-comparison-card.scss',\r\n\tshadow: false\r\n})\r\nexport class StComparisonCard implements ComponentInterface {\r\n\t@State() guid: string = guid();\r\n\r\n\t@Prop() heading: string;\r\n\r\n\t@Prop() ctaPrimaryText: string;\r\n\t@Prop() ctaPrimaryHref: string;\r\n\t@Prop() ctaPrimaryAriaLabel: string;\r\n\t@Prop() ctaPrimaryStyle: string = \"btn btn-primary\";\r\n\t@Prop({mutable: true}) ctaPrimaryTarget: string;\r\n\t@Prop() ctaPrimaryIcon: string = 'arrow-circle-right';\r\n\t@Prop() ctaPrimarySpeedbump: boolean;\r\n\t@Prop({\r\n\t\tmutable: true,\r\n\t\treflect: true\r\n\t}) ctaPrimaryRel;\r\n\r\n\t@Prop() ctaSecondaryText: string;\r\n\t@Prop() ctaSecondaryHref: string;\r\n\t@Prop() ctaSecondaryAriaLabel: string;\r\n\t@Prop() ctaSecondaryStyle: string = \"btn btn-secondary\";\r\n\t@Prop({mutable: true}) ctaSecondaryTarget: string;\r\n\t@Prop() ctaSecondarySpeedbump: boolean;\r\n\t@Prop({\r\n\t\tmutable: true,\r\n\t\treflect: true\r\n\t}) ctaSecondaryRel;\r\n\r\n\tcomponentWillLoad() {\r\n\t\tif (this.ctaPrimarySpeedbump || this.ctaPrimaryTarget && (this.ctaPrimaryTarget.toLowerCase() === '_blank')) {\r\n\t\t\tthis.ctaPrimaryTarget = '_blank';\r\n\t\t\tthis.ctaPrimaryRel = 'noopener';\r\n\t\t}\r\n\r\n\t\tif (this.ctaSecondarySpeedbump || this.ctaPrimaryTarget && (this.ctaSecondaryTarget.toLowerCase() === '_blank')) {\r\n\t\t\tthis.ctaSecondaryTarget = '_blank';\r\n\t\t\tthis.ctaSecondaryRel = 'noopener';\r\n\t\t}\r\n\t}\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t<kdx-card classes=\"kdx-comparison-card\"\r\n\t\t\theading={this.heading}\r\n\t\t\tcta-primary-text={this.ctaPrimaryText}\r\n\t\t\tcta-primary-href={this.ctaPrimaryHref}\r\n\t\t\tcta-primary-aria-label={this.ctaPrimaryAriaLabel}\r\n\t\t\tcta-primary-icon={this.ctaPrimaryIcon}\r\n\t\t\tcta-primary-style={this.ctaPrimaryStyle}\r\n\t\t\tcta-primary-target={this.ctaPrimaryTarget}\r\n\t\t\tcta-primary-speedbump={this.ctaPrimarySpeedbump}\r\n\t\t\tcta-secondary-text={this.ctaSecondaryText}\r\n\t\t\tcta-secondary-href={this.ctaSecondaryHref}\r\n\t\t\tcta-secondary-aria-label={this.ctaSecondaryAriaLabel}\r\n\t\t\tcta-secondary-style={this.ctaSecondaryStyle}\r\n\t\t\tcta-secondary-target={this.ctaSecondaryTarget}\r\n\t\t\tcta-secondary-speedbump={this.ctaSecondarySpeedbump}\r\n\t\t>\r\n\t\t\t<div class=\"product-content\">\r\n\t\t\t\t<slot />\r\n\t\t\t</div>\r\n\t\t</kdx-card>\r\n\t\t);\r\n\t}\r\n}"],"mappings":"+EAAA,MAAMA,EAAuB,yqF,MCShBC,EAAgB,M,mCACJC,I,2IAOU,kB,oDAED,qB,4LAUG,oB,sGAQpC,iBAAAC,GACC,GAAIC,KAAKC,qBAAuBD,KAAKE,kBAAqBF,KAAKE,iBAAiBC,gBAAkB,SAAW,CAC5GH,KAAKE,iBAAmB,SACxBF,KAAKI,cAAgB,U,CAGtB,GAAIJ,KAAKK,uBAAyBL,KAAKE,kBAAqBF,KAAKM,mBAAmBH,gBAAkB,SAAW,CAChHH,KAAKM,mBAAqB,SAC1BN,KAAKO,gBAAkB,U,EAIzB,MAAAC,GACC,OACAC,EAAA,YAAUC,QAAQ,sBACjBC,QAASX,KAAKW,QAAO,mBACHX,KAAKY,eAAc,mBACnBZ,KAAKa,eAAc,yBACbb,KAAKc,oBAAmB,mBAC9Bd,KAAKe,eAAc,oBAClBf,KAAKgB,gBAAe,qBACnBhB,KAAKE,iBAAgB,wBAClBF,KAAKC,oBAAmB,qBAC3BD,KAAKiB,iBAAgB,qBACrBjB,KAAKkB,iBAAgB,2BACflB,KAAKmB,sBAAqB,sBAC/BnB,KAAKoB,kBAAiB,uBACrBpB,KAAKM,mBAAkB,0BACpBN,KAAKK,uBAE9BI,EAAA,OAAKY,MAAM,mBACVZ,EAAA,c"}