@sunbird-cb/consumption 0.1.23-cbrelease-4.8.27-multilingual → 0.1.25-cbrelease-4.8.27-multilingual
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.
- package/esm2022/lib/_common/cards/card-assessment/card-assessment/card-assessment.component.mjs +3 -3
- package/esm2022/lib/_common/cards/card-portrait/card-portrait.component.mjs +3 -3
- package/esm2022/lib/_common/dialog-components/certificate-dialog/certificate-dialog.component.mjs +2 -2
- package/fesm2022/sunbird-cb-consumption.mjs +6 -6
- package/fesm2022/sunbird-cb-consumption.mjs.map +1 -1
- package/package.json +1 -1
- package/sunbird-cb-consumption-0.1.25-cbrelease-4.8.27-multilingual.tgz +0 -0
|
@@ -6480,11 +6480,11 @@ class CardPortraitComponent {
|
|
|
6480
6480
|
this.contSvc.setReleventNotReleventData({ isRelevent: false, widgetData: this.widgetData });
|
|
6481
6481
|
}
|
|
6482
6482
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardPortraitComponent, deps: [{ token: i1$4.MatLegacySnackBar }, { token: i2$1.TranslateService }, { token: MultilingualTranslationsService }, { token: i2.ConfigurationsService }, { token: WidgetContentLibService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6483
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardPortraitComponent, selector: "sb-uic-card-portrait", inputs: { widgetData: "widgetData", isLiveOrMarkForDeletion: "isLiveOrMarkForDeletion", showIntranetContent: "showIntranetContent", isIntranetAllowedSettings: "isIntranetAllowedSettings", isCardLoading: "isCardLoading", cbPlanMapData: "cbPlanMapData" }, outputs: { contentData: "contentData" }, ngImport: i0, template: "<ng-container *ngIf=\"!isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove cursor-pointer {{widgetData?.cardCustomeClass}}\" [ngClass]=\"{\n greyOut:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\n <div class=\"display-contents\" [ngClass]=\"{\n disableClick:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n }\">\n <ng-container *ngIf=\"widgetData.content\">\n <a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\"\n role=\"link\" i18n-aria-label>\n <ng-container *ngIf=\"!isCardFlipped\">\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\n matTooltip=\"Available only in Company's network\"\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\n <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\n (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\n <mat-icon>flip_to_back</mat-icon>\n </button>\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container *ngIf=\"widgetData.content.posterImage && !widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"widgetData.content.posterImage && widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"!widgetData.content.posterImage\">\n <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n <img mat-card-image [src]=\"widgetData.content.appIcon | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-template #defaultImg>\n <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\"\n [alt]=\"widgetData.content.name\" />\n </ng-template>\n </ng-container>\n <div class=\"source-div\" style=\"display: none;\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div>\n <ng-container *ngIf=\"widgetData?.content?.cbPlanEndDate\">\n <div class=\"cbp-mark\">\n <span>{{widgetData?.content?.cbPlanEndDate | date: 'd MMM, y'}}</span>\n </div>\n </ng-container>\n <!-- <ng-container *ngIf=\"widgetData?.content?.endDate\">\n <div class=\"cbp-mark\">\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger\">Over due</p>\n </div>\n </ng-container> -->\n <ng-container *ngIf=\"cbPlanMapData && cbPlanMapData[widgetData?.content?.identifier] && cbPlanMapData[widgetData?.content?.identifier]?.contentStatus < 2\">\n <ng-container [ngTemplateOutlet]=\"cbpPlan\" [ngTemplateOutletContext]=\"{data: {\n cbpData: cbPlanMapData[widgetData?.content?.identifier]\n }}\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.isApar\">\n <div class=\"cbp-mark right-0 rounded-bottom\">\n <p class=\"cbp-success apar-flag\">APAR</p>\n </div>\n </ng-container>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.duration > 0 && !(widgetData?.content?.programDuration > 0)\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{ (widgetData?.content?.duration || 120)| pipeDurationTransform: 'hms' }}\n </span>\n </div>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.programDuration > 0\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{widgetData?.content?.programDuration}} {{widgetData?.content?.programDuration === 1 ? 'day' : 'days'}}\n </span>\n </div>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end course_v2\">\n <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.primaryCategory\"\n class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData.content?.primaryCategory==='Course Unit'\n ?'Module'\n :widgetData.content?.courseCategory ? widgetData.content?.courseCategory: widgetData.content?.primaryCategory\">\n\n </sb-uic-display-content-type>\n </div>\n </div>\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\n class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient nodtranslate\">\n {{ widgetData.content.name }}\n </div>\n <div class=\"flex w-full flex-wrap flex-middle\">\n <!-- <div class=\"course_logo_box\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div> -->\n <div class=\"course_logo_box\">\n <img \n [src]=\"widgetData?.sakshamAIGenerated ? widgetData.content.creatorLogo : (widgetData.content.creatorLogo | pipePublicURL)\" \n class=\"source-icon\" \n [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier\" />\n </div>\n <!-- <span class=\"org-text\">{{'cardcontentv2.by' | translate}} -->\n <span class=\"org-text nodtranslate\">By {{ (widgetData?.content?.organisation && widgetData?.content?.organisation[0]) ? widgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}</span>\n </div>\n <div class=\"mt-2\">\n <sb-uic-available-languages [content]=\"widgetData?.content\"></sb-uic-available-languages>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\" *ngIf=\"!widgetData?.sakshamAIGenerated\">\n <div class=\"flex flex-middle\" *ngIf=\"widgetData?.content?.avgRating\">\n <mat-icon class=\"mr-1\">star</mat-icon>\n <span>{{widgetData.content.avgRating}}</span>\n </div>\n <!-- <span class=\"most-enrolled-text margin-left-m\">{{ 'cardcontentv2.mostEnrolled' | translate }}</span> -->\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostEnrolled')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostEnrolled' | translate }} -->\n </span>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostTrending')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostTrending' | translate }} -->\n </span>\n </ng-container>\n </div>\n\n <div class=\"flex flex-middle margin-top-m\" *ngIf=\"widgetData?.sakshamAIGenerated\">\n \n <div class=\"flex flex-middle relevant-container\" *ngIf=\"widgetData?.sakshamAIGenerated\" [@toggleRelevance]=\"isRelevent ? 'center' : 'normal'\">\n <div class=\"flex flex-middle relevent-btn py-2 px-4 relevant-box\"\n [ngClass]=\"isRelevent ? 'relevent-success' : 'relevent-normal'\" (mouseenter)=\"isHovered = true\"\n (mouseleave)=\"isHovered = false\" (click)=\"handleAcceptRelevent($event)\">\n\n <img\n [src]=\"isHovered && !isRelevent ? SAKSHAMAI_ICON_LOADER : (isRelevent ? SAKSHAMAI_ICON_SUCCESS : SAKSHAMAI_ICON_NORMAL)\"\n alt=\"loader\" width=\"16\" height=\"16\" class=\"mr-2\">\n <span class=\"text-relevent ff-lato text-sm font-bold\">{{ 'home.relevent' | translate }}</span>\n </div>\n\n <div class=\"flex flex-middle no-button ml-8\" *ngIf=\"!isRelevent\" (click)=\"handleDeclineRelevent($event)\">\n <mat-icon class=\"mat-icon text-no mr-1\">thumb_down</mat-icon>\n <span class=\"text-no ff-lato text-sm font-bold\">{{ 'home.no' | translate }}</span>\n </div>\n </div>\n \n </div>\n </div>\n </mat-card-content>\n </ng-container>\n <ng-container *ngIf=\"isCardFlipped\">\n <div class=\"flex items-center\">\n <!-- <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>{{'cardcontentv2.reason' | translate}}</h2> -->\n <button mat-icon-button (click)=\"isCardFlipped = false\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n <p class=\"text-justify mat-body-1\">\n {{ widgetData.content.reason }}\n </p>\n </ng-container>\n </a>\n </ng-container>\n </div>\n</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove\" >\n <div class=\"display-contents\" >\n <ng-container *ngIf=\"!isCardFlipped\">\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container>\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'140px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </ng-container>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end\">\n <sb-uic-skeleton-loader [width]=\"'65px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n <div class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded margin-top-s'\"></sb-uic-skeleton-loader>\n </div>\n <div class=\"flex w-full flex-wrap flex-middle margin-top-m\">\n <div class=\"\">\n <sb-uic-skeleton-loader [width]=\"'28px'\" [height]=\"'28px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </div>\n <span class=\"org-text\"> <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader></span>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\">\n <div class=\"flex flex-middle\">\n <sb-uic-skeleton-loader [width]=\"'45px'\" [height]=\"'12px'\" [bindingClass]=\"'flex rounded margin-top-m'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </mat-card-content>\n </ng-container>\n </div>\n </mat-card>\n</ng-container>\n\n<ng-template #cbpPlan let-data=\"data\">\n <div class=\"cbp-mark left-0 border-top-radius\">\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger nodtranslate\">{{'OverDue' }}</p>\n </div>\n</ng-template>", styles: [".course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}.rating-session mat-icon{font-size:16px;height:16px;width:12px;padding-right:3px;color:#ef951e}.rating-session span{font-size:11px}.rating-session .most-enrolled-text{padding:0 8px;background:#ffea9e;border-radius:4px}.card-standard-container{position:relative;width:245px;height:100%;min-height:346px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #9993;overflow:hidden;height:346px;margin:20px 8px 8px}.card-standard-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container .title-text{margin:12px 0;position:relative;overflow:hidden}.card-standard-container .description-text{position:relative;overflow:hidden;height:63px}.card-standard-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.card-standard-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #DEDFE0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container mat-card-content{background:#fff}.card-standard-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container .basic{margin:auto 0}.card-standard-container .title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}.width-238{width:238px!important}.cbp-mark{border-radius:12px 0;opacity:1;background-image:linear-gradient(90deg,#0009,#0000);position:absolute;top:0;padding:8px}.cbp-mark p{background-color:#fff;padding:4px;opacity:1;color:#1b2133;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:Regular;letter-spacing:.5px;text-align:left;line-height:12px;margin-bottom:0}.cbpwidth{width:340px}.cbp-plan{border-radius:4px;background-color:#1b4ca1;top:4px;left:4px;opacity:1;color:#fffffff2;font-family:Lato-Bold;font-size:12px;font-weight:700;font-style:normal;letter-spacing:.25px;text-align:center;line-height:16px;padding:4px}.cbp-info{opacity:1;color:#fff;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:normal;letter-spacing:.5px;text-align:left;line-height:12px;padding:2px}.cbp-danger{border-radius:2px;border:1px solid rgba(0,0,0,.08);background-color:#d13924!important;color:#fff!important;opacity:1}.cbp-success{border-radius:2px;border:1px solid #1d8922;background-color:#1d8922!important;color:#fff!important;opacity:1}.cbp-warning{border-radius:2px;border:1px solid #ef951e;background-color:#ef951e!important;color:#fff!important;opacity:1}.relevent-normal .text-relevent{color:#1b2133}.relevent-success .text-relevent,.relevent-success mat-icon{color:#1d8923}.text-no{color:#1b4ca1}.ff-lato{font-family:Lato}.relevent-normal.relevent-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#276de5;background-color:#fff;border-radius:21px;text-decoration:none;overflow:hidden;transition:all .3s ease-in-out}.relevent-normal.relevent-btn:hover{box-shadow:0 1px 10px #276de599}.relevent-normal.relevent-btn:before{content:\"\";position:absolute;inset:0;padding:2.5px;border-radius:21px;background:linear-gradient(89.96deg,#f3962f .04%,#276de5 99.96%);-webkit-mask:linear-gradient(white,white) content-box,linear-gradient(white,white);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s ease-in-out}.relevent-normal.relevent-btn:hover:before{opacity:1}.relevant-container{display:flex;align-items:center;width:100%}.no-button{opacity:1;transform:scale(1);transition:opacity .3s ease-in-out,transform .3s ease-in-out}.relevant-container[ng-reflect-toggle-relevance=center] .no-button{opacity:0;transform:scale(.8);pointer-events:none}.apar-flag{font-family:Lato!important;font-weight:700!important;font-size:12px!important;color:#fffffff2!important}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6$1.MatLegacyCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i6$1.MatLegacyCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i6$1.MatLegacyCardImage, selector: "[mat-card-image], [matCardImage]" }, { kind: "component", type: i8.MatLegacyButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4.MatLegacyTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DisplayContentTypeLibComponent, selector: "sb-uic-display-content-type", inputs: ["useTranslation", "displayContentType"] }, { kind: "directive", type: DefaultThumbnailDirective, selector: "[wsUtilsDefaultThumbnail]", inputs: ["wsUtilsDefaultThumbnail", "src"] }, { kind: "component", type: SkeletonLoaderLibComponent, selector: "sb-uic-skeleton-loader", inputs: ["bindingClass", "height", "width"] }, { kind: "component", type: AvailableLanguagesComponent, selector: "sb-uic-available-languages", inputs: ["content"] }, { kind: "pipe", type: i2$2.DatePipe, name: "date" }, { kind: "pipe", type: i2.PipePublicURL, name: "pipePublicURL" }, { kind: "pipe", type: PipeDurationTransformPipe, name: "pipeDurationTransform" }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }], animations: [relevanceAnimation] }); }
|
|
6483
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardPortraitComponent, selector: "sb-uic-card-portrait", inputs: { widgetData: "widgetData", isLiveOrMarkForDeletion: "isLiveOrMarkForDeletion", showIntranetContent: "showIntranetContent", isIntranetAllowedSettings: "isIntranetAllowedSettings", isCardLoading: "isCardLoading", cbPlanMapData: "cbPlanMapData" }, outputs: { contentData: "contentData" }, ngImport: i0, template: "<ng-container *ngIf=\"!isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove cursor-pointer {{widgetData?.cardCustomeClass}}\" [ngClass]=\"{\n greyOut:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent,\n 'card-standard-container-with-saksham-ai': widgetData?.sakshamAIGenerated\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\n <div class=\"display-contents\" [ngClass]=\"{\n disableClick:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n }\">\n <ng-container *ngIf=\"widgetData.content\">\n <a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\"\n role=\"link\" i18n-aria-label>\n <ng-container *ngIf=\"!isCardFlipped\">\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\n matTooltip=\"Available only in Company's network\"\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\n <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\n (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\n <mat-icon>flip_to_back</mat-icon>\n </button>\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container *ngIf=\"widgetData.content.posterImage && !widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"widgetData.content.posterImage && widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"!widgetData.content.posterImage\">\n <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n <img mat-card-image [src]=\"widgetData.content.appIcon | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-template #defaultImg>\n <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\"\n [alt]=\"widgetData.content.name\" />\n </ng-template>\n </ng-container>\n <div class=\"source-div\" style=\"display: none;\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div>\n <ng-container *ngIf=\"widgetData?.content?.cbPlanEndDate\">\n <div class=\"cbp-mark\">\n <span>{{widgetData?.content?.cbPlanEndDate | date: 'd MMM, y'}}</span>\n </div>\n </ng-container>\n <!-- <ng-container *ngIf=\"widgetData?.content?.endDate\">\n <div class=\"cbp-mark\">\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger\">Over due</p>\n </div>\n </ng-container> -->\n <ng-container *ngIf=\"cbPlanMapData && cbPlanMapData[widgetData?.content?.identifier] && cbPlanMapData[widgetData?.content?.identifier]?.contentStatus < 2\">\n <ng-container [ngTemplateOutlet]=\"cbpPlan\" [ngTemplateOutletContext]=\"{data: {\n cbpData: cbPlanMapData[widgetData?.content?.identifier]\n }}\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.isApar\">\n <div class=\"cbp-mark right-0 rounded-bottom\">\n <p class=\"cbp-success apar-flag\">APAR</p>\n </div>\n </ng-container>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.duration > 0 && !(widgetData?.content?.programDuration > 0)\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{ (widgetData?.content?.duration || 120)| pipeDurationTransform: 'hms' }}\n </span>\n </div>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.programDuration > 0\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{widgetData?.content?.programDuration}} {{widgetData?.content?.programDuration === 1 ? 'day' : 'days'}}\n </span>\n </div>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end course_v2\">\n <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.primaryCategory\"\n class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData.content?.primaryCategory==='Course Unit'\n ?'Module'\n :widgetData.content?.courseCategory ? widgetData.content?.courseCategory: widgetData.content?.primaryCategory\">\n\n </sb-uic-display-content-type>\n </div>\n </div>\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\n class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient nodtranslate\">\n {{ widgetData.content.name }}\n </div>\n <div class=\"flex w-full flex-wrap flex-middle\">\n <!-- <div class=\"course_logo_box\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div> -->\n <div class=\"course_logo_box\">\n <img \n [src]=\"widgetData?.sakshamAIGenerated ? widgetData.content.creatorLogo : (widgetData.content.creatorLogo | pipePublicURL)\" \n class=\"source-icon\" \n [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier\" />\n </div>\n <!-- <span class=\"org-text\">{{'cardcontentv2.by' | translate}} -->\n <span class=\"org-text nodtranslate\">By {{ (widgetData?.content?.organisation && widgetData?.content?.organisation[0]) ? widgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}</span>\n </div>\n <div class=\"mt-2\" *ngIf=\"widgetData?.content\">\n <sb-uic-available-languages [content]=\"widgetData?.content\"></sb-uic-available-languages>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\" *ngIf=\"!widgetData?.sakshamAIGenerated\">\n <div class=\"flex flex-middle\" *ngIf=\"widgetData?.content?.avgRating\">\n <mat-icon class=\"mr-1\">star</mat-icon>\n <span>{{widgetData.content.avgRating}}</span>\n </div>\n <!-- <span class=\"most-enrolled-text margin-left-m\">{{ 'cardcontentv2.mostEnrolled' | translate }}</span> -->\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostEnrolled')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostEnrolled' | translate }} -->\n </span>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostTrending')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostTrending' | translate }} -->\n </span>\n </ng-container>\n </div>\n\n <div class=\"flex flex-middle margin-top-m\" *ngIf=\"widgetData?.sakshamAIGenerated\">\n \n <div class=\"flex flex-middle relevant-container\" *ngIf=\"widgetData?.sakshamAIGenerated\" [@toggleRelevance]=\"isRelevent ? 'center' : 'normal'\">\n <div class=\"flex flex-middle relevent-btn py-2 px-4 relevant-box\"\n [ngClass]=\"isRelevent ? 'relevent-success' : 'relevent-normal'\" (mouseenter)=\"isHovered = true\"\n (mouseleave)=\"isHovered = false\" (click)=\"handleAcceptRelevent($event)\">\n\n <img\n [src]=\"isHovered && !isRelevent ? SAKSHAMAI_ICON_LOADER : (isRelevent ? SAKSHAMAI_ICON_SUCCESS : SAKSHAMAI_ICON_NORMAL)\"\n alt=\"loader\" width=\"16\" height=\"16\" class=\"mr-2\">\n <span class=\"text-relevent ff-lato text-sm font-bold\">{{ 'home.relevent' | translate }}</span>\n </div>\n\n <div class=\"flex flex-middle no-button ml-8\" *ngIf=\"!isRelevent\" (click)=\"handleDeclineRelevent($event)\">\n <mat-icon class=\"mat-icon text-no mr-1\">thumb_down</mat-icon>\n <span class=\"text-no ff-lato text-sm font-bold\">{{ 'home.no' | translate }}</span>\n </div>\n </div>\n \n </div>\n </div>\n </mat-card-content>\n </ng-container>\n <ng-container *ngIf=\"isCardFlipped\">\n <div class=\"flex items-center\">\n <!-- <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>{{'cardcontentv2.reason' | translate}}</h2> -->\n <button mat-icon-button (click)=\"isCardFlipped = false\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n <p class=\"text-justify mat-body-1\">\n {{ widgetData.content.reason }}\n </p>\n </ng-container>\n </a>\n </ng-container>\n </div>\n</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove\" >\n <div class=\"display-contents\" >\n <ng-container *ngIf=\"!isCardFlipped\">\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container>\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'140px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </ng-container>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end\">\n <sb-uic-skeleton-loader [width]=\"'65px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n <div class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded margin-top-s'\"></sb-uic-skeleton-loader>\n </div>\n <div class=\"flex w-full flex-wrap flex-middle margin-top-m\">\n <div class=\"\">\n <sb-uic-skeleton-loader [width]=\"'28px'\" [height]=\"'28px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </div>\n <span class=\"org-text\"> <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader></span>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\">\n <div class=\"flex flex-middle\">\n <sb-uic-skeleton-loader [width]=\"'45px'\" [height]=\"'12px'\" [bindingClass]=\"'flex rounded margin-top-m'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </mat-card-content>\n </ng-container>\n </div>\n </mat-card>\n</ng-container>\n\n<ng-template #cbpPlan let-data=\"data\">\n <div class=\"cbp-mark left-0 border-top-radius\">\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger nodtranslate\">{{'OverDue' }}</p>\n </div>\n</ng-template>", styles: [".course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}.rating-session mat-icon{font-size:16px;height:16px;width:12px;padding-right:3px;color:#ef951e}.rating-session span{font-size:11px}.rating-session .most-enrolled-text{padding:0 8px;background:#ffea9e;border-radius:4px}.card-standard-container{position:relative;width:245px;height:100%;min-height:360px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #9993;overflow:hidden;height:360px;margin:20px 8px 8px}.card-standard-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container .title-text{margin:12px 0;position:relative;overflow:hidden}.card-standard-container .description-text{position:relative;overflow:hidden;height:63px}.card-standard-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.card-standard-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #DEDFE0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container mat-card-content{background:#fff}.card-standard-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container .basic{margin:auto 0}.card-standard-container .title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.card-standard-container-with-saksham-ai{position:relative;width:245px;height:100%;min-height:385px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #9993;overflow:hidden;height:385px;margin:20px 8px 8px}.card-standard-container-with-saksham-ai .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container-with-saksham-ai ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container-with-saksham-ai .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container-with-saksham-ai .title-text{margin:12px 0;position:relative;overflow:hidden}.card-standard-container-with-saksham-ai .description-text{position:relative;overflow:hidden;height:63px}.card-standard-container-with-saksham-ai .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.card-standard-container-with-saksham-ai .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container-with-saksham-ai .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container-with-saksham-ai .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container-with-saksham-ai .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #DEDFE0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container-with-saksham-ai .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container-with-saksham-ai mat-card-content{background:#fff}.card-standard-container-with-saksham-ai .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container-with-saksham-ai .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container-with-saksham-ai .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container-with-saksham-ai .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container-with-saksham-ai .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container-with-saksham-ai .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container-with-saksham-ai .basic{margin:auto 0}.card-standard-container-with-saksham-ai .title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container-with-saksham-ai .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}.width-238{width:238px!important}.cbp-mark{border-radius:12px 0;opacity:1;background-image:linear-gradient(90deg,#0009,#0000);position:absolute;top:0;padding:8px}.cbp-mark p{background-color:#fff;padding:4px;opacity:1;color:#1b2133;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:Regular;letter-spacing:.5px;text-align:left;line-height:12px;margin-bottom:0}.cbpwidth{width:340px}.cbp-plan{border-radius:4px;background-color:#1b4ca1;top:4px;left:4px;opacity:1;color:#fffffff2;font-family:Lato-Bold;font-size:12px;font-weight:700;font-style:normal;letter-spacing:.25px;text-align:center;line-height:16px;padding:4px}.cbp-info{opacity:1;color:#fff;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:normal;letter-spacing:.5px;text-align:left;line-height:12px;padding:2px}.cbp-danger{border-radius:2px;border:1px solid rgba(0,0,0,.08);background-color:#d13924!important;color:#fff!important;opacity:1}.cbp-success{border-radius:2px;border:1px solid #1d8922;background-color:#1d8922!important;color:#fff!important;opacity:1}.cbp-warning{border-radius:2px;border:1px solid #ef951e;background-color:#ef951e!important;color:#fff!important;opacity:1}.relevent-normal .text-relevent{color:#1b2133}.relevent-success .text-relevent,.relevent-success mat-icon{color:#1d8923}.text-no{color:#1b4ca1}.ff-lato{font-family:Lato}.relevent-normal.relevent-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#276de5;background-color:#fff;border-radius:21px;text-decoration:none;overflow:hidden;transition:all .3s ease-in-out}.relevent-normal.relevent-btn:hover{box-shadow:0 1px 10px #276de599}.relevent-normal.relevent-btn:before{content:\"\";position:absolute;inset:0;padding:2.5px;border-radius:21px;background:linear-gradient(89.96deg,#f3962f .04%,#276de5 99.96%);-webkit-mask:linear-gradient(white,white) content-box,linear-gradient(white,white);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s ease-in-out}.relevent-normal.relevent-btn:hover:before{opacity:1}.relevant-container{display:flex;align-items:center;width:100%}.no-button{opacity:1;transform:scale(1);transition:opacity .3s ease-in-out,transform .3s ease-in-out}.relevant-container[ng-reflect-toggle-relevance=center] .no-button{opacity:0;transform:scale(.8);pointer-events:none}.apar-flag{font-family:Lato!important;font-weight:700!important;font-size:12px!important;color:#fffffff2!important}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6$1.MatLegacyCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i6$1.MatLegacyCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i6$1.MatLegacyCardImage, selector: "[mat-card-image], [matCardImage]" }, { kind: "component", type: i8.MatLegacyButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4.MatLegacyTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DisplayContentTypeLibComponent, selector: "sb-uic-display-content-type", inputs: ["useTranslation", "displayContentType"] }, { kind: "directive", type: DefaultThumbnailDirective, selector: "[wsUtilsDefaultThumbnail]", inputs: ["wsUtilsDefaultThumbnail", "src"] }, { kind: "component", type: SkeletonLoaderLibComponent, selector: "sb-uic-skeleton-loader", inputs: ["bindingClass", "height", "width"] }, { kind: "component", type: AvailableLanguagesComponent, selector: "sb-uic-available-languages", inputs: ["content"] }, { kind: "pipe", type: i2$2.DatePipe, name: "date" }, { kind: "pipe", type: i2.PipePublicURL, name: "pipePublicURL" }, { kind: "pipe", type: PipeDurationTransformPipe, name: "pipeDurationTransform" }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }], animations: [relevanceAnimation] }); }
|
|
6484
6484
|
}
|
|
6485
6485
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardPortraitComponent, decorators: [{
|
|
6486
6486
|
type: Component,
|
|
6487
|
-
args: [{ selector: 'sb-uic-card-portrait', animations: [relevanceAnimation], template: "<ng-container *ngIf=\"!isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove cursor-pointer {{widgetData?.cardCustomeClass}}\" [ngClass]=\"{\n greyOut:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\n <div class=\"display-contents\" [ngClass]=\"{\n disableClick:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n }\">\n <ng-container *ngIf=\"widgetData.content\">\n <a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\"\n role=\"link\" i18n-aria-label>\n <ng-container *ngIf=\"!isCardFlipped\">\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\n matTooltip=\"Available only in Company's network\"\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\n <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\n (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\n <mat-icon>flip_to_back</mat-icon>\n </button>\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container *ngIf=\"widgetData.content.posterImage && !widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"widgetData.content.posterImage && widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"!widgetData.content.posterImage\">\n <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n <img mat-card-image [src]=\"widgetData.content.appIcon | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-template #defaultImg>\n <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\"\n [alt]=\"widgetData.content.name\" />\n </ng-template>\n </ng-container>\n <div class=\"source-div\" style=\"display: none;\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div>\n <ng-container *ngIf=\"widgetData?.content?.cbPlanEndDate\">\n <div class=\"cbp-mark\">\n <span>{{widgetData?.content?.cbPlanEndDate | date: 'd MMM, y'}}</span>\n </div>\n </ng-container>\n <!-- <ng-container *ngIf=\"widgetData?.content?.endDate\">\n <div class=\"cbp-mark\">\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger\">Over due</p>\n </div>\n </ng-container> -->\n <ng-container *ngIf=\"cbPlanMapData && cbPlanMapData[widgetData?.content?.identifier] && cbPlanMapData[widgetData?.content?.identifier]?.contentStatus < 2\">\n <ng-container [ngTemplateOutlet]=\"cbpPlan\" [ngTemplateOutletContext]=\"{data: {\n cbpData: cbPlanMapData[widgetData?.content?.identifier]\n }}\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.isApar\">\n <div class=\"cbp-mark right-0 rounded-bottom\">\n <p class=\"cbp-success apar-flag\">APAR</p>\n </div>\n </ng-container>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.duration > 0 && !(widgetData?.content?.programDuration > 0)\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{ (widgetData?.content?.duration || 120)| pipeDurationTransform: 'hms' }}\n </span>\n </div>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.programDuration > 0\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{widgetData?.content?.programDuration}} {{widgetData?.content?.programDuration === 1 ? 'day' : 'days'}}\n </span>\n </div>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end course_v2\">\n <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.primaryCategory\"\n class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData.content?.primaryCategory==='Course Unit'\n ?'Module'\n :widgetData.content?.courseCategory ? widgetData.content?.courseCategory: widgetData.content?.primaryCategory\">\n\n </sb-uic-display-content-type>\n </div>\n </div>\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\n class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient nodtranslate\">\n {{ widgetData.content.name }}\n </div>\n <div class=\"flex w-full flex-wrap flex-middle\">\n <!-- <div class=\"course_logo_box\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div> -->\n <div class=\"course_logo_box\">\n <img \n [src]=\"widgetData?.sakshamAIGenerated ? widgetData.content.creatorLogo : (widgetData.content.creatorLogo | pipePublicURL)\" \n class=\"source-icon\" \n [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier\" />\n </div>\n <!-- <span class=\"org-text\">{{'cardcontentv2.by' | translate}} -->\n <span class=\"org-text nodtranslate\">By {{ (widgetData?.content?.organisation && widgetData?.content?.organisation[0]) ? widgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}</span>\n </div>\n <div class=\"mt-2\">\n <sb-uic-available-languages [content]=\"widgetData?.content\"></sb-uic-available-languages>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\" *ngIf=\"!widgetData?.sakshamAIGenerated\">\n <div class=\"flex flex-middle\" *ngIf=\"widgetData?.content?.avgRating\">\n <mat-icon class=\"mr-1\">star</mat-icon>\n <span>{{widgetData.content.avgRating}}</span>\n </div>\n <!-- <span class=\"most-enrolled-text margin-left-m\">{{ 'cardcontentv2.mostEnrolled' | translate }}</span> -->\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostEnrolled')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostEnrolled' | translate }} -->\n </span>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostTrending')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostTrending' | translate }} -->\n </span>\n </ng-container>\n </div>\n\n <div class=\"flex flex-middle margin-top-m\" *ngIf=\"widgetData?.sakshamAIGenerated\">\n \n <div class=\"flex flex-middle relevant-container\" *ngIf=\"widgetData?.sakshamAIGenerated\" [@toggleRelevance]=\"isRelevent ? 'center' : 'normal'\">\n <div class=\"flex flex-middle relevent-btn py-2 px-4 relevant-box\"\n [ngClass]=\"isRelevent ? 'relevent-success' : 'relevent-normal'\" (mouseenter)=\"isHovered = true\"\n (mouseleave)=\"isHovered = false\" (click)=\"handleAcceptRelevent($event)\">\n\n <img\n [src]=\"isHovered && !isRelevent ? SAKSHAMAI_ICON_LOADER : (isRelevent ? SAKSHAMAI_ICON_SUCCESS : SAKSHAMAI_ICON_NORMAL)\"\n alt=\"loader\" width=\"16\" height=\"16\" class=\"mr-2\">\n <span class=\"text-relevent ff-lato text-sm font-bold\">{{ 'home.relevent' | translate }}</span>\n </div>\n\n <div class=\"flex flex-middle no-button ml-8\" *ngIf=\"!isRelevent\" (click)=\"handleDeclineRelevent($event)\">\n <mat-icon class=\"mat-icon text-no mr-1\">thumb_down</mat-icon>\n <span class=\"text-no ff-lato text-sm font-bold\">{{ 'home.no' | translate }}</span>\n </div>\n </div>\n \n </div>\n </div>\n </mat-card-content>\n </ng-container>\n <ng-container *ngIf=\"isCardFlipped\">\n <div class=\"flex items-center\">\n <!-- <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>{{'cardcontentv2.reason' | translate}}</h2> -->\n <button mat-icon-button (click)=\"isCardFlipped = false\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n <p class=\"text-justify mat-body-1\">\n {{ widgetData.content.reason }}\n </p>\n </ng-container>\n </a>\n </ng-container>\n </div>\n</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove\" >\n <div class=\"display-contents\" >\n <ng-container *ngIf=\"!isCardFlipped\">\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container>\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'140px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </ng-container>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end\">\n <sb-uic-skeleton-loader [width]=\"'65px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n <div class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded margin-top-s'\"></sb-uic-skeleton-loader>\n </div>\n <div class=\"flex w-full flex-wrap flex-middle margin-top-m\">\n <div class=\"\">\n <sb-uic-skeleton-loader [width]=\"'28px'\" [height]=\"'28px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </div>\n <span class=\"org-text\"> <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader></span>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\">\n <div class=\"flex flex-middle\">\n <sb-uic-skeleton-loader [width]=\"'45px'\" [height]=\"'12px'\" [bindingClass]=\"'flex rounded margin-top-m'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </mat-card-content>\n </ng-container>\n </div>\n </mat-card>\n</ng-container>\n\n<ng-template #cbpPlan let-data=\"data\">\n <div class=\"cbp-mark left-0 border-top-radius\">\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger nodtranslate\">{{'OverDue' }}</p>\n </div>\n</ng-template>", styles: [".course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}.rating-session mat-icon{font-size:16px;height:16px;width:12px;padding-right:3px;color:#ef951e}.rating-session span{font-size:11px}.rating-session .most-enrolled-text{padding:0 8px;background:#ffea9e;border-radius:4px}.card-standard-container{position:relative;width:245px;height:100%;min-height:346px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #9993;overflow:hidden;height:346px;margin:20px 8px 8px}.card-standard-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container .title-text{margin:12px 0;position:relative;overflow:hidden}.card-standard-container .description-text{position:relative;overflow:hidden;height:63px}.card-standard-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.card-standard-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #DEDFE0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container mat-card-content{background:#fff}.card-standard-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container .basic{margin:auto 0}.card-standard-container .title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}.width-238{width:238px!important}.cbp-mark{border-radius:12px 0;opacity:1;background-image:linear-gradient(90deg,#0009,#0000);position:absolute;top:0;padding:8px}.cbp-mark p{background-color:#fff;padding:4px;opacity:1;color:#1b2133;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:Regular;letter-spacing:.5px;text-align:left;line-height:12px;margin-bottom:0}.cbpwidth{width:340px}.cbp-plan{border-radius:4px;background-color:#1b4ca1;top:4px;left:4px;opacity:1;color:#fffffff2;font-family:Lato-Bold;font-size:12px;font-weight:700;font-style:normal;letter-spacing:.25px;text-align:center;line-height:16px;padding:4px}.cbp-info{opacity:1;color:#fff;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:normal;letter-spacing:.5px;text-align:left;line-height:12px;padding:2px}.cbp-danger{border-radius:2px;border:1px solid rgba(0,0,0,.08);background-color:#d13924!important;color:#fff!important;opacity:1}.cbp-success{border-radius:2px;border:1px solid #1d8922;background-color:#1d8922!important;color:#fff!important;opacity:1}.cbp-warning{border-radius:2px;border:1px solid #ef951e;background-color:#ef951e!important;color:#fff!important;opacity:1}.relevent-normal .text-relevent{color:#1b2133}.relevent-success .text-relevent,.relevent-success mat-icon{color:#1d8923}.text-no{color:#1b4ca1}.ff-lato{font-family:Lato}.relevent-normal.relevent-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#276de5;background-color:#fff;border-radius:21px;text-decoration:none;overflow:hidden;transition:all .3s ease-in-out}.relevent-normal.relevent-btn:hover{box-shadow:0 1px 10px #276de599}.relevent-normal.relevent-btn:before{content:\"\";position:absolute;inset:0;padding:2.5px;border-radius:21px;background:linear-gradient(89.96deg,#f3962f .04%,#276de5 99.96%);-webkit-mask:linear-gradient(white,white) content-box,linear-gradient(white,white);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s ease-in-out}.relevent-normal.relevent-btn:hover:before{opacity:1}.relevant-container{display:flex;align-items:center;width:100%}.no-button{opacity:1;transform:scale(1);transition:opacity .3s ease-in-out,transform .3s ease-in-out}.relevant-container[ng-reflect-toggle-relevance=center] .no-button{opacity:0;transform:scale(.8);pointer-events:none}.apar-flag{font-family:Lato!important;font-weight:700!important;font-size:12px!important;color:#fffffff2!important}\n"] }]
|
|
6487
|
+
args: [{ selector: 'sb-uic-card-portrait', animations: [relevanceAnimation], template: "<ng-container *ngIf=\"!isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove cursor-pointer {{widgetData?.cardCustomeClass}}\" [ngClass]=\"{\n greyOut:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent,\n 'card-standard-container-with-saksham-ai': widgetData?.sakshamAIGenerated\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\n <div class=\"display-contents\" [ngClass]=\"{\n disableClick:\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\n ? true\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\n }\">\n <ng-container *ngIf=\"widgetData.content\">\n <a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\"\n role=\"link\" i18n-aria-label>\n <ng-container *ngIf=\"!isCardFlipped\">\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\n matTooltip=\"Available only in Company's network\"\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\n <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\n (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\n <mat-icon>flip_to_back</mat-icon>\n </button>\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container *ngIf=\"widgetData.content.posterImage && !widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"widgetData.content.posterImage && widgetData?.sakshamAIGenerated\">\n <img mat-card-image [src]=\"widgetData.content.posterImage\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-container *ngIf=\"!widgetData.content.posterImage\">\n <ng-container *ngIf=\"widgetData.content.appIcon; else defaultImg\">\n <img mat-card-image [src]=\"widgetData.content.appIcon | pipePublicURL\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\n [alt]=\"widgetData.content.name\" />\n </ng-container>\n <ng-template #defaultImg>\n <img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n class=\"card-img ws-mat-primary-lite-background margin-remove\"\n [alt]=\"widgetData.content.name\" />\n </ng-template>\n </ng-container>\n <div class=\"source-div\" style=\"display: none;\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div>\n <ng-container *ngIf=\"widgetData?.content?.cbPlanEndDate\">\n <div class=\"cbp-mark\">\n <span>{{widgetData?.content?.cbPlanEndDate | date: 'd MMM, y'}}</span>\n </div>\n </ng-container>\n <!-- <ng-container *ngIf=\"widgetData?.content?.endDate\">\n <div class=\"cbp-mark\">\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success\">{{widgetData?.content?.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"widgetData?.content?.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger\">Over due</p>\n </div>\n </ng-container> -->\n <ng-container *ngIf=\"cbPlanMapData && cbPlanMapData[widgetData?.content?.identifier] && cbPlanMapData[widgetData?.content?.identifier]?.contentStatus < 2\">\n <ng-container [ngTemplateOutlet]=\"cbpPlan\" [ngTemplateOutletContext]=\"{data: {\n cbpData: cbPlanMapData[widgetData?.content?.identifier]\n }}\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.isApar\">\n <div class=\"cbp-mark right-0 rounded-bottom\">\n <p class=\"cbp-success apar-flag\">APAR</p>\n </div>\n </ng-container>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.duration > 0 && !(widgetData?.content?.programDuration > 0)\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{ (widgetData?.content?.duration || 120)| pipeDurationTransform: 'hms' }}\n </span>\n </div>\n <div class=\"duration-box right-corner\" *ngIf=\"widgetData?.content?.programDuration > 0\">\n <mat-icon class=\"mat-icon main_icon mr-1 nodtranslate\">access_time</mat-icon>\n <span class=\" ws-mat-white-text duration nodtranslate\">\n {{widgetData?.content?.programDuration}} {{widgetData?.content?.programDuration === 1 ? 'day' : 'days'}}\n </span>\n </div>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end course_v2\">\n <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.primaryCategory\"\n class=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"widgetData.content?.primaryCategory==='Course Unit'\n ?'Module'\n :widgetData.content?.courseCategory ? widgetData.content?.courseCategory: widgetData.content?.primaryCategory\">\n\n </sb-uic-display-content-type>\n </div>\n </div>\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\n class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient nodtranslate\">\n {{ widgetData.content.name }}\n </div>\n <div class=\"flex w-full flex-wrap flex-middle\">\n <!-- <div class=\"course_logo_box\">\n <img [src]=\"widgetData.content.creatorLogo | pipePublicURL\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\n </div> -->\n <div class=\"course_logo_box\">\n <img \n [src]=\"widgetData?.sakshamAIGenerated ? widgetData.content.creatorLogo : (widgetData.content.creatorLogo | pipePublicURL)\" \n class=\"source-icon\" \n [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n [alt]=\"widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier\" />\n </div>\n <!-- <span class=\"org-text\">{{'cardcontentv2.by' | translate}} -->\n <span class=\"org-text nodtranslate\">By {{ (widgetData?.content?.organisation && widgetData?.content?.organisation[0]) ? widgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}</span>\n </div>\n <div class=\"mt-2\" *ngIf=\"widgetData?.content\">\n <sb-uic-available-languages [content]=\"widgetData?.content\"></sb-uic-available-languages>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\" *ngIf=\"!widgetData?.sakshamAIGenerated\">\n <div class=\"flex flex-middle\" *ngIf=\"widgetData?.content?.avgRating\">\n <mat-icon class=\"mr-1\">star</mat-icon>\n <span>{{widgetData.content.avgRating}}</span>\n </div>\n <!-- <span class=\"most-enrolled-text margin-left-m\">{{ 'cardcontentv2.mostEnrolled' | translate }}</span> -->\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostEnrolled')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostEnrolled' | translate }} -->\n </span>\n </ng-container>\n <ng-container *ngIf=\"widgetData?.content?.additionalTags && widgetData?.content?.additionalTags.includes('mostTrending')\">\n <span class=\"most-enrolled-text margin-left-xs\">\n <!-- {{ 'cardcontentv2.mostTrending' | translate }} -->\n </span>\n </ng-container>\n </div>\n\n <div class=\"flex flex-middle margin-top-m\" *ngIf=\"widgetData?.sakshamAIGenerated\">\n \n <div class=\"flex flex-middle relevant-container\" *ngIf=\"widgetData?.sakshamAIGenerated\" [@toggleRelevance]=\"isRelevent ? 'center' : 'normal'\">\n <div class=\"flex flex-middle relevent-btn py-2 px-4 relevant-box\"\n [ngClass]=\"isRelevent ? 'relevent-success' : 'relevent-normal'\" (mouseenter)=\"isHovered = true\"\n (mouseleave)=\"isHovered = false\" (click)=\"handleAcceptRelevent($event)\">\n\n <img\n [src]=\"isHovered && !isRelevent ? SAKSHAMAI_ICON_LOADER : (isRelevent ? SAKSHAMAI_ICON_SUCCESS : SAKSHAMAI_ICON_NORMAL)\"\n alt=\"loader\" width=\"16\" height=\"16\" class=\"mr-2\">\n <span class=\"text-relevent ff-lato text-sm font-bold\">{{ 'home.relevent' | translate }}</span>\n </div>\n\n <div class=\"flex flex-middle no-button ml-8\" *ngIf=\"!isRelevent\" (click)=\"handleDeclineRelevent($event)\">\n <mat-icon class=\"mat-icon text-no mr-1\">thumb_down</mat-icon>\n <span class=\"text-no ff-lato text-sm font-bold\">{{ 'home.no' | translate }}</span>\n </div>\n </div>\n \n </div>\n </div>\n </mat-card-content>\n </ng-container>\n <ng-container *ngIf=\"isCardFlipped\">\n <div class=\"flex items-center\">\n <!-- <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>{{'cardcontentv2.reason' | translate}}</h2> -->\n <button mat-icon-button (click)=\"isCardFlipped = false\">\n <mat-icon>close</mat-icon>\n </button>\n </div>\n <p class=\"text-justify mat-body-1\">\n {{ widgetData.content.reason }}\n </p>\n </ng-container>\n </a>\n </ng-container>\n </div>\n</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n <mat-card class=\"card-standard-container mr-5 padding-remove\" >\n <div class=\"display-contents\" >\n <ng-container *ngIf=\"!isCardFlipped\">\n <mat-card-content class=\"min-top\">\n <div style=\"position: relative; z-index: 1;\">\n <ng-container>\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'140px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </ng-container>\n </div>\n <div class=\"padding-m\">\n <div class=\"course_widget flex margin-remove\">\n <div class=\"flex flex-end\">\n <sb-uic-skeleton-loader [width]=\"'65px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n <div class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\n <sb-uic-skeleton-loader [width]=\"'100%'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded margin-top-s'\"></sb-uic-skeleton-loader>\n </div>\n <div class=\"flex w-full flex-wrap flex-middle margin-top-m\">\n <div class=\"\">\n <sb-uic-skeleton-loader [width]=\"'28px'\" [height]=\"'28px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader>\n </div>\n <span class=\"org-text\"> <sb-uic-skeleton-loader [width]=\"'111px'\" [height]=\"'16px'\" [bindingClass]=\"'flex rounded'\"></sb-uic-skeleton-loader></span>\n </div>\n <div class=\"flex flex-middle rating-session margin-top-m\">\n <div class=\"flex flex-middle\">\n <sb-uic-skeleton-loader [width]=\"'45px'\" [height]=\"'12px'\" [bindingClass]=\"'flex rounded margin-top-m'\"></sb-uic-skeleton-loader>\n </div>\n </div>\n </div>\n </mat-card-content>\n </ng-container>\n </div>\n </mat-card>\n</ng-container>\n\n<ng-template #cbpPlan let-data=\"data\">\n <div class=\"cbp-mark left-0 border-top-radius\">\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.UPCOMING\" class=\"cbp-warning nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.SUCCESS\" class=\"cbp-success nodtranslate\">{{data.cbpData.endDate | date: 'd MMM, y'}}</p>\n <p *ngIf=\"data.cbpData.planDuration === acbpConstants?.OVERDUE\" class=\"cbp-danger nodtranslate\">{{'OverDue' }}</p>\n </div>\n</ng-template>", styles: [".course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}.rating-session mat-icon{font-size:16px;height:16px;width:12px;padding-right:3px;color:#ef951e}.rating-session span{font-size:11px}.rating-session .most-enrolled-text{padding:0 8px;background:#ffea9e;border-radius:4px}.card-standard-container{position:relative;width:245px;height:100%;min-height:360px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #9993;overflow:hidden;height:360px;margin:20px 8px 8px}.card-standard-container .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container .title-text{margin:12px 0;position:relative;overflow:hidden}.card-standard-container .description-text{position:relative;overflow:hidden;height:63px}.card-standard-container .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.card-standard-container .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #DEDFE0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container mat-card-content{background:#fff}.card-standard-container .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container .basic{margin:auto 0}.card-standard-container .title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.card-standard-container-with-saksham-ai{position:relative;width:245px;height:100%;min-height:385px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #9993;overflow:hidden;height:385px;margin:20px 8px 8px}.card-standard-container-with-saksham-ai .progress-bar{width:101%;margin-left:-15px;display:flex;margin-top:0;background:bisque;position:absolute;bottom:0}.card-standard-container-with-saksham-ai ::ng-deep .mat-progress-bar{height:8px!important}.card-standard-container-with-saksham-ai .icon_text{font-size:12px;line-height:16px;text-transform:uppercase}.card-standard-container-with-saksham-ai .title-text{margin:12px 0;position:relative;overflow:hidden}.card-standard-container-with-saksham-ai .description-text{position:relative;overflow:hidden;height:63px}.card-standard-container-with-saksham-ai .course_logo_box{width:38px;height:38px;background:#fff;border-radius:8px;box-sizing:border-box;box-shadow:0 2px 1px -1px #0003,0 1px 1px #00000024,0 1px 3px #0000001f}.card-standard-container-with-saksham-ai .course_logo_box img{height:28px;width:28px;padding:5px;display:inline-block}.card-standard-container-with-saksham-ai .course_logo_box p{display:inline-block;vertical-align:top}.card-standard-container-with-saksham-ai .org-text{font-size:12px;font-weight:400;width:75%;padding-left:10px;word-break:break-all;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.card-standard-container-with-saksham-ai .source-div{position:relative;top:100px;background:#fff;z-index:3;border:1px solid #DEDFE0;min-width:72px;min-height:72px;max-width:72px;max-height:72px;display:flex;border-radius:8px}.card-standard-container-with-saksham-ai .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-standard-container-with-saksham-ai mat-card-content{background:#fff}.card-standard-container-with-saksham-ai .card-img{min-width:245px;max-height:140px;min-height:140px;display:block;object-fit:fill;border-top-left-radius:8px;border-top-right-radius:8px;width:100%}.card-standard-container-with-saksham-ai .mat-subheading-1{font:600 14px/24px Montserrat}.card-standard-container-with-saksham-ai .complexity{padding-top:70px;display:flex;font-size:14px;line-height:21px;padding-bottom:10px}.card-standard-container-with-saksham-ai .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-standard-container-with-saksham-ai .complexity .duration{display:flex;margin-left:auto;order:3;font-weight:700}.card-standard-container-with-saksham-ai .complexity .time-text{margin:0 5px 0 6px;font-weight:700}.card-standard-container-with-saksham-ai .basic{margin:auto 0}.card-standard-container-with-saksham-ai .title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:48px}.card-standard-container-with-saksham-ai .description-text{position:relative;overflow:hidden;height:42px;white-space:normal;text-overflow:ellipsis}.duration-box{background:#000;position:absolute;border:none;display:flex;align-items:center;padding:4px;border-radius:4px}.duration-box.right-corner{right:4px;bottom:4px}.duration-box .mat-icon{vertical-align:middle;color:#fff!important;height:14px!important;width:14px!important;font-size:14px}.duration-box .duration{font:700 12px/16px Lato;display:inline-block;margin:0;padding:0}.width-238{width:238px!important}.cbp-mark{border-radius:12px 0;opacity:1;background-image:linear-gradient(90deg,#0009,#0000);position:absolute;top:0;padding:8px}.cbp-mark p{background-color:#fff;padding:4px;opacity:1;color:#1b2133;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:Regular;letter-spacing:.5px;text-align:left;line-height:12px;margin-bottom:0}.cbpwidth{width:340px}.cbp-plan{border-radius:4px;background-color:#1b4ca1;top:4px;left:4px;opacity:1;color:#fffffff2;font-family:Lato-Bold;font-size:12px;font-weight:700;font-style:normal;letter-spacing:.25px;text-align:center;line-height:16px;padding:4px}.cbp-info{opacity:1;color:#fff;font-family:Lato-Regular;font-size:10px;font-weight:400;font-style:normal;letter-spacing:.5px;text-align:left;line-height:12px;padding:2px}.cbp-danger{border-radius:2px;border:1px solid rgba(0,0,0,.08);background-color:#d13924!important;color:#fff!important;opacity:1}.cbp-success{border-radius:2px;border:1px solid #1d8922;background-color:#1d8922!important;color:#fff!important;opacity:1}.cbp-warning{border-radius:2px;border:1px solid #ef951e;background-color:#ef951e!important;color:#fff!important;opacity:1}.relevent-normal .text-relevent{color:#1b2133}.relevent-success .text-relevent,.relevent-success mat-icon{color:#1d8923}.text-no{color:#1b4ca1}.ff-lato{font-family:Lato}.relevent-normal.relevent-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#276de5;background-color:#fff;border-radius:21px;text-decoration:none;overflow:hidden;transition:all .3s ease-in-out}.relevent-normal.relevent-btn:hover{box-shadow:0 1px 10px #276de599}.relevent-normal.relevent-btn:before{content:\"\";position:absolute;inset:0;padding:2.5px;border-radius:21px;background:linear-gradient(89.96deg,#f3962f .04%,#276de5 99.96%);-webkit-mask:linear-gradient(white,white) content-box,linear-gradient(white,white);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s ease-in-out}.relevent-normal.relevent-btn:hover:before{opacity:1}.relevant-container{display:flex;align-items:center;width:100%}.no-button{opacity:1;transform:scale(1);transition:opacity .3s ease-in-out,transform .3s ease-in-out}.relevant-container[ng-reflect-toggle-relevance=center] .no-button{opacity:0;transform:scale(.8);pointer-events:none}.apar-flag{font-family:Lato!important;font-weight:700!important;font-size:12px!important;color:#fffffff2!important}\n"] }]
|
|
6488
6488
|
}], ctorParameters: function () { return [{ type: i1$4.MatLegacySnackBar }, { type: i2$1.TranslateService }, { type: MultilingualTranslationsService }, { type: i2.ConfigurationsService }, { type: WidgetContentLibService }]; }, propDecorators: { widgetData: [{
|
|
6489
6489
|
type: Input
|
|
6490
6490
|
}], isLiveOrMarkForDeletion: [{
|
|
@@ -7230,11 +7230,11 @@ class CardAssessmentComponent {
|
|
|
7230
7230
|
this.contentData.emit(contentData);
|
|
7231
7231
|
}
|
|
7232
7232
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardAssessmentComponent, deps: [{ token: i2.ConfigurationsService }, { token: WidgetContentLibService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7233
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardAssessmentComponent, selector: "sb-uic-card-assessment", inputs: { widgetData: "widgetData", isCardLoading: "isCardLoading" }, outputs: { contentData: "contentData" }, ngImport: i0, template: "<ng-container *ngIf=\"!isCardLoading\">\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\">\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container *ngIf=\"widgetData\">\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row px-4 pt-4\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<img mat-card-image class=\"margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t[src]=\"widgetData?.content?.posterImage | pipePublicURL\"\n\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\">\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<ng-template #defaultImg>\n\t\t\t\t\t\t\t\t\t\t\t<img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"card-wide-img ws-mat-primary-lite-background margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\" />\n\t\t\t\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\n\t\t\t\t\t\t\t\t<div class=\"course_widget flex margin-remove \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex flex-end course_v2\">\n\t\t\t\t\t\t\t\t\t <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n\t\t\t\t\t\t\t\t\t <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.courseCategory\"\n\t\t\t\t\t\t\t\t\t\tclass=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory? widgetData?.content?.primaryCategory:widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t </sb-uic-display-content-type>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t </div>\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex title-text mat-subheading-1\">\n\t\t\t\t\t\t\t\t\t\t{{ widgetData?.content?.name }} \n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex items-center justify-start margin-remove margin-top-xs font-normal mat-caption sub-title-text\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"course_logo_box\">\n\t\t\t\t\t\t\t\t\t\t\t<img [src]=\"widgetData?.content?.creatorLogo | pipePublicURL \"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"(widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier)\" />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<span class=\"sub-title-text ml-2\"> By\n\t\t\t\t\t\t\t\t\t\t\t{{ (widgetData?.content?.organisation &&\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0]) ?\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer padding-m\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<span>{{ startCountdown(widgetData?.content?.batch) }}</span>\n\t\t\t\t\t\t\t\t\t\t<div class=\"flex flex-row\" *ngIf=\"daysPending && eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">Assessment starts in</span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"big-text\"><b>{{ days }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">days</span> </span> : <span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"big-text\"><b>{{ hours }} </b><span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">hours</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span> : <span class=\"big-text\"> <b>{{ minutes }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">minutes</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.startDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy HH:mm' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div *ngIf=\"!daysPending\" class=\"flex flex-row\"> \n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">{{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}} ends on </span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-btn\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{{widgetData?.content?.isEnrolled ? 'Resume':'Start'}} {{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}}</span> \n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.endDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n\t<ng-container [ngTemplateOutlet]=\"skeltonLoader\"></ng-container>\n</ng-container>\n\n<ng-template #skeltonLoader>\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a>\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container>\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row padding-s\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'300px'\"\n\t\t\t\t\t\t\t\t\t\t\t[height]=\"'155px'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col margin-remove\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'200px'\" [height]=\"'20px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-top-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'250px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-remove margin-top-m items-center font-normal\">\n\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'24px'\" [height]=\"'24px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'150px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8 ml-2'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<!-- <span class=\"text-center\"><sb-uic-skeleton-loader [width]=\"'90px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader> </span> -->\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer col-row padding-l\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-template>", styles: [".card-assessment{width:100%;min-height:190px;box-sizing:border-box;min-width:340px;margin-top:16px;margin-right:12px;border-radius:12px}.image-container{width:119px;height:70px;flex-shrink:0;border-radius:8px;overflow:hidden;border:1px solid rgba(0,0,0,.08)}.image-container img{border-radius:8px;opacity:1;background-size:100%;width:100%;height:100%;flex-shrink:0;display:flex}.title-container{width:100%}.title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:48px;font:600 14px/24px Montserrat}.sub-title-text{color:#000000de;width:90%;word-break:break-word;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.course_logo_box{padding:3px;display:inline-block;width:24px;height:24px;border:1px solid #d6d6d6;border-radius:4px;box-sizing:border-box}.course_logo_box img.source-icon{height:100%;width:100%;display:inline-block}.mat-card-footer{margin:0!important}.time-span{padding:2px 8px;color:#fff;border-radius:4px;text-align:center;font-size:12px;background-color:green;width:100px}.not-started{background-color:#d13924!important}span.start-span{border-radius:50px;border:2px solid rgba(0,0,0,.08);font-size:12px;text-align:center;position:absolute;bottom:0;width:140px;left:50%;margin-left:-70px;background-color:#fff;margin-bottom:62px;margin-right:8px}.assessment-card-footer{background:#ef951e29!important;text-align:center;box-sizing:border-box;border-radius:0 0 8px 8px}.start-btn{background:#1b4ca1!important;color:#fff;font-size:14px;font-weight:600;border-radius:25px;text-align:center;padding:4px 12px}.dots-container{display:none}.big-text{font-size:16px}.small-text{font-size:12px!important;vertical-align:top;margin-left:4px}.course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6$1.MatLegacyCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i6$1.MatLegacyCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i6$1.MatLegacyCardFooter, selector: "mat-card-footer" }, { kind: "directive", type: i6$1.MatLegacyCardImage, selector: "[mat-card-image], [matCardImage]" }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DisplayContentTypeLibComponent, selector: "sb-uic-display-content-type", inputs: ["useTranslation", "displayContentType"] }, { kind: "directive", type: DefaultThumbnailDirective, selector: "[wsUtilsDefaultThumbnail]", inputs: ["wsUtilsDefaultThumbnail", "src"] }, { kind: "component", type: SkeletonLoaderLibComponent, selector: "sb-uic-skeleton-loader", inputs: ["bindingClass", "height", "width"] }, { kind: "pipe", type: i2$2.DatePipe, name: "date" }, { kind: "pipe", type: i2.PipePublicURL, name: "pipePublicURL" }] }); }
|
|
7233
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardAssessmentComponent, selector: "sb-uic-card-assessment", inputs: { widgetData: "widgetData", isCardLoading: "isCardLoading" }, outputs: { contentData: "contentData" }, ngImport: i0, template: "<ng-container *ngIf=\"!isCardLoading\">\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\">\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container *ngIf=\"widgetData\">\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row px-4 pt-4\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<img mat-card-image class=\"margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t[src]=\"widgetData?.content?.posterImage | pipePublicURL\"\n\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\">\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<ng-template #defaultImg>\n\t\t\t\t\t\t\t\t\t\t\t<img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"card-wide-img ws-mat-primary-lite-background margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\" />\n\t\t\t\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\n\t\t\t\t\t\t\t\t<div class=\"course_widget flex margin-remove \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex flex-end course_v2\">\n\t\t\t\t\t\t\t\t\t <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n\t\t\t\t\t\t\t\t\t <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.courseCategory\"\n\t\t\t\t\t\t\t\t\t\tclass=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory? widgetData?.content?.primaryCategory:widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t </sb-uic-display-content-type>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t </div>\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex title-text mat-subheading-1\">\n\t\t\t\t\t\t\t\t\t\t{{ widgetData?.content?.name }} \n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex items-center justify-start margin-remove margin-top-xs font-normal mat-caption sub-title-text\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"course_logo_box\">\n\t\t\t\t\t\t\t\t\t\t\t<img [src]=\"widgetData?.content?.creatorLogo | pipePublicURL \"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"(widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier)\" />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<span class=\"sub-title-text ml-2\"> By\n\t\t\t\t\t\t\t\t\t\t\t{{ (widgetData?.content?.organisation &&\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0]) ?\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer padding-m\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<span>{{ startCountdown(widgetData?.content?.batch) }}</span>\n\t\t\t\t\t\t\t\t\t\t<div class=\"flex flex-row\" *ngIf=\"daysPending && eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">Assessment starts in</span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"big-text\"><b>{{ days }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">days</span> </span> : <span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"big-text\"><b>{{ hours }} </b><span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">hours</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span> : <span class=\"big-text\"> <b>{{ minutes }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">minutes</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.startDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy HH:mm' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div *ngIf=\"!daysPending\" class=\"flex flex-row\"> \n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">{{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}} ends on </span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-btn\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{{(widgetData?.content?.isEnrolled && widgetData?.content?.completionPercentage >0) ? 'Resume':'Start'}} {{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}}</span> \n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.endDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n\t<ng-container [ngTemplateOutlet]=\"skeltonLoader\"></ng-container>\n</ng-container>\n\n<ng-template #skeltonLoader>\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a>\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container>\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row padding-s\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'300px'\"\n\t\t\t\t\t\t\t\t\t\t\t[height]=\"'155px'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col margin-remove\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'200px'\" [height]=\"'20px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-top-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'250px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-remove margin-top-m items-center font-normal\">\n\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'24px'\" [height]=\"'24px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'150px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8 ml-2'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<!-- <span class=\"text-center\"><sb-uic-skeleton-loader [width]=\"'90px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader> </span> -->\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer col-row padding-l\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-template>", styles: [".card-assessment{width:100%;min-height:190px;box-sizing:border-box;min-width:340px;margin-top:16px;margin-right:12px;border-radius:12px}.image-container{width:119px;height:70px;flex-shrink:0;border-radius:8px;overflow:hidden;border:1px solid rgba(0,0,0,.08)}.image-container img{border-radius:8px;opacity:1;background-size:100%;width:100%;height:100%;flex-shrink:0;display:flex}.title-container{width:100%}.title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:48px;font:600 14px/24px Montserrat}.sub-title-text{color:#000000de;width:90%;word-break:break-word;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.course_logo_box{padding:3px;display:inline-block;width:24px;height:24px;border:1px solid #d6d6d6;border-radius:4px;box-sizing:border-box}.course_logo_box img.source-icon{height:100%;width:100%;display:inline-block}.mat-card-footer{margin:0!important}.time-span{padding:2px 8px;color:#fff;border-radius:4px;text-align:center;font-size:12px;background-color:green;width:100px}.not-started{background-color:#d13924!important}span.start-span{border-radius:50px;border:2px solid rgba(0,0,0,.08);font-size:12px;text-align:center;position:absolute;bottom:0;width:140px;left:50%;margin-left:-70px;background-color:#fff;margin-bottom:62px;margin-right:8px}.assessment-card-footer{background:#ef951e29!important;text-align:center;box-sizing:border-box;border-radius:0 0 8px 8px}.start-btn{background:#1b4ca1!important;color:#fff;font-size:14px;font-weight:600;border-radius:25px;text-align:center;padding:4px 12px}.dots-container{display:none}.big-text{font-size:16px}.small-text{font-size:12px!important;vertical-align:top;margin-left:4px}.course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}\n"], dependencies: [{ kind: "directive", type: i2$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i6$1.MatLegacyCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i6$1.MatLegacyCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i6$1.MatLegacyCardFooter, selector: "mat-card-footer" }, { kind: "directive", type: i6$1.MatLegacyCardImage, selector: "[mat-card-image], [matCardImage]" }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: DisplayContentTypeLibComponent, selector: "sb-uic-display-content-type", inputs: ["useTranslation", "displayContentType"] }, { kind: "directive", type: DefaultThumbnailDirective, selector: "[wsUtilsDefaultThumbnail]", inputs: ["wsUtilsDefaultThumbnail", "src"] }, { kind: "component", type: SkeletonLoaderLibComponent, selector: "sb-uic-skeleton-loader", inputs: ["bindingClass", "height", "width"] }, { kind: "pipe", type: i2$2.DatePipe, name: "date" }, { kind: "pipe", type: i2.PipePublicURL, name: "pipePublicURL" }] }); }
|
|
7234
7234
|
}
|
|
7235
7235
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardAssessmentComponent, decorators: [{
|
|
7236
7236
|
type: Component,
|
|
7237
|
-
args: [{ selector: 'sb-uic-card-assessment', template: "<ng-container *ngIf=\"!isCardLoading\">\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\">\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container *ngIf=\"widgetData\">\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row px-4 pt-4\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<img mat-card-image class=\"margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t[src]=\"widgetData?.content?.posterImage | pipePublicURL\"\n\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\">\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<ng-template #defaultImg>\n\t\t\t\t\t\t\t\t\t\t\t<img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"card-wide-img ws-mat-primary-lite-background margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\" />\n\t\t\t\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\n\t\t\t\t\t\t\t\t<div class=\"course_widget flex margin-remove \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex flex-end course_v2\">\n\t\t\t\t\t\t\t\t\t <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n\t\t\t\t\t\t\t\t\t <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.courseCategory\"\n\t\t\t\t\t\t\t\t\t\tclass=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory? widgetData?.content?.primaryCategory:widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t </sb-uic-display-content-type>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t </div>\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex title-text mat-subheading-1\">\n\t\t\t\t\t\t\t\t\t\t{{ widgetData?.content?.name }} \n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex items-center justify-start margin-remove margin-top-xs font-normal mat-caption sub-title-text\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"course_logo_box\">\n\t\t\t\t\t\t\t\t\t\t\t<img [src]=\"widgetData?.content?.creatorLogo | pipePublicURL \"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"(widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier)\" />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<span class=\"sub-title-text ml-2\"> By\n\t\t\t\t\t\t\t\t\t\t\t{{ (widgetData?.content?.organisation &&\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0]) ?\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer padding-m\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<span>{{ startCountdown(widgetData?.content?.batch) }}</span>\n\t\t\t\t\t\t\t\t\t\t<div class=\"flex flex-row\" *ngIf=\"daysPending && eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">Assessment starts in</span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"big-text\"><b>{{ days }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">days</span> </span> : <span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"big-text\"><b>{{ hours }} </b><span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">hours</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span> : <span class=\"big-text\"> <b>{{ minutes }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">minutes</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.startDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy HH:mm' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div *ngIf=\"!daysPending\" class=\"flex flex-row\"> \n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">{{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}} ends on </span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-btn\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{{widgetData?.content?.isEnrolled ? 'Resume':'Start'}} {{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}}</span> \n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.endDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n\t<ng-container [ngTemplateOutlet]=\"skeltonLoader\"></ng-container>\n</ng-container>\n\n<ng-template #skeltonLoader>\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a>\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container>\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row padding-s\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'300px'\"\n\t\t\t\t\t\t\t\t\t\t\t[height]=\"'155px'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col margin-remove\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'200px'\" [height]=\"'20px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-top-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'250px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-remove margin-top-m items-center font-normal\">\n\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'24px'\" [height]=\"'24px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'150px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8 ml-2'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<!-- <span class=\"text-center\"><sb-uic-skeleton-loader [width]=\"'90px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader> </span> -->\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer col-row padding-l\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-template>", styles: [".card-assessment{width:100%;min-height:190px;box-sizing:border-box;min-width:340px;margin-top:16px;margin-right:12px;border-radius:12px}.image-container{width:119px;height:70px;flex-shrink:0;border-radius:8px;overflow:hidden;border:1px solid rgba(0,0,0,.08)}.image-container img{border-radius:8px;opacity:1;background-size:100%;width:100%;height:100%;flex-shrink:0;display:flex}.title-container{width:100%}.title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:48px;font:600 14px/24px Montserrat}.sub-title-text{color:#000000de;width:90%;word-break:break-word;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.course_logo_box{padding:3px;display:inline-block;width:24px;height:24px;border:1px solid #d6d6d6;border-radius:4px;box-sizing:border-box}.course_logo_box img.source-icon{height:100%;width:100%;display:inline-block}.mat-card-footer{margin:0!important}.time-span{padding:2px 8px;color:#fff;border-radius:4px;text-align:center;font-size:12px;background-color:green;width:100px}.not-started{background-color:#d13924!important}span.start-span{border-radius:50px;border:2px solid rgba(0,0,0,.08);font-size:12px;text-align:center;position:absolute;bottom:0;width:140px;left:50%;margin-left:-70px;background-color:#fff;margin-bottom:62px;margin-right:8px}.assessment-card-footer{background:#ef951e29!important;text-align:center;box-sizing:border-box;border-radius:0 0 8px 8px}.start-btn{background:#1b4ca1!important;color:#fff;font-size:14px;font-weight:600;border-radius:25px;text-align:center;padding:4px 12px}.dots-container{display:none}.big-text{font-size:16px}.small-text{font-size:12px!important;vertical-align:top;margin-left:4px}.course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}\n"] }]
|
|
7237
|
+
args: [{ selector: 'sb-uic-card-assessment', template: "<ng-container *ngIf=\"!isCardLoading\">\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a (click)=\"getRedirectUrlData(widgetData?.content); $event.stopPropagation()\">\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container *ngIf=\"widgetData\">\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row px-4 pt-4\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<img mat-card-image class=\"margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t[src]=\"widgetData?.content?.posterImage | pipePublicURL\"\n\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\">\n\t\t\t\t\t\t\t\t\t</ng-container>\n\t\t\t\t\t\t\t\t\t<ng-container *ngIf=\"!widgetData?.content?.posterImage\">\n\t\t\t\t\t\t\t\t\t\t<ng-template #defaultImg>\n\t\t\t\t\t\t\t\t\t\t\t<img mat-card-image [src]=\"defaultThumbnail\" loading=\"lazy\"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"card-wide-img ws-mat-primary-lite-background margin-remove assess-img\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"widgetData?.content?.name\" />\n\t\t\t\t\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\n\t\t\t\t\t\t\t\t<div class=\"course_widget flex margin-remove \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex flex-end course_v2\">\n\t\t\t\t\t\t\t\t\t <mat-icon class=\"mat-icon main_icon ws-mat-default-text margin-right-xs nodtranslate\">video_library</mat-icon>\n\t\t\t\t\t\t\t\t\t <sb-uic-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.courseCategory\"\n\t\t\t\t\t\t\t\t\t\tclass=\"ws-mat-black60-text font-normal mat-caption \" [displayContentType]=\"eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory? widgetData?.content?.primaryCategory:widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t\t </sb-uic-display-content-type>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t </div>\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col \">\n\t\t\t\t\t\t\t\t\t<div class=\"flex title-text mat-subheading-1\">\n\t\t\t\t\t\t\t\t\t\t{{ widgetData?.content?.name }} \n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex items-center justify-start margin-remove margin-top-xs font-normal mat-caption sub-title-text\">\n\t\t\t\t\t\t\t\t\t\t<div class=\"course_logo_box\">\n\t\t\t\t\t\t\t\t\t\t\t<img [src]=\"widgetData?.content?.creatorLogo | pipePublicURL \"\n\t\t\t\t\t\t\t\t\t\t\t\tclass=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\n\t\t\t\t\t\t\t\t\t\t\t\t[alt]=\"(widgetData?.content?.sourceName + '_' + widgetData?.content?.identifier)\" />\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<span class=\"sub-title-text ml-2\"> By\n\t\t\t\t\t\t\t\t\t\t\t{{ (widgetData?.content?.organisation &&\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0]) ?\n\t\t\t\t\t\t\t\t\t\t\twidgetData?.content?.organisation[0] : 'Karmayogi Bharat' }}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer padding-m\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<span>{{ startCountdown(widgetData?.content?.batch) }}</span>\n\t\t\t\t\t\t\t\t\t\t<div class=\"flex flex-row\" *ngIf=\"daysPending && eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM !== widgetData?.content?.courseCategory\">\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">Assessment starts in</span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"big-text\"><b>{{ days }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">days</span> </span> : <span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"big-text\"><b>{{ hours }} </b><span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">hours</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span> : <span class=\"big-text\"> <b>{{ minutes }}</b> <span\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"small-text\">minutes</span>\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.startDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy HH:mm' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t<div *ngIf=\"!daysPending\" class=\"flex flex-row\"> \n\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-span\">{{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}} ends on </span>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-s\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"start-btn\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t{{(widgetData?.content?.isEnrolled && widgetData?.content?.completionPercentage >0) ? 'Resume':'Start'}} {{eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory ? 'Program':'Assessment'}}</span> \n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"time-span flex items-center justify-center\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\" (eCourseCategory?.COMPREHENSIVE_ASSESSMENT_PROGRAM === widgetData?.content?.courseCategory) && !widgetData?.content?.isEnrolled ? 'not-started': ''\">{{widgetData?.content?.batch?.endDate\n\t\t\t\t\t\t\t\t\t\t\t\t\t| date: 'dd MMM yyy' }}</span>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-container>\n\n<ng-container *ngIf=\"isCardLoading\">\n\t<ng-container [ngTemplateOutlet]=\"skeltonLoader\"></ng-container>\n</ng-container>\n\n<ng-template #skeltonLoader>\n\t<mat-card\n\t\tclass=\"card-assessment card-scheduled-assessment card-users-container padding-remove cursor-pointer mr-4\">\n\t\t<a>\n\t\t\t<div class=\"display-contents\">\n\t\t\t\t<ng-container>\n\t\t\t\t\t<mat-card-content>\n\t\t\t\t\t\t<div class=\"flex flex-col h-full\">\n\t\t\t\t\t\t\t<div class=\"flex flex-1 flex-row padding-s\">\n\t\t\t\t\t\t\t\t<div class=\"flex image-container\">\n\t\t\t\t\t\t\t\t\t<ng-container>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'300px'\"\n\t\t\t\t\t\t\t\t\t\t\t[height]=\"'155px'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</ng-container>\n\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t<div class=\"p-4 pb-6\">\n\t\t\t\t\t\t\t\t<div class=\"flex title-container flex-col margin-remove\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'200px'\" [height]=\"'20px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-top-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'250px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-remove margin-top-m items-center font-normal\">\n\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'24px'\" [height]=\"'24px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'150px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8 ml-2'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<!-- <span class=\"text-center\"><sb-uic-skeleton-loader [width]=\"'90px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader> </span> -->\n\t\t\t\t\t\t\t<mat-card-footer class=\"assessment-card-footer col-row padding-l\">\n\t\t\t\t\t\t\t\t<div class=\"flex flex-1 items-center justify-center col-row margin-top-m\">\n\t\t\t\t\t\t\t\t\t<div class=\"flex margin-right-m\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<div class=\"flex\">\n\t\t\t\t\t\t\t\t\t\t<sb-uic-skeleton-loader [width]=\"'100px'\" [height]=\"'16px'\"\n\t\t\t\t\t\t\t\t\t\t\t[bindingClass]=\"'flex rounded br-8'\"></sb-uic-skeleton-loader>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</mat-card-footer>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</mat-card-content>\n\t\t\t\t</ng-container>\n\t\t\t</div>\n\t\t</a>\n\t</mat-card>\n</ng-template>", styles: [".card-assessment{width:100%;min-height:190px;box-sizing:border-box;min-width:340px;margin-top:16px;margin-right:12px;border-radius:12px}.image-container{width:119px;height:70px;flex-shrink:0;border-radius:8px;overflow:hidden;border:1px solid rgba(0,0,0,.08)}.image-container img{border-radius:8px;opacity:1;background-size:100%;width:100%;height:100%;flex-shrink:0;display:flex}.title-container{width:100%}.title-text{word-break:break-word;white-space:initial;margin:8px 0;position:relative;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:48px;font:600 14px/24px Montserrat}.sub-title-text{color:#000000de;width:90%;word-break:break-word;white-space:initial;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.course_logo_box{padding:3px;display:inline-block;width:24px;height:24px;border:1px solid #d6d6d6;border-radius:4px;box-sizing:border-box}.course_logo_box img.source-icon{height:100%;width:100%;display:inline-block}.mat-card-footer{margin:0!important}.time-span{padding:2px 8px;color:#fff;border-radius:4px;text-align:center;font-size:12px;background-color:green;width:100px}.not-started{background-color:#d13924!important}span.start-span{border-radius:50px;border:2px solid rgba(0,0,0,.08);font-size:12px;text-align:center;position:absolute;bottom:0;width:140px;left:50%;margin-left:-70px;background-color:#fff;margin-bottom:62px;margin-right:8px}.assessment-card-footer{background:#ef951e29!important;text-align:center;box-sizing:border-box;border-radius:0 0 8px 8px}.start-btn{background:#1b4ca1!important;color:#fff;font-size:14px;font-weight:600;border-radius:25px;text-align:center;padding:4px 12px}.dots-container{display:none}.big-text{font-size:16px}.small-text{font-size:12px!important;vertical-align:top;margin-left:4px}.course_widget{margin-top:10px}.course_widget .mat-icon{vertical-align:middle;color:#ef951e!important}.course_widget .course_v2{border:1px solid #EF951E;padding:4px 8px;align-items:end;border-radius:16px}.course_widget .main_icon{font-size:16px;width:16px;height:16px}\n"] }]
|
|
7238
7238
|
}], ctorParameters: function () { return [{ type: i2.ConfigurationsService }, { type: WidgetContentLibService }]; }, propDecorators: { widgetData: [{
|
|
7239
7239
|
type: Input
|
|
7240
7240
|
}], contentData: [{
|
|
@@ -7347,11 +7347,11 @@ class CertificateDialogComponent {
|
|
|
7347
7347
|
});
|
|
7348
7348
|
}
|
|
7349
7349
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CertificateDialogComponent, deps: [{ token: 'environment' }, { token: i2.EventService }, { token: i2$1.TranslateService }, { token: i2.MultilingualTranslationsService }, { token: i1$3.MatLegacyDialogRef }, { token: MAT_LEGACY_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7350
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CertificateDialogComponent, selector: "sb-uic-certificate-dialog", host: { classAttribute: "certificate-inner-dialog-panel" }, ngImport: i0, template: "<mat-card class=\"no-shadow certificate-img-box\">\n <button mat-icon-button class=\"close-button\" [mat-dialog-close]=\"true\">\n <mat-icon class=\"close-icon\" color=\"warn\">close</mat-icon>\n </button>\n <!-- <mat-card-title>\n\n </mat-card-title> -->\n <mat-card-content class=\"certificate-img-content\">\n <img #certificate [src]=\"url| pipeSafeSanitizer: 'url'\" alt=\"Certificate\" role=\"image\" class=\"certificate-banner-image\">\n </mat-card-content>\n <mat-card-actions class=\"flex gap-4 flex-row-reverse\">\n <!-- <ws-widget-svg-to-pdf></ws-widget-svg-to-pdf> -->\n <a mat-button (click)=\"shareCert()\" class=\"ws-mat-accent-border-active mat-accent btn-custom\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">share</mat-icon>\n Share\n </a>\n <a mat-button [matMenuTriggerFor]=\"menu\" class=\"ws-mat-accent-border-active mat-accent btn-custom\" (click)=\"raiseIntreactTelemetry()\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">cloud_download</mat-icon>\n {{'certificatedialog.download' | translate}}\n </a>\n <mat-menu #menu=\"matMenu\">\n <button mat-menu-item (click)='downloadCertPdf()'>\n <mat-icon>picture_as_pdf</mat-icon>\n <span>{{'certificatedialog.pdf' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCertPng()'>\n <mat-icon>photo</mat-icon>\n <span>{{'certificatedialog.png' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCert()'>\n <mat-icon>photo_size_select_actual</mat-icon>\n <span>{{'certificatedialog.svg' | translate}}</span>\n </button>\n </mat-menu>\n </mat-card-actions>\n</mat-card>\n", styles: [".no-shadow{box-shadow:none!important}.certificate-banner-image{height:30rem;display:flex;width:auto;margin:0 auto}@media only screen and (max-width: 1279px){.certificate-banner-image{width:100%;height:auto;flex:1}}.certificate-img-box{max-height:35rem;overflow-y:auto;overflow-x:hidden}.certificate-img-content{overflow:hidden}a.download_btn{background-color:#f0f0f0;border-radius:4px;float:right;height:40px;padding:0 16px;text-align:center;line-height:40px;text-decoration:none;color:#0009;font-size:14px;font-weight:600;margin-top:16px;margin-right:0}.download_icon{font-size:16px;vertical-align:text-top}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important}.close-icon{transition:1s ease-in-out;color:#fff!important}.close-icon:hover{transform:rotate(180deg)}::ng-deep .icon-outside .close-button{float:right;top:-52px;right:-52px}::ng-deep .icon-outside .mat-dialog-container{overflow:unset}::ng-deep .cdk-overlay-pane{max-height:96%!important;overflow-y:auto!important}.certificate-banner-image svg{width:500;height:500}@media only screen and (max-width: 1279px){.certificate-banner-image svg{width:auto;height:auto;flex:1}}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important;border-radius:
|
|
7350
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CertificateDialogComponent, selector: "sb-uic-certificate-dialog", host: { classAttribute: "certificate-inner-dialog-panel" }, ngImport: i0, template: "<mat-card class=\"no-shadow certificate-img-box\">\n <button mat-icon-button class=\"close-button\" [mat-dialog-close]=\"true\">\n <mat-icon class=\"close-icon\" color=\"warn\">close</mat-icon>\n </button>\n <!-- <mat-card-title>\n\n </mat-card-title> -->\n <mat-card-content class=\"certificate-img-content\">\n <img #certificate [src]=\"url| pipeSafeSanitizer: 'url'\" alt=\"Certificate\" role=\"image\" class=\"certificate-banner-image\">\n </mat-card-content>\n <mat-card-actions class=\"flex gap-4 flex-row-reverse\">\n <!-- <ws-widget-svg-to-pdf></ws-widget-svg-to-pdf> -->\n <a mat-button (click)=\"shareCert()\" class=\"ws-mat-accent-border-active mat-accent btn-custom\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">share</mat-icon>\n Share\n </a>\n <a mat-button [matMenuTriggerFor]=\"menu\" class=\"ws-mat-accent-border-active mat-accent btn-custom\" (click)=\"raiseIntreactTelemetry()\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">cloud_download</mat-icon>\n {{'certificatedialog.download' | translate}}\n </a>\n <mat-menu #menu=\"matMenu\">\n <button mat-menu-item (click)='downloadCertPdf()'>\n <mat-icon>picture_as_pdf</mat-icon>\n <span>{{'certificatedialog.pdf' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCertPng()'>\n <mat-icon>photo</mat-icon>\n <span>{{'certificatedialog.png' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCert()'>\n <mat-icon>photo_size_select_actual</mat-icon>\n <span>{{'certificatedialog.svg' | translate}}</span>\n </button>\n </mat-menu>\n </mat-card-actions>\n</mat-card>\n", styles: [".no-shadow{box-shadow:none!important}.certificate-banner-image{height:30rem;display:flex;width:auto;margin:0 auto}@media only screen and (max-width: 1279px){.certificate-banner-image{width:100%;height:auto;flex:1}}.certificate-img-box{max-height:35rem;overflow-y:auto;overflow-x:hidden}.certificate-img-content{overflow:hidden}a.download_btn{background-color:#f0f0f0;border-radius:4px;float:right;height:40px;padding:0 16px;text-align:center;line-height:40px;text-decoration:none;color:#0009;font-size:14px;font-weight:600;margin-top:16px;margin-right:0}.download_icon{font-size:16px;vertical-align:text-top}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important}.close-icon{transition:1s ease-in-out;color:#fff!important}.close-icon:hover{transform:rotate(180deg)}::ng-deep .icon-outside .close-button{float:right;top:-52px;right:-52px}::ng-deep .icon-outside .mat-dialog-container{overflow:unset}::ng-deep .cdk-overlay-pane{max-height:96%!important;overflow-y:auto!important}.certificate-banner-image svg{width:500;height:500}@media only screen and (max-width: 1279px){.certificate-banner-image svg{width:auto;height:auto;flex:1}}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important;border-radius:50%!important}.ws-mat-accent-border{border:1px solid rgba(255,255,255,.08)}.ws-mat-accent-border-active{border:1px solid rgb(27,76,161);color:#1b4ca1}.mat-button,.mat-flat-button,.mat-icon-button,.mat-stroked-button,.btn-custom{box-sizing:border-box;position:relative;-webkit-user-select:none;user-select:none;cursor:pointer;outline:0;border:none;-webkit-tap-highlight-color:transparent;display:inline-block;white-space:nowrap;text-decoration:none;vertical-align:baseline;text-align:center;margin:0;min-width:64px;line-height:36px;padding:0 16px;border-radius:4px;overflow:visible}.close-icon{position:absolute!important;top:19px!important;right:18px!important}\n"], dependencies: [{ kind: "component", type: i4$1.MatLegacyMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4$1.MatLegacyMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.MatLegacyMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i6$1.MatLegacyCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "directive", type: i6$1.MatLegacyCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { kind: "directive", type: i6$1.MatLegacyCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1$3.MatLegacyDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "component", type: i8.MatLegacyButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i8.MatLegacyAnchor, selector: "a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab], a[mat-stroked-button], a[mat-flat-button]", inputs: ["disabled", "disableRipple", "color", "tabIndex"], exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: i2.PipeSafeSanitizerPipe, name: "pipeSafeSanitizer" }, { kind: "pipe", type: i2$1.TranslatePipe, name: "translate" }] }); }
|
|
7351
7351
|
}
|
|
7352
7352
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CertificateDialogComponent, decorators: [{
|
|
7353
7353
|
type: Component,
|
|
7354
|
-
args: [{ selector: 'sb-uic-certificate-dialog', host: { class: 'certificate-inner-dialog-panel' }, template: "<mat-card class=\"no-shadow certificate-img-box\">\n <button mat-icon-button class=\"close-button\" [mat-dialog-close]=\"true\">\n <mat-icon class=\"close-icon\" color=\"warn\">close</mat-icon>\n </button>\n <!-- <mat-card-title>\n\n </mat-card-title> -->\n <mat-card-content class=\"certificate-img-content\">\n <img #certificate [src]=\"url| pipeSafeSanitizer: 'url'\" alt=\"Certificate\" role=\"image\" class=\"certificate-banner-image\">\n </mat-card-content>\n <mat-card-actions class=\"flex gap-4 flex-row-reverse\">\n <!-- <ws-widget-svg-to-pdf></ws-widget-svg-to-pdf> -->\n <a mat-button (click)=\"shareCert()\" class=\"ws-mat-accent-border-active mat-accent btn-custom\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">share</mat-icon>\n Share\n </a>\n <a mat-button [matMenuTriggerFor]=\"menu\" class=\"ws-mat-accent-border-active mat-accent btn-custom\" (click)=\"raiseIntreactTelemetry()\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">cloud_download</mat-icon>\n {{'certificatedialog.download' | translate}}\n </a>\n <mat-menu #menu=\"matMenu\">\n <button mat-menu-item (click)='downloadCertPdf()'>\n <mat-icon>picture_as_pdf</mat-icon>\n <span>{{'certificatedialog.pdf' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCertPng()'>\n <mat-icon>photo</mat-icon>\n <span>{{'certificatedialog.png' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCert()'>\n <mat-icon>photo_size_select_actual</mat-icon>\n <span>{{'certificatedialog.svg' | translate}}</span>\n </button>\n </mat-menu>\n </mat-card-actions>\n</mat-card>\n", styles: [".no-shadow{box-shadow:none!important}.certificate-banner-image{height:30rem;display:flex;width:auto;margin:0 auto}@media only screen and (max-width: 1279px){.certificate-banner-image{width:100%;height:auto;flex:1}}.certificate-img-box{max-height:35rem;overflow-y:auto;overflow-x:hidden}.certificate-img-content{overflow:hidden}a.download_btn{background-color:#f0f0f0;border-radius:4px;float:right;height:40px;padding:0 16px;text-align:center;line-height:40px;text-decoration:none;color:#0009;font-size:14px;font-weight:600;margin-top:16px;margin-right:0}.download_icon{font-size:16px;vertical-align:text-top}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important}.close-icon{transition:1s ease-in-out;color:#fff!important}.close-icon:hover{transform:rotate(180deg)}::ng-deep .icon-outside .close-button{float:right;top:-52px;right:-52px}::ng-deep .icon-outside .mat-dialog-container{overflow:unset}::ng-deep .cdk-overlay-pane{max-height:96%!important;overflow-y:auto!important}.certificate-banner-image svg{width:500;height:500}@media only screen and (max-width: 1279px){.certificate-banner-image svg{width:auto;height:auto;flex:1}}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important;border-radius:
|
|
7354
|
+
args: [{ selector: 'sb-uic-certificate-dialog', host: { class: 'certificate-inner-dialog-panel' }, template: "<mat-card class=\"no-shadow certificate-img-box\">\n <button mat-icon-button class=\"close-button\" [mat-dialog-close]=\"true\">\n <mat-icon class=\"close-icon\" color=\"warn\">close</mat-icon>\n </button>\n <!-- <mat-card-title>\n\n </mat-card-title> -->\n <mat-card-content class=\"certificate-img-content\">\n <img #certificate [src]=\"url| pipeSafeSanitizer: 'url'\" alt=\"Certificate\" role=\"image\" class=\"certificate-banner-image\">\n </mat-card-content>\n <mat-card-actions class=\"flex gap-4 flex-row-reverse\">\n <!-- <ws-widget-svg-to-pdf></ws-widget-svg-to-pdf> -->\n <a mat-button (click)=\"shareCert()\" class=\"ws-mat-accent-border-active mat-accent btn-custom\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">share</mat-icon>\n Share\n </a>\n <a mat-button [matMenuTriggerFor]=\"menu\" class=\"ws-mat-accent-border-active mat-accent btn-custom\" (click)=\"raiseIntreactTelemetry()\">\n <mat-icon class=\"mat-icon material-icons-outlined download_icon margin-right-xs\">cloud_download</mat-icon>\n {{'certificatedialog.download' | translate}}\n </a>\n <mat-menu #menu=\"matMenu\">\n <button mat-menu-item (click)='downloadCertPdf()'>\n <mat-icon>picture_as_pdf</mat-icon>\n <span>{{'certificatedialog.pdf' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCertPng()'>\n <mat-icon>photo</mat-icon>\n <span>{{'certificatedialog.png' | translate}}</span>\n </button>\n <button mat-menu-item (click)='downloadCert()'>\n <mat-icon>photo_size_select_actual</mat-icon>\n <span>{{'certificatedialog.svg' | translate}}</span>\n </button>\n </mat-menu>\n </mat-card-actions>\n</mat-card>\n", styles: [".no-shadow{box-shadow:none!important}.certificate-banner-image{height:30rem;display:flex;width:auto;margin:0 auto}@media only screen and (max-width: 1279px){.certificate-banner-image{width:100%;height:auto;flex:1}}.certificate-img-box{max-height:35rem;overflow-y:auto;overflow-x:hidden}.certificate-img-content{overflow:hidden}a.download_btn{background-color:#f0f0f0;border-radius:4px;float:right;height:40px;padding:0 16px;text-align:center;line-height:40px;text-decoration:none;color:#0009;font-size:14px;font-weight:600;margin-top:16px;margin-right:0}.download_icon{font-size:16px;vertical-align:text-top}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important}.close-icon{transition:1s ease-in-out;color:#fff!important}.close-icon:hover{transform:rotate(180deg)}::ng-deep .icon-outside .close-button{float:right;top:-52px;right:-52px}::ng-deep .icon-outside .mat-dialog-container{overflow:unset}::ng-deep .cdk-overlay-pane{max-height:96%!important;overflow-y:auto!important}.certificate-banner-image svg{width:500;height:500}@media only screen and (max-width: 1279px){.certificate-banner-image svg{width:auto;height:auto;flex:1}}.close-button{float:right;top:-16px;right:-12px;height:30px;width:30px;line-height:30px;background:#000!important;color:#fff!important;border-radius:50%!important}.ws-mat-accent-border{border:1px solid rgba(255,255,255,.08)}.ws-mat-accent-border-active{border:1px solid rgb(27,76,161);color:#1b4ca1}.mat-button,.mat-flat-button,.mat-icon-button,.mat-stroked-button,.btn-custom{box-sizing:border-box;position:relative;-webkit-user-select:none;user-select:none;cursor:pointer;outline:0;border:none;-webkit-tap-highlight-color:transparent;display:inline-block;white-space:nowrap;text-decoration:none;vertical-align:baseline;text-align:center;margin:0;min-width:64px;line-height:36px;padding:0 16px;border-radius:4px;overflow:visible}.close-icon{position:absolute!important;top:19px!important;right:18px!important}\n"] }]
|
|
7355
7355
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
7356
7356
|
type: Inject,
|
|
7357
7357
|
args: ['environment']
|