ngx-wapp-components 2.3.5-alpha.2 → 2.3.5-alpha.3
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.
|
@@ -12071,11 +12071,11 @@ class WMaterialServiceCardComponent {
|
|
|
12071
12071
|
return obj.base64 !== undefined;
|
|
12072
12072
|
}
|
|
12073
12073
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WMaterialServiceCardComponent, deps: [{ token: i1$6.Router }, { token: i2$d.MatIconRegistry }, { token: i3$7.DomSanitizer }, { token: i1$8.DialogService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12074
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: WMaterialServiceCardComponent, isStandalone: false, selector: "w-material-service-card", inputs: { isDevModeActive: "isDevModeActive", wappingServicesTranslations: "wappingServicesTranslations", wappingService: "wappingService", defaultImage: "defaultImage", croppedImageConfiguration: "croppedImageConfiguration", croppedDialogTranslations: "croppedDialogTranslations", onHoverImageTooltip: "onHoverImageTooltip" }, outputs: { cardClicked: "cardClicked", onDefaultImageEvent: "onDefaultImageEvent" }, providers: [DialogService], usesOnChanges: true, ngImport: i0, template: "@if(wappingServiceReady){\r\n<mat-card class=\"service-card\" (click)=\"isDevModeActive ? setImage() : cardOnClick(wappingService)\" [pTooltip]=\"onHoverImageTooltip\" tooltipPosition=\"top\">\r\n <div class=\"service-card-header\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\r\n <!-- @if(wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title\"\r\n fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n tile1\r\n <div [ngClass]=\"{'tile-no-html': !hasHtml(wappingService.tile1)}\" class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n } -->\r\n @if(!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-image-title\">\r\n <div class=\"tile-no-html\" \r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n @if(hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title service-card-image-title-html\">\r\n <div class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n <div class=\"service-card-image\">\r\n <img mat-card-image \r\n [ngClass]=\"{'default-image' : isNoImage}\" \r\n [src]=\"getImage()\">\r\n </div>\r\n </div>\r\n <mat-card-header fxLayout=\"column\">\r\n <div fxLayout=\"row\" class=\"card-header\">\r\n <div class=\"card-header-benefits\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n <div [innerHTML]=\"wappingService.tile2\"></div>\r\n </div>\r\n <div fxflex=\"\" style=\"flex: 1 1 0%; box-sizing: border-box;\"></div>\r\n <!--status-->\r\n @if(wappingService.allowSelect && allowSelectSendGiftCard){\r\n <div class=\"card-header-status-container\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n @if(wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"activated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.activedService }}</span>\r\n </div>\r\n }\r\n @if(!wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"deactivated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.disabledService }}</span>\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n <!--tile3-->\r\n @if(wappingService.tile3){\r\n <div class=\"card-header-description\">\r\n <div [innerHtml]=\"wappingService.tile3\"></div>\r\n </div>\r\n }\r\n </mat-card-header>\r\n</mat-card>\r\n}\r\n", styles: [":host ::ng-deep .service-card{width:380px}.mat-mdc-card{padding:0;background-color:var(--mdc-elevated-card-container-color, transparent)!important}.service-card{cursor:pointer;transition:none!important;box-shadow:1px 2px 8px #1f1f1f14}.service-card-header{position:relative}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-card-image-title-html{position:absolute!important;width:100%!important;min-height:22px!important;top:0!important;z-index:99!important}.service-card-tile1{width:100%;min-height:22px}.service-card-image{font-size:0px;border-top-left-radius:5px;border-top-right-radius:5px;width:100%}.mat-mdc-card-image{width:100%;margin:0;max-height:500px}.mat-mdc-card-image:first-child{margin:0}.mat-mdc-card-content{padding:5px}.mat-mdc-card-header{height:130px!important;padding:16px 15px;background-color:#eee6;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.mat-mdc-card-header .mat-mdc-card-title{margin:0!important}.card-header-benefits{align-items:center;text-transform:uppercase}.card-header-status{display:flex;align-items:center}.card-header-status-icon{margin-right:5px;width:10px}.status{text-transform:uppercase}.card-header-description{margin-top:10px!important;text-align:left;line-height:1.78;overflow-y:auto}.card-header-detail{margin-top:10px;text-align:left;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;-moz-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:pre-line}.tile-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.default-image{padding:68px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i7$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i7$4.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i7$4.MatCardImage, selector: "[mat-card-image], [matCardImage]" }, { kind: "component", type: i2$d.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7$3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7$3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] }); }
|
|
12074
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: WMaterialServiceCardComponent, isStandalone: false, selector: "w-material-service-card", inputs: { isDevModeActive: "isDevModeActive", wappingServicesTranslations: "wappingServicesTranslations", wappingService: "wappingService", defaultImage: "defaultImage", croppedImageConfiguration: "croppedImageConfiguration", croppedDialogTranslations: "croppedDialogTranslations", onHoverImageTooltip: "onHoverImageTooltip" }, outputs: { cardClicked: "cardClicked", onDefaultImageEvent: "onDefaultImageEvent" }, providers: [DialogService], usesOnChanges: true, ngImport: i0, template: "@if(wappingServiceReady){\r\n<mat-card class=\"service-card\" (click)=\"isDevModeActive ? setImage() : cardOnClick(wappingService)\" [pTooltip]=\"onHoverImageTooltip\" tooltipPosition=\"top\">\r\n <div class=\"service-card-header\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\r\n <!-- @if(wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title\"\r\n fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n tile1\r\n <div [ngClass]=\"{'tile-no-html': !hasHtml(wappingService.tile1)}\" class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n } -->\r\n @if(!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-image-title\">\r\n <div class=\"tile-no-html\" \r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n @if(hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title service-card-image-title-html\">\r\n <div class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n <div class=\"service-card-image\">\r\n <img mat-card-image \r\n [ngClass]=\"{'default-image' : isNoImage}\" \r\n [src]=\"getImage()\">\r\n </div>\r\n </div>\r\n <mat-card-header fxLayout=\"column\">\r\n <div fxLayout=\"row\" class=\"card-header\">\r\n <div class=\"card-header-benefits\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n <div class=\"service-card-tile2\" [innerHTML]=\"wappingService.tile2\"></div>\r\n </div>\r\n <div fxflex=\"\" style=\"flex: 1 1 0%; box-sizing: border-box;\"></div>\r\n <!--status-->\r\n @if(wappingService.allowSelect && allowSelectSendGiftCard){\r\n <div class=\"card-header-status-container\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n @if(wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"activated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.activedService }}</span>\r\n </div>\r\n }\r\n @if(!wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"deactivated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.disabledService }}</span>\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n <!--tile3-->\r\n @if(wappingService.tile3){\r\n <div class=\"card-header-description\">\r\n <div [innerHtml]=\"wappingService.tile3\"></div>\r\n </div>\r\n }\r\n </mat-card-header>\r\n</mat-card>\r\n}\r\n", styles: [":host ::ng-deep .service-card{width:380px}.mat-mdc-card{padding:0;background-color:var(--mdc-elevated-card-container-color, transparent)!important}.service-card{cursor:pointer;transition:none!important;box-shadow:1px 2px 8px #1f1f1f14}.service-card-header{position:relative}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-card-image-title-html{position:absolute!important;width:100%!important;min-height:22px!important;top:0!important;z-index:99!important}.service-card-tile1{width:100%;min-height:22px}.service-card-tile2{word-break:break-word}.service-card-image{font-size:0px;border-top-left-radius:5px;border-top-right-radius:5px;width:100%}.mat-mdc-card-image{width:100%;margin:0;max-height:500px}.mat-mdc-card-image:first-child{margin:0}.mat-mdc-card-content{padding:5px}.mat-mdc-card-header{height:130px!important;padding:16px 15px;background-color:#eee6;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.mat-mdc-card-header .mat-mdc-card-title{margin:0!important}.card-header-benefits{align-items:center;text-transform:uppercase}.card-header-status{display:flex;align-items:center}.card-header-status-icon{margin-right:5px;width:10px}.status{text-transform:uppercase}.card-header-description{margin-top:10px!important;text-align:left;line-height:1.78;overflow-y:auto}.card-header-detail{margin-top:10px;text-align:left;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;-moz-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:pre-line}.tile-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.default-image{padding:68px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i7$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i7$4.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i7$4.MatCardImage, selector: "[mat-card-image], [matCardImage]" }, { kind: "component", type: i2$d.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i7$3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i7$3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i7$3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] }); }
|
|
12075
12075
|
}
|
|
12076
12076
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: WMaterialServiceCardComponent, decorators: [{
|
|
12077
12077
|
type: Component,
|
|
12078
|
-
args: [{ selector: 'w-material-service-card', standalone: false, providers: [DialogService], template: "@if(wappingServiceReady){\r\n<mat-card class=\"service-card\" (click)=\"isDevModeActive ? setImage() : cardOnClick(wappingService)\" [pTooltip]=\"onHoverImageTooltip\" tooltipPosition=\"top\">\r\n <div class=\"service-card-header\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\r\n <!-- @if(wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title\"\r\n fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n tile1\r\n <div [ngClass]=\"{'tile-no-html': !hasHtml(wappingService.tile1)}\" class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n } -->\r\n @if(!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-image-title\">\r\n <div class=\"tile-no-html\" \r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n @if(hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title service-card-image-title-html\">\r\n <div class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n <div class=\"service-card-image\">\r\n <img mat-card-image \r\n [ngClass]=\"{'default-image' : isNoImage}\" \r\n [src]=\"getImage()\">\r\n </div>\r\n </div>\r\n <mat-card-header fxLayout=\"column\">\r\n <div fxLayout=\"row\" class=\"card-header\">\r\n <div class=\"card-header-benefits\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n <div [innerHTML]=\"wappingService.tile2\"></div>\r\n </div>\r\n <div fxflex=\"\" style=\"flex: 1 1 0%; box-sizing: border-box;\"></div>\r\n <!--status-->\r\n @if(wappingService.allowSelect && allowSelectSendGiftCard){\r\n <div class=\"card-header-status-container\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n @if(wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"activated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.activedService }}</span>\r\n </div>\r\n }\r\n @if(!wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"deactivated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.disabledService }}</span>\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n <!--tile3-->\r\n @if(wappingService.tile3){\r\n <div class=\"card-header-description\">\r\n <div [innerHtml]=\"wappingService.tile3\"></div>\r\n </div>\r\n }\r\n </mat-card-header>\r\n</mat-card>\r\n}\r\n", styles: [":host ::ng-deep .service-card{width:380px}.mat-mdc-card{padding:0;background-color:var(--mdc-elevated-card-container-color, transparent)!important}.service-card{cursor:pointer;transition:none!important;box-shadow:1px 2px 8px #1f1f1f14}.service-card-header{position:relative}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-card-image-title-html{position:absolute!important;width:100%!important;min-height:22px!important;top:0!important;z-index:99!important}.service-card-tile1{width:100%;min-height:22px}.service-card-image{font-size:0px;border-top-left-radius:5px;border-top-right-radius:5px;width:100%}.mat-mdc-card-image{width:100%;margin:0;max-height:500px}.mat-mdc-card-image:first-child{margin:0}.mat-mdc-card-content{padding:5px}.mat-mdc-card-header{height:130px!important;padding:16px 15px;background-color:#eee6;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.mat-mdc-card-header .mat-mdc-card-title{margin:0!important}.card-header-benefits{align-items:center;text-transform:uppercase}.card-header-status{display:flex;align-items:center}.card-header-status-icon{margin-right:5px;width:10px}.status{text-transform:uppercase}.card-header-description{margin-top:10px!important;text-align:left;line-height:1.78;overflow-y:auto}.card-header-detail{margin-top:10px;text-align:left;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;-moz-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:pre-line}.tile-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.default-image{padding:68px}\n"] }]
|
|
12078
|
+
args: [{ selector: 'w-material-service-card', standalone: false, providers: [DialogService], template: "@if(wappingServiceReady){\r\n<mat-card class=\"service-card\" (click)=\"isDevModeActive ? setImage() : cardOnClick(wappingService)\" [pTooltip]=\"onHoverImageTooltip\" tooltipPosition=\"top\">\r\n <div class=\"service-card-header\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\r\n <!-- @if(wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title\"\r\n fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n tile1\r\n <div [ngClass]=\"{'tile-no-html': !hasHtml(wappingService.tile1)}\" class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n } -->\r\n @if(!hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-image-title\">\r\n <div class=\"tile-no-html\" \r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n @if(hasHtml(wappingService.tile1) && wappingService.tile1 && wappingService.tile1 != ''){\r\n <div class=\"service-card-image-title service-card-image-title-html\">\r\n <div class=\"service-card-tile1\"\r\n [innerHtml]=\"wappingService.tile1\"></div>\r\n </div>\r\n }\r\n <div class=\"service-card-image\">\r\n <img mat-card-image \r\n [ngClass]=\"{'default-image' : isNoImage}\" \r\n [src]=\"getImage()\">\r\n </div>\r\n </div>\r\n <mat-card-header fxLayout=\"column\">\r\n <div fxLayout=\"row\" class=\"card-header\">\r\n <div class=\"card-header-benefits\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n <div class=\"service-card-tile2\" [innerHTML]=\"wappingService.tile2\"></div>\r\n </div>\r\n <div fxflex=\"\" style=\"flex: 1 1 0%; box-sizing: border-box;\"></div>\r\n <!--status-->\r\n @if(wappingService.allowSelect && allowSelectSendGiftCard){\r\n <div class=\"card-header-status-container\" fxLayout=\"row\" fxLayoutGap=\"5px\">\r\n @if(wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"activated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.activedService }}</span>\r\n </div>\r\n }\r\n @if(!wappingService.active){\r\n <div class=\"card-header-status\">\r\n <mat-icon class=\"card-header-status-icon\" svgIcon=\"deactivated\"></mat-icon>\r\n <span class=\"status\">{{ wappingTranslations.disabledService }}</span>\r\n </div>\r\n }\r\n </div>\r\n }\r\n </div>\r\n <!--tile3-->\r\n @if(wappingService.tile3){\r\n <div class=\"card-header-description\">\r\n <div [innerHtml]=\"wappingService.tile3\"></div>\r\n </div>\r\n }\r\n </mat-card-header>\r\n</mat-card>\r\n}\r\n", styles: [":host ::ng-deep .service-card{width:380px}.mat-mdc-card{padding:0;background-color:var(--mdc-elevated-card-container-color, transparent)!important}.service-card{cursor:pointer;transition:none!important;box-shadow:1px 2px 8px #1f1f1f14}.service-card-header{position:relative}.service-image-title{position:absolute;top:0!important;right:0!important;left:0!important;z-index:2;margin:0 60px!important;min-height:22px!important;border-radius:0 0 4.3118px 4.3118px!important;background-color:#0e0c0c;color:#fff;display:flex;justify-content:center;align-items:center;padding:4px}.service-card-image-title-html{position:absolute!important;width:100%!important;min-height:22px!important;top:0!important;z-index:99!important}.service-card-tile1{width:100%;min-height:22px}.service-card-tile2{word-break:break-word}.service-card-image{font-size:0px;border-top-left-radius:5px;border-top-right-radius:5px;width:100%}.mat-mdc-card-image{width:100%;margin:0;max-height:500px}.mat-mdc-card-image:first-child{margin:0}.mat-mdc-card-content{padding:5px}.mat-mdc-card-header{height:130px!important;padding:16px 15px;background-color:#eee6;border-bottom-left-radius:5px;border-bottom-right-radius:5px}.mat-mdc-card-header .mat-mdc-card-title{margin:0!important}.card-header-benefits{align-items:center;text-transform:uppercase}.card-header-status{display:flex;align-items:center}.card-header-status-icon{margin-right:5px;width:10px}.status{text-transform:uppercase}.card-header-description{margin-top:10px!important;text-align:left;line-height:1.78;overflow-y:auto}.card-header-detail{margin-top:10px;text-align:left;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;-moz-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:pre-line}.tile-no-html{justify-content:center!important;align-items:center!important;display:flex!important;text-align:center!important}.default-image{padding:68px}\n"] }]
|
|
12079
12079
|
}], ctorParameters: () => [{ type: i1$6.Router }, { type: i2$d.MatIconRegistry }, { type: i3$7.DomSanitizer }, { type: i1$8.DialogService }], propDecorators: { isDevModeActive: [{
|
|
12080
12080
|
type: Input
|
|
12081
12081
|
}], wappingServicesTranslations: [{
|