{"version":3,"names":["kdxTeamCardCss","StTeamCard","guid","componentDidRender","globalThis","imageLoader","initialize","render","h","class","this","classes","style","backgroundImage","imgSrc","role","imgAlt","assetPath"],"sources":["src/components/cards/kdx-team-card/kdx-team-card.scss?tag=kdx-team-card","src/components/cards/kdx-team-card/kdx-team-card.tsx"],"sourcesContent":[".kdx-team-card {\r\n\tborder: none;\r\n\tbox-shadow: none;\r\n\tpadding: 14px 0;\r\n\ttext-align: center;\r\n\r\n\t&.card { \r\n\t\tbox-shadow: none;\r\n\t\tborder: none;\r\n\t}\t\r\n\t.card-img-top {\r\n\t\tposition: relative;\r\n\t\tmin-height: 142px;\r\n\t\tborder-radius: 0;\r\n\r\n\t\t.card-img {\r\n\t\t\tposition: absolute;\r\n\t\t\theight: 142px;\r\n\t\t\twidth: 142px;\r\n\t\t\tbackground-size: cover;\r\n\t\t\tbackground-repeat: no-repeat;\r\n\t\t\tborder-radius: 100%;\r\n\t\t\tleft: 50%;\r\n\t\t\ttop: 50%;\r\n\t\t\ttransform: translate(-50%, -50%);\r\n\t\t}\r\n\t}\r\n\t.card-content {\r\n\t\t.card-body {\r\n\t\t\t// text-align: center;\r\n\r\n\t\t\t.tm-name {\r\n\t\t\t\tcolor:#000;\r\n\t\t\t\t@include text-size(36);\r\n\t\t\t\t@include line-height(41);\r\n\t\t\t}\r\n\t\t\t.tm-role {\r\n\t\t\t\t@include text-size(13);\r\n\t\t\t\t@include line-height(16);\r\n\t\t\t\tfont-style: italic;\r\n\t\t\t\tcolor: #606060;\t\t\t\t\r\n\t\t\t}\t\t\t\r\n\t\t\t.detail-bio {\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tflex-direction: column;\r\n\t\t\t\talign-items: flex-start;\r\n\t\t\t}\r\n\t\t\th3 {\r\n\t\t\t\t@include text-size(20);\r\n\t\t\t\tcolor: $teamMemberTitleColor;\r\n\t\t\t\tline-height: 24px;\r\n\t\t\t\tfont-weight: 700;\r\n\t\t\t\tmargin-bottom: 8px;\r\n\t\t\t}\r\n\t\t\th4 {\r\n\t\t\t\t@include text-size(13);\r\n\t\t\t\t@include line-height(16);\r\n\t\t\t\tfont-style: italic;\r\n\t\t\t\tfont-family: $font-family-primary;\r\n\t\t\t\tcolor: #606060;\r\n\t\t\t\tfont-weight: 400;\r\n\t\t\t}\r\n\t\t\tp {\r\n\t\t\t\tcolor: $gray-dark;\r\n\t\t\t\t@include text-size(12);\r\n\t\t\t\t@include line-height(18);\r\n\t\t\t\tmargin: 0 0 16px 0;\r\n\t\t\t\tpadding: 0px;\r\n\t\t\t\tmax-width: 100%;\r\n\t\t\t\tfont-weight: 400;\r\n\t\t\t}\r\n\t\t\t.card-footer {\r\n\t\t\t\tborder-radius: 0;\r\n\t\t\t\tborder: none;\r\n\t\t\t\tpadding: 0px;\r\n\r\n\t\t\t\ta {\r\n\t\t\t\t\tmargin-right: 0;\r\n\t\t\t\t\tbackground-color: transparent!important;\r\n\t\t\t\t\tborder: none;\r\n\t\t\t\t\tcolor: $teamMemberReadBioColor;\r\n\t\t\t\t\t@include text-size(15);\r\n\t\t\t\t\t@include line-height(19);\r\n\t\t\t\t\tfont-weight: 700;\r\n\t\t\t\t\tfont-family: $font-family-secondary;\r\n\t\t\t\t\ttext-decoration: none;\r\n\t\t\t\t\ttransition: all 350ms linear;\r\n\t\t\t\t\tposition: relative;\r\n\r\n\t\t\t\t\t&:after {\r\n\t\t\t\t\t\tcontent: '';\r\n\t\t\t\t\t\tbackground: currentColor;\r\n\t\t\t\t\t\tposition: absolute;\r\n\t\t\t\t\t\ttop: 100%;\r\n\t\t\t\t\t\tleft: 0;\r\n\t\t\t\t\t\twidth: 100%;\r\n\t\t\t\t\t\theight: 1px;\r\n\t\t\t\t\t\topacity: 0;\r\n\t\t\t\t\t\ttransition: opacity 350ms linear;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\tsvg {\r\n\t\t\t\t\t\t@include svg-format(13px, 13px, currentColor);\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\ttransition: all 350ms linear;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\t&:hover, &:focus {\r\n\t\t\t\t\t\tcolor: #000;\r\n\r\n\t\t\t\t\t\t&:after { opacity: 1; }\r\n\t\t\t\t\t\tsvg {\r\n\t\t\t\t\t\t\tfill: $gray-dark;\r\n\t\t\t\t\t\t\ttransform: translateX(7px);\r\n\t\t\t\t\t\t\ttransition: all 350ms linear;\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t\t\r\n\t\t\t}\r\n\r\n\t\t\t.icon-row {\r\n\t\t\t\tmargin-top: 13px;\r\n\t\t\t\tdisplay: flex;\r\n\t\t\t\tposition: relative;\r\n\t\t\t\tjustify-content: center;\r\n\r\n\t\t\t\t.icon {\r\n\t\t\t\t\tposition: relative;\r\n\t\t\t\t\theight: 45px;\r\n\t\t\t\t\twidth: 45px;\r\n\t\t\t\t\tborder-radius: 100%;\r\n\t\t\t\t\tborder: 1px solid #DEDEDE;\r\n\t\t\t\t\tmargin: 0px 5px;\r\n\t\t\t\t\tbox-shadow: none;\r\n\t\t\t\t\ttransition: all 350ms linear;\r\n\r\n\t\t\t\t\t.tm-icon svg {\r\n\t\t\t\t\t\tfill: $teamMemberSocialIcons;\r\n\t\t\t\t\t\tcolor: #202B3C;\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t\tsvg {\r\n\t\t\t\t\t\tposition: absolute;\r\n\t\t\t\t\t\ttop: 50%;\r\n\t\t\t\t\t\tleft: 50%;\r\n\t\t\t\t\t\ttransform: translate(-50%, -50%);\r\n\t\t\t\t\t\t@include svg-format(15px, 19px, currentColor);\r\n\t\t\t\t\t\tcolor: $teamMemberSocialIcons;\r\n\t\t\t\t\t\ttransition: all 350ms linear;\r\n\t\t\t\t\t}\r\n\r\n\t\t\t\t\t&:hover, &:focus {\r\n\t\t\t\t\t\tbackground: $teamMemberSocialIconsHover;\r\n\t\t\t\t\t\tbox-shadow: $teamMemberSocialIconsBoxShadow;\r\n\t\t\t\t\t\ttransform: translateY(-7px);\r\n\t\t\t\t\t\t@include transitionDefault(transform);\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t\tsvg {\r\n\t\t\t\t\t\t\tcolor: #FFF;\r\n\t\t\t\t\t\t\tfill: #FFF;\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n\r\n\t&.hero-card {\r\n\t\tflex-direction: row;\r\n\r\n\t\t.card-img-top {\r\n\t\t\tmax-width: 172px;\r\n\t\t\tmin-height: 172px;\r\n\r\n\t\t\t.card-img {\r\n\t\t\t\theight: 172px;\r\n\t\t\t\twidth: 172px;\r\n\t\t\t}\r\n\t\t}\r\n\t\t.card-content {\r\n\t\t\talign-items: flex-start;\r\n\r\n\t\t\t.card-body {\r\n\t\t\t\tpadding-left: 30px;\r\n\t\t\t\ttext-align: left;\r\n\r\n\t\t\t\t.tm-name {\r\n\t\t\t\t\t@include text-size(42);\r\n\t\t\t\t\t@include line-height(46);\t\t\t\t\t\r\n\t\t\t\t\tcolor: $teamBioHeroName;\t\t\t\t\t\r\n\t\t\t\t\tmargin: 0 0 8px 0;\r\n\t\t\t\t}\r\n\t\t\t\t.tm-role {\r\n\t\t\t\t\t@include text-size(21);\r\n\t\t\t\t\t@include line-height(32);\r\n\t\t\t\t\tcolor: $teamBioHeroRole;\r\n\t\t\t\t\tmargin: 0 0 16px 0;\r\n\t\t\t\t}\r\n\t\t\t\t.icon-row {\r\n\t\t\t\t\tjustify-content: flex-start;\r\n\t\t\t\t\talign-items: center;\r\n\r\n\t\t\t\t\t.tm-circle {\r\n\t\t\t\t\t\tbackground: #FFF;\r\n\t\t\t\t\t\tborder: 1px solid $gray-lite;\r\n\r\n\t\t\t\t\t\t&:hover, &:focus {\r\n\t\t\t\t\t\t\tbackground: $teamBioHeroSocialIconsHoverBg;\r\n\t\t\t\t\t\t\tbox-shadow: $teamMemberSocialIconsBoxShadow;\r\n\t\t\t\t\t\t\tborder: 1px solid $teamBioHeroSocialIconsHoverBg;\r\n\r\n\t\t\t\t\t\t\tsvg {\r\n\t\t\t\t\t\t\t\tfill: $teamBioHeroSocialIconsHoverSvg;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t}\r\n\t\t\t\t\t}\t\t\t\t\t\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}\r\n\t}\t\r\n}\r\n\r\n.col .kdx-team-card {\r\n\tdisplay: block;\r\n\theight: 100%;\r\n\r\n\t.kdx-team-card {\r\n\t\theight: 100%;\r\n\t}\r\n}\r\n\r\n\r\n\r\n\r\n\r\n\r\n@include media-breakpoint-down(lg) {\r\n\t.kdx-team-card {\r\n\t\tpadding: 5px;\r\n\r\n\t\t.card-img-top {\r\n\t\t\tmin-height: 100px;\r\n\r\n\t\t\t.card-img {\r\n\t\t\t\theight: 100px;\r\n\t\t\t\twidth: 100px;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t&.hero-card {\r\n\t\t\tflex-direction: column;\r\n\t\r\n\t\t\t.card-img-top {\r\n\t\t\t\tmax-width: 100%;\r\n\t\r\n\t\t\t\t.card-img {\r\n\t\t\t\t\theight: 172px;\r\n\t\t\t\t\twidth: 172px;\r\n\t\t\t\t}\r\n\t\t\t}\t\r\n\t\t\t.card-content {\r\n\t\t\t\talign-items: center;\r\n\t\r\n\t\t\t\t.card-body {\r\n\t\t\t\t\ttext-align: center;\t\t\t\t\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t.tm-name {\r\n\t\t\t\t\t\t@include text-size(32);\r\n\t\t\t\t\t\tline-height: 37px;\r\n\t\t\t\t\t}\t\r\n\t\t\t\t\t.tm-role {\r\n\t\t\t\t\t\t@include text-size(18);\r\n\t\t\t\t\t\tline-height: 29px;\r\n\t\t\t\t\t}\t\r\n\t\t\t\t\t.icon-row {\r\n\t\t\t\t\t\tjustify-content: center;\r\n\t\t\t\t\t\tflex-wrap: wrap;\r\n\t\t\t\t\t\tmax-width: 200px;\r\n\t\t\t\t\t\tmargin: 0 auto;\t\r\n\t\t\t\t\t\t\r\n\t\t\t\t\t}\r\n\t\t\t\t}\t\t\t\t\r\n\t\t\t}\r\n\t\t}\r\n\t}\r\n}","import { Component, ComponentInterface, h, Element, State, Prop } from '@stencil/core';\r\nimport { guid } from 'utils';\r\n\r\ndeclare const assetPath;\r\n\r\n@Component({\r\n\ttag: 'kdx-team-card',\r\n\tstyleUrl: 'kdx-team-card.scss',\r\n\tshadow: false,\r\n})\r\nexport class StTeamCard implements ComponentInterface {\r\n\r\n\t@Element() root: HTMLElement;\r\n\r\n\t@State() guid: string = guid();\r\n\t@State() links: Array<any> = [];\r\n\r\n\t@Prop() classes: string;\r\n\t@Prop() imgSrc: string;\r\n\t@Prop() imgAlt: string;\r\n\r\n\tcomponentDidRender() {\r\n\t\tglobalThis.imageLoader?.initialize();\t\t\t\r\n\t}\r\n\r\n\trender() {\r\n\t\treturn (\r\n\t\t<div class={`kdx-team-card card ${this.classes ?? ''}`}>\r\n\t\t\t{(this.imgSrc) && (\r\n\t\t\t<div class=\"card-img-top\">\r\n\t\t\t\t{(this.imgSrc) ? (\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tclass=\"card-img lazy-load-bg\"\r\n\t\t\t\t\t\tstyle={{ backgroundImage: `url(${this.imgSrc})` }}\r\n\t\t\t\t\t\trole=\"img\"\r\n\t\t\t\t\t\taria-label={this.imgAlt}>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t) : (\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tclass=\"card-img lazy-load-bg\"\r\n\t\t\t\t\t\tstyle={{ backgroundImage: `url(${assetPath}/img/logo-bg-repeater-blk@2x.png)` }}\r\n\t\t\t\t\t\trole=\"presentation\"\r\n\t\t\t\t\t\taria-label={this.imgAlt}>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t)}\r\n\t\t\t</div>\r\n\t\t\t)}\r\n\t\t\t<div class=\"card-content\">\r\n\t\t\t\t<div class=\"card-body detail-bio\">\r\n\t\t\t\t\t<slot />\r\n\t\t\t\t</div>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t\t);\r\n\t}\r\n\r\n}\r\n"],"mappings":"iFAAA,MAAMA,EAAiB,myM,MCUVC,EAAU,M,mCAIEC,I,WACK,G,mEAM7B,kBAAAC,GACCC,WAAWC,aAAaC,Y,CAGzB,MAAAC,GACC,OACAC,EAAA,OAAKC,MAAO,sBAAsBC,KAAKC,SAAW,MAC/CD,KAAW,QACbF,EAAA,OAAKC,MAAM,gBACRC,KAAW,OACZF,EAAA,OACCC,MAAM,wBACNG,MAAO,CAAEC,gBAAiB,OAAOH,KAAKI,WACtCC,KAAK,MAAK,aACEL,KAAKM,SAGlBR,EAAA,OACCC,MAAM,wBACNG,MAAO,CAAEC,gBAAiB,OAAOI,8CACjCF,KAAK,eAAc,aACPL,KAAKM,UAKpBR,EAAA,OAAKC,MAAM,gBACVD,EAAA,OAAKC,MAAM,wBACVD,EAAA,e"}