Mike Phares
127634f5ab
Back to .net8.0 api/v4/InfinityQS ApiExplorerSettings Wafer Counter Color Sorting
2 lines
4.2 KiB
JavaScript
2 lines
4.2 KiB
JavaScript
import{r,h as o,a as e,g as i}from"./p-5308bbce.js";const t=':root{--ifx-font-family:"Source Sans 3";font-family:var(--ifx-font-family, sans-serif)}:host{display:inline-flex}.card{position:relative;display:inline-flex;flex-direction:column;word-wrap:break-word;background-color:#FFFFFF;background-clip:border-box;border:1px solid #EEEDED;border-radius:1px;width:350px;height:auto;font-family:var(--ifx-font-family)}.card.linkHovered{border-color:#EEEDED}.card.cardHovered{border-color:#0A8276}.card.noBtns .vertical .lower__body-wrapper{padding-bottom:24px}.card.noBtns .horizontal .lower__body-wrapper{padding-bottom:24px}.card .horizontal{display:flex;flex-direction:row;min-height:218px}.card .horizontal .card-img{flex:1;text-decoration:none}.card .horizontal .card-img.noImage{display:none}.card .horizontal .card-img ::slotted([slot=img]){width:100%;vertical-align:bottom}.card .horizontal .lower__body-wrapper{flex:1;display:grid;grid-template-rows:1fr auto}.card .horizontal .lower__body-wrapper .upper-body{display:flex;flex-direction:column;text-decoration:none;color:#1D1D1D;padding:24px 24px 0px 24px}.card .vertical .upper__body-wrapper{text-decoration:none;color:#1D1D1D}.card .vertical .upper__body-wrapper .card-img{height:190px}.card .vertical .upper__body-wrapper .card-img.noImage{display:none}.card .vertical .upper__body-wrapper .upper-body{padding:24px 24px 0px 24px}.card .vertical .lower__body-wrapper:hover{border-color:#EEEDED}.card.horizontal{flex-direction:row;width:538px}.card.horizontal .card-img{flex:1;order:2}.card.horizontal .card-img ::slotted([slot=img]){width:100%;height:100%;vertical-align:bottom;object-fit:cover}.card.horizontal.left .horizontal .card-img{order:1}.card.horizontal.left .horizontal .lower__body-wrapper{order:2}.card:focus,.card:focus-visible,.focus{outline:none;border-color:#0A8276 !important}';const a=class{constructor(o){r(this,o);this.noBtns=undefined;this.direction="vertical";this.alignment=undefined;this.noImg=undefined;this.href="";this.internalHref="";this.target="_self"}setImgPosition(r){this.alignment=r.detail}handleComponentAdjustment(){const r=this.el.querySelector("ifx-card-image");const o=this.el.querySelector("ifx-card-links");if(!r){this.noImg=true}else this.noImg=false;if(!o){this.noBtns=true}else this.noBtns=false;if(this.href.trim()===""){this.internalHref=undefined}else this.internalHref=this.href}handleClassList(r,o,e){r.classList[o](e)}handleHovering(){const r=this.el.shadowRoot.querySelector(".card");let o=this.el.querySelector("ifx-card-headline");if(this.href){r.addEventListener("mouseover",(e=>{if(e.target.nodeName==="IFX-CARD-LINKS"||e.target.nodeName==="IFX-BUTTON"){this.handleClassList(r,"add","linkHovered")}else{this.handleClassList(r,"add","cardHovered");if(o){o.isHovered=true}}}));r.addEventListener("mouseout",(()=>{if(o){o.isHovered=false}this.handleClassList(r,"remove","cardHovered");this.handleClassList(r,"add","linkHovered")}))}}componentWillLoad(){this.handleComponentAdjustment()}componentDidLoad(){this.handleHovering();this.addEventListenersToHandleCustomFocusState()}addEventListenersToHandleCustomFocusState(){const r=this.el.shadowRoot;if(!r){console.error("element not found");return}const o=r.querySelector(".upper__body-wrapper");if(!o){console.error("upper body wrapper not found");return}r.tabIndex=-1;o.tabIndex=-1}componentWillUpdate(){this.handleComponentAdjustment()}render(){return o(e,null,o("div",{"aria-labelledby":"label",class:`card \n ${this.noBtns?"noBtns":""}\n ${this.direction} \n ${this.alignment}`},this.direction==="horizontal"&&o("div",{class:"horizontal"},o("a",{class:`card-img ${this.noImg?"noImage":""}`,href:this.internalHref},o("slot",{name:"img"})),o("div",{class:"lower__body-wrapper"},o("a",{class:"upper-body",href:this.internalHref},o("slot",null)),o("div",null,o("slot",{name:"buttons"})))),this.direction==="vertical"&&o("div",{class:"vertical"},o("a",{class:"upper__body-wrapper",href:this.internalHref,target:this.target},o("div",{class:`card-img ${this.noImg?"noImage":""}`},o("slot",{name:"img"})),o("div",{class:"upper-body"},o("slot",null))),o("div",{class:"lower__body-wrapper"},o("slot",{name:"buttons"})))))}get el(){return i(this)}};a.style=t;export{a as ifx_card};
|
|
//# sourceMappingURL=p-feb92f33.entry.js.map
|