@sunbird-cb/collection 1.0.45 → 1.0.46

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.
Files changed (12) hide show
  1. package/bundles/sunbird-cb-collection.umd.js +1 -1
  2. package/bundles/sunbird-cb-collection.umd.js.map +1 -1
  3. package/bundles/sunbird-cb-collection.umd.min.js +1 -1
  4. package/bundles/sunbird-cb-collection.umd.min.js.map +1 -1
  5. package/esm2015/lib/card-content/card-content.component.js +2 -2
  6. package/esm5/lib/card-content/card-content.component.js +2 -2
  7. package/fesm2015/sunbird-cb-collection.js +1 -1
  8. package/fesm2015/sunbird-cb-collection.js.map +1 -1
  9. package/fesm5/sunbird-cb-collection.js +1 -1
  10. package/fesm5/sunbird-cb-collection.js.map +1 -1
  11. package/package.json +1 -1
  12. package/sunbird-cb-collection.metadata.json +1 -1
package/fesm2015/sunbird-cb-collection.js CHANGED
@@ -8113,7 +8113,7 @@ class CardContentComponent extends WidgetBaseComponent {
8113
8113
  CardContentComponent.decorators = [
8114
8114
  { type: Component, args: [{
8115
8115
  selector: 'ws-widget-card-content',
8116
- template: "<!-- -->\r\n<ng-container *ngIf=\"widgetData && (((widgetData?.deletedMode || 'none') === 'hide' && !!!isLiveOrMarkForDeletion)\r\n? false\r\n: !((widgetData?.intranetMode || 'none') === 'hide' && !!showIntranetContent))\"\r\n [ngSwitch]=\"( (widgetData && widgetData?.cardSubType) || 'cardStandard')\">\r\n <ng-container *ngSwitchCase=\"'minimal'\" [ngTemplateOutlet]=\"cardMinimal\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'space-saving'\" [ngTemplateOutlet]=\"cardSpaceSaving\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'basic-info'\" [ngTemplateOutlet]=\"cardBasicInformation\"></ng-container>\r\n <!-- <ng-container *ngSwitchCase=\"'card-user-details'\" [ngTemplateOutlet]=\"cardWithUserDetails\"></ng-container> -->\r\n <ng-container *ngSwitchCase=\"'card-description-back'\" [ngTemplateOutlet]=\"cardDescriptionBack\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'basic-details'\" [ngTemplateOutlet]=\"cardBasicDetails\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'card-discussion'\" [ngTemplateOutlet]=\"cardDiscussion\"></ng-container>\r\n <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardStandard\"></ng-container>\r\n</ng-container>\r\n\r\n<ng-template #cardMinimal>\r\n <div [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-minimal-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" class=\"card-link\" role=\"link\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img [src]=\"widgetData.content.appIcon\" class=\"card-thumbnail ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <div class=\"card-overlay\">\r\n <h3 *ngIf=\"widgetData.content.name\" class=\"text-truncate card-title\">\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\">\r\n {{ widgetData.content.name }}\r\n </a>\r\n </h3>\r\n <div class=\"flex justify-between items-center\">\r\n <div>\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\" class=\"mr-4 font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n <span *ngIf=\"widgetData.content.duration\" i18n-title title=\"Duration\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </span>\r\n </div>\r\n <button mat-icon-button i18n-aria-label aria-label=\"action items\" [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n </div>\r\n </div>\r\n</ng-template>\r\n<mat-menu #cardMenu=\"matMenu\">\r\n <ng-template matMenuContent>\r\n <div mat-menu-item>\r\n <ws-widget-btn-content-download [widgetData]=\"\r\n widgetData.content\r\n | pipePartialContent\r\n : [\r\n 'identifier',\r\n 'contentType',\r\n 'resourceType',\r\n 'mimeType',\r\n 'downloadUrl',\r\n 'isExternal',\r\n 'artifactUrl'\r\n ]\r\n \"></ws-widget-btn-content-download>\r\n <ws-widget-btn-content-like [widgetData]=\"widgetData.content | pipePartialContent: ['identifier']\">\r\n </ws-widget-btn-content-like>\r\n <ws-widget-btn-content-mail-me [widgetData]=\"widgetData.content\"></ws-widget-btn-content-mail-me>\r\n <ws-widget-btn-content-share [widgetData]=\"widgetData.content\"></ws-widget-btn-content-share>\r\n <ws-widget-btn-channel-analytics [widgetData]=\"widgetData.content\"></ws-widget-btn-channel-analytics>\r\n <ws-widget-btn-kb [contentId]=\"widgetData?.content?.identifier\" [forPreview]=\"false\"\r\n [contentName]=\"widgetData?.content?.name\" [contentType]=\"widgetData?.content?.contentType\">\r\n </ws-widget-btn-kb>\r\n <!-- <ws-widget-btn-follow [widgetData]=\"{\r\n targetId: widgetData?.content?.identifier,\r\n type: widgetData?.content?.contentType\r\n }\" *ngIf=\"isKnowledgeBoard\"></ws-widget-btn-follow> -->\r\n <ws-widget-btn-goals *ngIf=\"btnGoalsConfig\" [widgetData]=\"btnGoalsConfig\"></ws-widget-btn-goals>\r\n <ws-widget-btn-playlist *ngIf=\"btnPlaylistConfig\" [widgetData]=\"btnPlaylistConfig\">\r\n </ws-widget-btn-playlist>\r\n <ws-widget-btn-kb-analytics [widgetData]=\"\r\n widgetData.content\r\n | pipePartialContent\r\n : [\r\n 'identifier',\r\n 'contentType',\r\n 'resourceType',\r\n 'mimeType',\r\n 'downloadUrl',\r\n 'isExternal',\r\n 'artifactUrl'\r\n ]\r\n \"></ws-widget-btn-kb-analytics>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template #cardSpaceSaving>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-space-saving-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <ng-container *ngIf=\"!isCardFlipped\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"card-header-meta\">\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\" class=\"ws-mat-primary-text font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n <span *ngIf=\"widgetData.content.duration\" class=\"text-gray-600\" i18n-title title=\"Duration\">\r\n &nbsp;&nbsp;|&nbsp;&nbsp;{{\r\n widgetData.content.duration | pipeDurationTransform: 'hms'\r\n }}\r\n </span>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title text-truncate title-text\" title=\"Title\" i18n-title>\r\n {{ widgetData.content.name }}\r\n </div>\r\n </a>\r\n <div class=\"mt-4 flex justify-between items-center flip-actions\">\r\n <div>\r\n <div *ngIf=\"widgetData.content.sourceName\" class=\"ws-mat-primary-text mat-subheading-1 source-name\"\r\n i18n-title title=\"Source\">\r\n {{ widgetData.content.sourceName }}\r\n </div>\r\n <div *ngIf=\"widgetData.content.complexityLevel\" i18n-title title=\"Complexity Level\" class=\"text-gray-600\">\r\n {{ widgetData.content.complexityLevel }}\r\n </div>\r\n </div>\r\n <div class=\"flex\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" (click)=\"isCardFlipped = !isCardFlipped\" mat-icon-button i18n-aria-label\r\n aria-label=\"action items\">\r\n <mat-icon>flip_to_back</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"isCardFlipped\">\r\n <mat-card-content>\r\n <div class=\"card-header-meta\">\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\" class=\"ws-mat-primary-text font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n <span *ngIf=\"widgetData.content.duration\" class=\"text-gray-600\" i18n-title title=\"Duration\">\r\n &nbsp;&nbsp;|&nbsp;&nbsp;{{\r\n widgetData.content.duration | pipeDurationTransform: 'hms'\r\n }}\r\n </span>\r\n </div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" aria-label=\"Content\"\r\n i18n-aria-label=\"Content | Click to view\" class=\"ws-mat-primary-text mat-title text-truncate title-text\">\r\n {{ widgetData.content.name }}\r\n </a>\r\n <div *ngIf=\"widgetData?.content?.description\" class=\"mt-4 flip-desc-text ws-mat-text-block-fade-gradient\">\r\n {{ widgetData?.content?.description }}\r\n </div>\r\n <div class=\"mt-4 flex justify-between items-center flip-actions\">\r\n <div>\r\n <div *ngIf=\"widgetData.content.sourceName\" class=\"ws-mat-primary-text mat-subheading-1 source-name\"\r\n i18n-title title=\"Source\">\r\n {{ widgetData.content.sourceName }}\r\n </div>\r\n <div *ngIf=\"widgetData.content.complexityLevel\" i18n-title title=\"Complexity Level\" class=\"text-gray-600\">\r\n {{ widgetData.content.complexityLevel }}\r\n </div>\r\n </div>\r\n <div class=\"flex\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" (click)=\"isCardFlipped = !isCardFlipped\" mat-icon-button aria-label=\"action items\">\r\n <mat-icon>flip_to_front</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #rating>\r\n <div class=\"flex items-center mr-2\">\r\n <mat-icon class=\"mr-1\" *ngIf=\"widgetData?.content?.averageRating == 5\" color=\"accent\">star</mat-icon>\r\n <mat-icon class=\"mr-1\" *ngIf=\"widgetData?.content?.averageRating && widgetData.content.averageRating != 5\"\r\n color=\"accent\">star_half</mat-icon>\r\n <mat-icon class=\"mr-1\" *ngIf=\"!widgetData?.content?.averageRating\">star_border</mat-icon>\r\n <span>{{ widgetData?.content?.averageRating | number: '1.1-1' }}</span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #cardBasicInformation>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-basic-infomartion-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n </a>\r\n\r\n <mat-card-content class=\"m-small\">\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"ws-mat-primary-background text-truncate px-4 py-2 -mx-4 text-white\">\r\n <span *ngIf=\"widgetData.content?.complexityLevel\">{{\r\n widgetData.content?.complexityLevel\r\n }}</span>\r\n\r\n <span i18n *ngIf=\"widgetData.content?.subTitle\">\r\n |\r\n </span>\r\n <span matTooltipPosition=\"right\" [matTooltip]=\"widgetData.content?.subTitle\">\r\n {{ widgetData.content?.subTitle }}\r\n </span>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <div class=\"h-5\">\r\n <div *ngIf=\"showContentTag && widgetData.contentTags && widgetData.contentTags.tag\" i18n\r\n class=\"mode-tag px-2 ws-mat-primary-background\">\r\n {{ widgetData.contentTags.tag }}\r\n </div>\r\n </div>\r\n </a>\r\n </mat-card-content>\r\n <div class=\"flex justify-between items-center\">\r\n <img alt=\"source img\" [src]=\"widgetData.content.sourceIconUrl\" *ngIf=\"widgetData.content.sourceIconUrl\"\r\n class=\"source-image mr-1\" />\r\n <div *ngIf=\"widgetData.content.sourceName\" class=\"source-name w-64 text-truncate\" i18n-title title=\"Source\">\r\n {{ widgetData.content.sourceName }}\r\n </div>\r\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\" [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #cardDescriptionBack>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-Client-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <ng-container *ngIf=\"!isCardFlipped\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" class=\"rounded-t\" role=\"link\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <button class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button (click)=\"isCardFlipped = true\"\r\n aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\r\n <mat-icon>flip_to_back</mat-icon>\r\n </button>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"text-gray-600 complexity flex-middle\">\r\n <mat-icon matTooltip=\"{{ imageIcon[1] }}\">{{ imageIcon[0] }}</mat-icon>\r\n\r\n <div class=\"ws-mat-primary-text pl-2 text-lg title-text margin-bottom-xs margin-top-xs\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <!-- <mat-icon>check_circle_outline</mat-icon> -->\r\n </div>\r\n <div class=\"text-gray-600 duration flex-between flex-center pb-1\">\r\n <div *ngIf=\"widgetData.content.duration\" i18n-title title=\"Duration\" class=\"overflow-hidden\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </div>\r\n <div *ngIf=\"widgetData.content.viewCount && widgetData.content.viewCount.Client\" class=\"duration-time\"\r\n i18n-title title=\"View Count\">\r\n {{ widgetData.content.viewCount.Client | pipeCountTransform }} views\r\n </div>\r\n <div *ngIf=\"!widgetData.content.viewCount || !widgetData.content.viewCount.Client\" class=\"duration-time\"\r\n i18n-title title=\"View Count\">\r\n No views\r\n </div>\r\n <div *ngIf=\"widgetData.content.resourceType\" class=\"resource-type\" i18n-title title=\"resource Type\">\r\n {{ widgetData.content.resourceType }}\r\n </div>\r\n </div>\r\n\r\n <!-- <mat-chip-list>\r\n <mat-chip color=\"accent\" selected>\r\n OnBoarding\r\n </mat-chip>\r\n </mat-chip-list> -->\r\n </a>\r\n <mat-divider></mat-divider>\r\n <div class=\"flex flex-middle\">\r\n <ws-widget-btn-content-share [widgetData]=\"widgetData.content\"></ws-widget-btn-content-share>\r\n <ws-widget-btn-content-like [color]=\"'primary'\" class=\"flex items-center\"\r\n [widgetData]=\"widgetData.content | pipePartialContent: ['identifier']\" [likesCount]=\"widgetData.likes\">\r\n </ws-widget-btn-content-like>\r\n\r\n <ws-widget-btn-playlist *ngIf=\"btnPlaylistConfig\" [widgetData]=\"btnPlaylistConfig\">\r\n </ws-widget-btn-playlist>\r\n <ws-widget-btn-content-download [widgetData]=\"\r\n widgetData.content\r\n | pipePartialContent\r\n : [\r\n 'identifier',\r\n 'contentType',\r\n 'resourceType',\r\n 'mimeType',\r\n 'downloadUrl',\r\n 'isExternal',\r\n 'artifactUrl'\r\n ]\r\n \"></ws-widget-btn-content-download>\r\n\r\n <mat-icon class=\"px-2 cursor-pointer\" aria-label=\"Comment\" i18n-aria-label matTooltip=\"Comment\"\r\n i18n-matTooltip=\"Comment Button\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" [fragment]=\"'discussion-forum'\">\r\n comment</mat-icon>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"isCardFlipped\">\r\n <div class=\"flex items-center\">\r\n <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>Description</h2>\r\n <button mat-icon-button (click)=\"isCardFlipped = false\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n <p class=\"text-description-trim mat-body-1\">\r\n {{ widgetData.content.description }}\r\n </p>\r\n </ng-container>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #cardBasicDetails>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-standard-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"text-gray-600 complexity flex-between flex-center\">\r\n <div *ngIf=\"widgetData.content.duration\" class=\"duration\" i18n-title title=\"Duration\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </div>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <div class=\"description-text ws-mat-text-block-fade-gradient mb-4\" i18n-title title=\"Description\">\r\n {{ widgetData.content.description | pipeHtmlTagRemoval }}\r\n </div>\r\n <div class=\"text-gray-600 complexity flex-end\">\r\n <div class=\"flex items-center\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\"\r\n [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </a>\r\n </mat-card-content>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n\r\n<ng-template #cardDiscussion>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-discussions-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <mat-card-content>\r\n\r\n <!-- <div class=\"text-gray-600 complexity flex-between flex-center\">\r\n <div *ngIf=\"widgetData.content.duration\" class=\"duration\" i18n-title title=\"Duration\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </div>\r\n </div> -->\r\n <!-- <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div> -->\r\n <div class=\"flex flex-1 flex-row\">\r\n <div class=\"flex-9 description-text mb-4\" i18n-title title=\"Description\">\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"['/app/discuss']\" class=\"flex flex-column\"\r\n [queryParams]=\"{'disid':'abc-bcdf-mnj-llk'}\" role=\"link\" aria-label=\"Content\" i18n-aria-label>\r\n <h2 class=\"ws-mat-primary-text mat-title title-text\"> {{ widgetData.content.name }}</h2>\r\n </a>\r\n </div>\r\n <div class=\"flex flex-1\">\r\n <div class=\"ws-mat-default-text\">\r\n <span>{{5}} hours ago</span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"flex flex-1 flex-row\">\r\n <div class=\"flex-9 description-text mb-4\" i18n-title title=\"Description\">\r\n Asked by <a (click)=\"raiseTelemetry()\" [routerLink]=\"['/app/person-profile']\"\r\n [queryParams]=\"{'emailId':'amit.sengar@tarento.com'}\" role=\"link\" aria-label=\"Content\" i18n-aria-label>\r\n <span class=\"ws-mat-default-text\">{{'Amit Kumar'}}</span>\r\n </a>\r\n </div>\r\n <div class=\"flex flex-1\">\r\n <div class=\"typeofc\">\r\n <span>Law</span>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <mat-accordion>\r\n <mat-expansion-panel class=\"no-box\" (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\">\r\n <mat-expansion-panel-header #panelH (click)=\"panelH._toggle()\">\r\n <mat-panel-title> -->\r\n <div class=\"flex flex-1 flex-row\">\r\n <div class=\"flex flex-1\">\r\n <div class=\"flex flex-1 flex-row\">\r\n <span>\r\n <mat-icon class=\"ws-mat-warn-text\">thumb_up_off_alt</mat-icon>\r\n </span>\r\n &nbsp;\r\n <h3 class=\"ws-mat-warn-text\">{{21}}</h3>\r\n &nbsp;\r\n &nbsp;\r\n <span>\r\n <mat-icon class=\"ws-mat-primary-text\">reply</mat-icon>\r\n </span>\r\n &nbsp;\r\n <h3 class=\"ws-mat-warn-text\">Reply</h3>\r\n </div>\r\n </div>\r\n <div class=\"flex flex-1 center-right\">\r\n <span>view {{2}} replies\r\n <!-- <mat-icon>keyboard_arrow_up </mat-icon> -->\r\n </span>\r\n </div>\r\n </div>\r\n <!-- </mat-panel-title>\r\n <mat-panel-description>\r\n <span class=\"flex flex-1 center-right\" (click)=\"panelH._toggle()\">view {{2}} replies</span>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n <div>\r\n <p>I'm visible because I am open</p>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion> -->\r\n\r\n\r\n </mat-card-content>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #cardStandard>\r\n <mat-card class=\"card-standard-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <!-- <ws-widget-content-progress\r\n class=\"progress-bar\"\r\n *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\"\r\n ></ws-widget-content-progress> -->\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <ng-container *ngIf=\"!isCardFlipped\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <!-- <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" class=\"rounded-t\" role=\"link\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\"> -->\r\n <div style=\"position: relative; z-index: 1;\">\r\n <img mat-card-image style=\"position: absolute; z-index: 2;\" [src]=\"widgetData.content.appIcon\"\r\n class=\"card-img ws-mat-primary-lite-background\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\r\n [alt]=\"widgetData.content.name\" />\r\n <div class=\"source-div\">\r\n <!-- [src]=\"sourseIcon(widgetData.content.sourceName)\" -->\r\n <img [src]=\"widgetData.content.creatorLogo\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\r\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\r\n <!-- [title]=\"widgetData.content.sourceName\" -->\r\n </div>\r\n </div>\r\n <!-- </a> -->\r\n <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\r\n (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\r\n <mat-icon>flip_to_back</mat-icon>\r\n </button>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" i18n-aria-label>\r\n\r\n <div class=\"text-gray-time complexity flex-between flex-center\">\r\n <!-- <div *ngIf=\"widgetData.content.complexityLevel\" i18n-title title=\"Complexity Level\">\r\n {{ widgetData.content.complexityLevel }}\r\n </div> -->\r\n <div *ngIf=\"showIsMode\" i18n i18n-title title=\"Newly Added\"\r\n class=\"mode-tag px-2 ws-mat-accent-background\">\r\n Newly Added\r\n </div>\r\n\r\n <div *ngIf=\"widgetData.content.duration\" class=\"duration\">\r\n <mat-icon>access_time</mat-icon>\r\n <span class=\"time-text\">{{ widgetData.content.duration | pipeDurationTransform: 'hms' }}</span>\r\n </div>\r\n </div>\r\n\r\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\r\n class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <div class=\"mat-body-2 ws-mat-primary-text description-text ws-mat-text-block-fade-gradient mb-10\">\r\n {{ widgetData.content.description | pipeHtmlTagRemoval }}\r\n <!-- {{widgetData.content | json}} -->\r\n <!-- {{widgetData.content.sourceName}} -->\r\n </div>\r\n </a>\r\n <div class=\"mt-4 flex justify-between items-center absolute bottom-0 left-0 right-0 px-3 py-2\">\r\n <!-- <ws-widget-display-content-type\r\n i18n-title\r\n title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\"\r\n class=\"ws-mat-primary-text font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\"\r\n >\r\n </ws-widget-display-content-type> -->\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.contentType\"\r\n class=\"ws-mat-primary-text font-normal\" [displayContentType]=\"widgetData.content?.contentType==='Collection'\r\n ?'Module'\r\n :(widgetData.content?.contentType==='Learning Path'?'Program':widgetData.content?.contentType)\">\r\n </ws-widget-display-content-type>\r\n <div class=\"flex items-center\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" mat-icon-button i18n-aria-label [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"isCardFlipped\">\r\n <div class=\"flex items-center\">\r\n <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>Reason</h2>\r\n <button mat-icon-button (click)=\"isCardFlipped = false\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n <p class=\"text-justify mat-body-1\">\r\n {{ widgetData.content.reason }}\r\n </p>\r\n </ng-container>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n\r\n<!-- <ng-template #cardWithUserDetails>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData?.content?.name\"\r\n class=\"card-with-user-details-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <div *ngIf=\"\r\n widgetData?.content?.creatorDetails?.length ||\r\n widgetData?.content?.creatorContacts?.length\r\n \" class=\"flex flex-wrap items-center mb-4\">\r\n <ws-widget-user-image class=\"author-image\" [userName]=\"\r\n widgetData?.content?.creatorDetails && (widgetData.content?.creatorDetails)[0]?.name\r\n ? (widgetData?.content?.creatorDetails)[0]?.name\r\n : (widgetData?.content?.creatorContacts)[0]?.name\r\n \" [userId]=\"\r\n widgetData?.content?.creatorDetails && (widgetData.content?.creatorDetails)[0]?.id\r\n ? (widgetData?.content?.creatorDetails)[0]?.id\r\n : (widgetData?.content?.creatorContacts)[0]?.id\r\n \" [imageType]=\"'name-initial'\"></ws-widget-user-image>\r\n <div class=\"width-expand\">\r\n <div class=\"margin-remove font-semibold text-truncate\">\r\n {{\r\n widgetData.content?.creatorDetails && (widgetData.content?.creatorDetails)[0].name\r\n ? (widgetData.content?.creatorDetails)[0]?.name === 'null null'\r\n ? 'Not disclosed'\r\n : (widgetData.content?.creatorDetails)[0]?.name\r\n : (widgetData.content?.creatorContacts)[0]?.name === 'null null'\r\n ? 'Not disclosed'\r\n : (widgetData.content?.creatorContacts)[0]?.name\r\n }}\r\n {{ checkDisplayName }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <img mat-card-image [src]=\"widgetData?.content?.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [ngClass]=\"{ 'greyed-img': isGreyedImage }\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\r\n [alt]=\"widgetData?.content?.name\" [title]=\"widgetData.content.name\" />\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData?.content?.identifier\"\r\n [contentId]=\"widgetData?.content?.identifier\" [progress]=\"widgetData?.content?.progress\">\r\n </ws-widget-content-progress>\r\n </a>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData?.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData?.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div *ngIf=\"widgetData?.content?.resourceType || widgetData?.content?.contentType\"\r\n class=\"back-color px-4 py-2 -mx-4 text-white\">\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData?.content?.displayContentType\" class=\"font-normal text-xs\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n </a>\r\n </mat-card-content>\r\n <div class=\"flex items-center justify-between flex-row-reverse space-0 mb-0\">\r\n <ws-widget-btn-content-like [color]=\"'primary'\" class=\"flex items-center\"\r\n [widgetData]=\"widgetData?.content | pipePartialContent: ['identifier']\" [likesCount]=\"widgetData?.likes\">\r\n </ws-widget-btn-content-like>\r\n\r\n <div *ngIf=\"showContentTag || false\" i18n class=\"mode-tag px-2 ws-mat-primary-background\">\r\n {{ widgetData.contentTags.tag }}\r\n </div>\r\n </div>\r\n </div>\r\n </mat-card>\r\n</ng-template> -->",
8116
+ template: "<!-- -->\r\n<ng-container *ngIf=\"widgetData && (((widgetData?.deletedMode || 'none') === 'hide' && !!!isLiveOrMarkForDeletion)\r\n? false\r\n: !((widgetData?.intranetMode || 'none') === 'hide' && !!showIntranetContent))\"\r\n [ngSwitch]=\"( (widgetData && widgetData?.cardSubType) || 'cardStandard')\">\r\n <ng-container *ngSwitchCase=\"'minimal'\" [ngTemplateOutlet]=\"cardMinimal\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'space-saving'\" [ngTemplateOutlet]=\"cardSpaceSaving\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'basic-info'\" [ngTemplateOutlet]=\"cardBasicInformation\"></ng-container>\r\n <!-- <ng-container *ngSwitchCase=\"'card-user-details'\" [ngTemplateOutlet]=\"cardWithUserDetails\"></ng-container> -->\r\n <ng-container *ngSwitchCase=\"'card-description-back'\" [ngTemplateOutlet]=\"cardDescriptionBack\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'basic-details'\" [ngTemplateOutlet]=\"cardBasicDetails\"></ng-container>\r\n <ng-container *ngSwitchCase=\"'card-discussion'\" [ngTemplateOutlet]=\"cardDiscussion\"></ng-container>\r\n <ng-container *ngSwitchDefault [ngTemplateOutlet]=\"cardStandard\"></ng-container>\r\n</ng-container>\r\n\r\n<ng-template #cardMinimal>\r\n <div [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-minimal-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" class=\"card-link\" role=\"link\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img [src]=\"widgetData.content.appIcon\" class=\"card-thumbnail ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <div class=\"card-overlay\">\r\n <h3 *ngIf=\"widgetData.content.name\" class=\"text-truncate card-title\">\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\">\r\n {{ widgetData.content.name }}\r\n </a>\r\n </h3>\r\n <div class=\"flex justify-between items-center\">\r\n <div>\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\" class=\"mr-4 font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n <span *ngIf=\"widgetData.content.duration\" i18n-title title=\"Duration\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </span>\r\n </div>\r\n <button mat-icon-button i18n-aria-label aria-label=\"action items\" [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n </div>\r\n </div>\r\n</ng-template>\r\n<mat-menu #cardMenu=\"matMenu\">\r\n <ng-template matMenuContent>\r\n <div mat-menu-item>\r\n <ws-widget-btn-content-download [widgetData]=\"\r\n widgetData.content\r\n | pipePartialContent\r\n : [\r\n 'identifier',\r\n 'contentType',\r\n 'resourceType',\r\n 'mimeType',\r\n 'downloadUrl',\r\n 'isExternal',\r\n 'artifactUrl'\r\n ]\r\n \"></ws-widget-btn-content-download>\r\n <ws-widget-btn-content-like [widgetData]=\"widgetData.content | pipePartialContent: ['identifier']\">\r\n </ws-widget-btn-content-like>\r\n <ws-widget-btn-content-mail-me [widgetData]=\"widgetData.content\"></ws-widget-btn-content-mail-me>\r\n <ws-widget-btn-content-share [widgetData]=\"widgetData.content\"></ws-widget-btn-content-share>\r\n <ws-widget-btn-channel-analytics [widgetData]=\"widgetData.content\"></ws-widget-btn-channel-analytics>\r\n <ws-widget-btn-kb [contentId]=\"widgetData?.content?.identifier\" [forPreview]=\"false\"\r\n [contentName]=\"widgetData?.content?.name\" [contentType]=\"widgetData?.content?.contentType\">\r\n </ws-widget-btn-kb>\r\n <!-- <ws-widget-btn-follow [widgetData]=\"{\r\n targetId: widgetData?.content?.identifier,\r\n type: widgetData?.content?.contentType\r\n }\" *ngIf=\"isKnowledgeBoard\"></ws-widget-btn-follow> -->\r\n <ws-widget-btn-goals *ngIf=\"btnGoalsConfig\" [widgetData]=\"btnGoalsConfig\"></ws-widget-btn-goals>\r\n <ws-widget-btn-playlist *ngIf=\"btnPlaylistConfig\" [widgetData]=\"btnPlaylistConfig\">\r\n </ws-widget-btn-playlist>\r\n <ws-widget-btn-kb-analytics [widgetData]=\"\r\n widgetData.content\r\n | pipePartialContent\r\n : [\r\n 'identifier',\r\n 'contentType',\r\n 'resourceType',\r\n 'mimeType',\r\n 'downloadUrl',\r\n 'isExternal',\r\n 'artifactUrl'\r\n ]\r\n \"></ws-widget-btn-kb-analytics>\r\n </div>\r\n </ng-template>\r\n</mat-menu>\r\n\r\n<ng-template #cardSpaceSaving>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-space-saving-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <ng-container *ngIf=\"!isCardFlipped\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"card-header-meta\">\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\" class=\"ws-mat-primary-text font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n <span *ngIf=\"widgetData.content.duration\" class=\"text-gray-600\" i18n-title title=\"Duration\">\r\n &nbsp;&nbsp;|&nbsp;&nbsp;{{\r\n widgetData.content.duration | pipeDurationTransform: 'hms'\r\n }}\r\n </span>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title text-truncate title-text\" title=\"Title\" i18n-title>\r\n {{ widgetData.content.name }}\r\n </div>\r\n </a>\r\n <div class=\"mt-4 flex justify-between items-center flip-actions\">\r\n <div>\r\n <div *ngIf=\"widgetData.content.sourceName\" class=\"ws-mat-primary-text mat-subheading-1 source-name\"\r\n i18n-title title=\"Source\">\r\n {{ widgetData.content.sourceName }}\r\n </div>\r\n <div *ngIf=\"widgetData.content.complexityLevel\" i18n-title title=\"Complexity Level\" class=\"text-gray-600\">\r\n {{ widgetData.content.complexityLevel }}\r\n </div>\r\n </div>\r\n <div class=\"flex\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" (click)=\"isCardFlipped = !isCardFlipped\" mat-icon-button i18n-aria-label\r\n aria-label=\"action items\">\r\n <mat-icon>flip_to_back</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"isCardFlipped\">\r\n <mat-card-content>\r\n <div class=\"card-header-meta\">\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\" class=\"ws-mat-primary-text font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n <span *ngIf=\"widgetData.content.duration\" class=\"text-gray-600\" i18n-title title=\"Duration\">\r\n &nbsp;&nbsp;|&nbsp;&nbsp;{{\r\n widgetData.content.duration | pipeDurationTransform: 'hms'\r\n }}\r\n </span>\r\n </div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" aria-label=\"Content\"\r\n i18n-aria-label=\"Content | Click to view\" class=\"ws-mat-primary-text mat-title text-truncate title-text\">\r\n {{ widgetData.content.name }}\r\n </a>\r\n <div *ngIf=\"widgetData?.content?.description\" class=\"mt-4 flip-desc-text ws-mat-text-block-fade-gradient\">\r\n {{ widgetData?.content?.description }}\r\n </div>\r\n <div class=\"mt-4 flex justify-between items-center flip-actions\">\r\n <div>\r\n <div *ngIf=\"widgetData.content.sourceName\" class=\"ws-mat-primary-text mat-subheading-1 source-name\"\r\n i18n-title title=\"Source\">\r\n {{ widgetData.content.sourceName }}\r\n </div>\r\n <div *ngIf=\"widgetData.content.complexityLevel\" i18n-title title=\"Complexity Level\" class=\"text-gray-600\">\r\n {{ widgetData.content.complexityLevel }}\r\n </div>\r\n </div>\r\n <div class=\"flex\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" (click)=\"isCardFlipped = !isCardFlipped\" mat-icon-button aria-label=\"action items\">\r\n <mat-icon>flip_to_front</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #rating>\r\n <div class=\"flex items-center mr-2\">\r\n <mat-icon class=\"mr-1\" *ngIf=\"widgetData?.content?.averageRating == 5\" color=\"accent\">star</mat-icon>\r\n <mat-icon class=\"mr-1\" *ngIf=\"widgetData?.content?.averageRating && widgetData.content.averageRating != 5\"\r\n color=\"accent\">star_half</mat-icon>\r\n <mat-icon class=\"mr-1\" *ngIf=\"!widgetData?.content?.averageRating\">star_border</mat-icon>\r\n <span>{{ widgetData?.content?.averageRating | number: '1.1-1' }}</span>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #cardBasicInformation>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-basic-infomartion-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n </a>\r\n\r\n <mat-card-content class=\"m-small\">\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"ws-mat-primary-background text-truncate px-4 py-2 -mx-4 text-white\">\r\n <span *ngIf=\"widgetData.content?.complexityLevel\">{{\r\n widgetData.content?.complexityLevel\r\n }}</span>\r\n\r\n <span i18n *ngIf=\"widgetData.content?.subTitle\">\r\n |\r\n </span>\r\n <span matTooltipPosition=\"right\" [matTooltip]=\"widgetData.content?.subTitle\">\r\n {{ widgetData.content?.subTitle }}\r\n </span>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <div class=\"h-5\">\r\n <div *ngIf=\"showContentTag && widgetData.contentTags && widgetData.contentTags.tag\" i18n\r\n class=\"mode-tag px-2 ws-mat-primary-background\">\r\n {{ widgetData.contentTags.tag }}\r\n </div>\r\n </div>\r\n </a>\r\n </mat-card-content>\r\n <div class=\"flex justify-between items-center\">\r\n <img alt=\"source img\" [src]=\"widgetData.content.sourceIconUrl\" *ngIf=\"widgetData.content.sourceIconUrl\"\r\n class=\"source-image mr-1\" />\r\n <div *ngIf=\"widgetData.content.sourceName\" class=\"source-name w-64 text-truncate\" i18n-title title=\"Source\">\r\n {{ widgetData.content.sourceName }}\r\n </div>\r\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\" [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #cardDescriptionBack>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-Client-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <ng-container *ngIf=\"!isCardFlipped\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" class=\"rounded-t\" role=\"link\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <button class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button (click)=\"isCardFlipped = true\"\r\n aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\r\n <mat-icon>flip_to_back</mat-icon>\r\n </button>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"text-gray-600 complexity flex-middle\">\r\n <mat-icon matTooltip=\"{{ imageIcon[1] }}\">{{ imageIcon[0] }}</mat-icon>\r\n\r\n <div class=\"ws-mat-primary-text pl-2 text-lg title-text margin-bottom-xs margin-top-xs\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <!-- <mat-icon>check_circle_outline</mat-icon> -->\r\n </div>\r\n <div class=\"text-gray-600 duration flex-between flex-center pb-1\">\r\n <div *ngIf=\"widgetData.content.duration\" i18n-title title=\"Duration\" class=\"overflow-hidden\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </div>\r\n <div *ngIf=\"widgetData.content.viewCount && widgetData.content.viewCount.Client\" class=\"duration-time\"\r\n i18n-title title=\"View Count\">\r\n {{ widgetData.content.viewCount.Client | pipeCountTransform }} views\r\n </div>\r\n <div *ngIf=\"!widgetData.content.viewCount || !widgetData.content.viewCount.Client\" class=\"duration-time\"\r\n i18n-title title=\"View Count\">\r\n No views\r\n </div>\r\n <div *ngIf=\"widgetData.content.resourceType\" class=\"resource-type\" i18n-title title=\"resource Type\">\r\n {{ widgetData.content.resourceType }}\r\n </div>\r\n </div>\r\n\r\n <!-- <mat-chip-list>\r\n <mat-chip color=\"accent\" selected>\r\n OnBoarding\r\n </mat-chip>\r\n </mat-chip-list> -->\r\n </a>\r\n <mat-divider></mat-divider>\r\n <div class=\"flex flex-middle\">\r\n <ws-widget-btn-content-share [widgetData]=\"widgetData.content\"></ws-widget-btn-content-share>\r\n <ws-widget-btn-content-like [color]=\"'primary'\" class=\"flex items-center\"\r\n [widgetData]=\"widgetData.content | pipePartialContent: ['identifier']\" [likesCount]=\"widgetData.likes\">\r\n </ws-widget-btn-content-like>\r\n\r\n <ws-widget-btn-playlist *ngIf=\"btnPlaylistConfig\" [widgetData]=\"btnPlaylistConfig\">\r\n </ws-widget-btn-playlist>\r\n <ws-widget-btn-content-download [widgetData]=\"\r\n widgetData.content\r\n | pipePartialContent\r\n : [\r\n 'identifier',\r\n 'contentType',\r\n 'resourceType',\r\n 'mimeType',\r\n 'downloadUrl',\r\n 'isExternal',\r\n 'artifactUrl'\r\n ]\r\n \"></ws-widget-btn-content-download>\r\n\r\n <mat-icon class=\"px-2 cursor-pointer\" aria-label=\"Comment\" i18n-aria-label matTooltip=\"Comment\"\r\n i18n-matTooltip=\"Comment Button\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" [fragment]=\"'discussion-forum'\">\r\n comment</mat-icon>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"isCardFlipped\">\r\n <div class=\"flex items-center\">\r\n <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>Description</h2>\r\n <button mat-icon-button (click)=\"isCardFlipped = false\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n <p class=\"text-description-trim mat-body-1\">\r\n {{ widgetData.content.description }}\r\n </p>\r\n </ng-container>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #cardBasicDetails>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-standard-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <img mat-card-image [src]=\"widgetData.content.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [wsUtilsDefaultThumbnail]=\"defaultThumbnail\" [alt]=\"widgetData.content.name\"\r\n [title]=\"widgetData.content.name\" />\r\n </a>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div class=\"text-gray-600 complexity flex-between flex-center\">\r\n <div *ngIf=\"widgetData.content.duration\" class=\"duration\" i18n-title title=\"Duration\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </div>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <div class=\"description-text ws-mat-text-block-fade-gradient mb-4\" i18n-title title=\"Description\">\r\n {{ widgetData.content.description | pipeHtmlTagRemoval }}\r\n </div>\r\n <div class=\"text-gray-600 complexity flex-end\">\r\n <div class=\"flex items-center\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" mat-icon-button i18n-aria-label aria-label=\"action items\"\r\n [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </a>\r\n </mat-card-content>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n\r\n<ng-template #cardDiscussion>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData.content.name\" class=\"card-discussions-container mr-6\"\r\n [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <mat-card-content>\r\n\r\n <!-- <div class=\"text-gray-600 complexity flex-between flex-center\">\r\n <div *ngIf=\"widgetData.content.duration\" class=\"duration\" i18n-title title=\"Duration\">\r\n {{ widgetData.content.duration | pipeDurationTransform: 'hms' }}\r\n </div>\r\n </div> -->\r\n <!-- <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div> -->\r\n <div class=\"flex flex-1 flex-row\">\r\n <div class=\"flex-9 description-text mb-4\" i18n-title title=\"Description\">\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"['/app/discuss']\" class=\"flex flex-column\"\r\n [queryParams]=\"{'disid':'abc-bcdf-mnj-llk'}\" role=\"link\" aria-label=\"Content\" i18n-aria-label>\r\n <h2 class=\"ws-mat-primary-text mat-title title-text\"> {{ widgetData.content.name }}</h2>\r\n </a>\r\n </div>\r\n <div class=\"flex flex-1\">\r\n <div class=\"ws-mat-default-text\">\r\n <span>{{5}} hours ago</span>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <mat-accordion>\r\n <mat-expansion-panel class=\"no-box\" (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\">\r\n <mat-expansion-panel-header #panelH (click)=\"panelH._toggle()\">\r\n <mat-panel-title> -->\r\n <div class=\"flex flex-1 flex-row\">\r\n <div class=\"flex flex-1\">\r\n <div class=\"flex flex-1 flex-row\">\r\n <span>\r\n <mat-icon class=\"ws-mat-warn-text\">thumb_up_off_alt</mat-icon>\r\n </span>\r\n &nbsp;\r\n <h3 class=\"ws-mat-warn-text\">{{21}}</h3>\r\n &nbsp;\r\n &nbsp;\r\n <span>\r\n <mat-icon class=\"ws-mat-primary-text\">reply</mat-icon>\r\n </span>\r\n &nbsp;\r\n <h3 class=\"ws-mat-warn-text\">Reply</h3>\r\n </div>\r\n </div>\r\n <div class=\"flex flex-1 center-right\">\r\n <span>view {{2}} replies\r\n <!-- <mat-icon>keyboard_arrow_up </mat-icon> -->\r\n </span>\r\n </div>\r\n </div>\r\n <!-- </mat-panel-title>\r\n <mat-panel-description>\r\n <span class=\"flex flex-1 center-right\" (click)=\"panelH._toggle()\">view {{2}} replies</span>\r\n </mat-panel-description>\r\n </mat-expansion-panel-header>\r\n <div>\r\n <p>I'm visible because I am open</p>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion> -->\r\n\r\n\r\n </mat-card-content>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n<ng-template #cardStandard>\r\n <mat-card class=\"card-standard-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <!-- <ws-widget-content-progress\r\n class=\"progress-bar\"\r\n *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\"\r\n ></ws-widget-content-progress> -->\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <ng-container *ngIf=\"!isCardFlipped\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <!-- <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" class=\"rounded-t\" role=\"link\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\"> -->\r\n <div style=\"position: relative; z-index: 1;\">\r\n <img mat-card-image style=\"position: absolute; z-index: 2;\" [src]=\"widgetData.content.appIcon\"\r\n class=\"card-img ws-mat-primary-lite-background\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\r\n [alt]=\"widgetData.content.name\" />\r\n <div class=\"source-div\">\r\n <!-- [src]=\"sourseIcon(widgetData.content.sourceName)\" -->\r\n <img [src]=\"widgetData.content.creatorLogo\" class=\"source-icon\" [wsUtilsDefaultThumbnail]=\"defaultSLogo\"\r\n [alt]=\"(widgetData.content.sourceName + '_' + widgetData.content.identifier)\" />\r\n <!-- [title]=\"widgetData.content.sourceName\" -->\r\n </div>\r\n </div>\r\n <!-- </a> -->\r\n <button *ngIf=\"showFlip\" class=\"detail-button ws-mat-primary-lite-background-op30\" mat-icon-button\r\n (click)=\"isCardFlipped = true\" aria-label=\"Details\" i18n-aria-label=\"Details | Click to see details\">\r\n <mat-icon>flip_to_back</mat-icon>\r\n </button>\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData.content?.identifier\"\r\n [contentId]=\"widgetData.content?.identifier\" [progress]=\"widgetData.content?.progress\">\r\n </ws-widget-content-progress>\r\n\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" i18n-aria-label>\r\n\r\n <div class=\"text-gray-time complexity flex-between flex-center\">\r\n <!-- <div *ngIf=\"widgetData.content.complexityLevel\" i18n-title title=\"Complexity Level\">\r\n {{ widgetData.content.complexityLevel }}\r\n </div> -->\r\n <div *ngIf=\"showIsMode\" i18n i18n-title title=\"Newly Added\"\r\n class=\"mode-tag px-2 ws-mat-accent-background\">\r\n Newly Added\r\n </div>\r\n\r\n <div *ngIf=\"widgetData.content.duration\" class=\"duration\">\r\n <mat-icon>access_time</mat-icon>\r\n <span class=\"time-text\">{{ widgetData.content.duration | pipeDurationTransform: 'hms' }}</span>\r\n </div>\r\n </div>\r\n\r\n <div [id]=\"'m-c-'+ widgetData.content?.identifier\"\r\n class=\"mat-subheading-1 title-text ws-mat-text-block-fade-gradient\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n <div class=\"mat-body-2 ws-mat-primary-text description-text ws-mat-text-block-fade-gradient mb-10\">\r\n {{ widgetData.content.description | pipeHtmlTagRemoval }}\r\n <!-- {{widgetData.content | json}} -->\r\n <!-- {{widgetData.content.sourceName}} -->\r\n </div>\r\n </a>\r\n <div class=\"mt-4 flex justify-between items-center absolute bottom-0 left-0 right-0 px-3 py-2\">\r\n <!-- <ws-widget-display-content-type\r\n i18n-title\r\n title=\"Content Type\"\r\n *ngIf=\"widgetData.content?.displayContentType\"\r\n class=\"ws-mat-primary-text font-normal\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\"\r\n >\r\n </ws-widget-display-content-type> -->\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\" *ngIf=\"widgetData.content?.contentType\"\r\n class=\"ws-mat-primary-text font-normal\" [displayContentType]=\"widgetData.content?.contentType==='Collection'\r\n ?'Module'\r\n :(widgetData.content?.contentType==='Learning Path'?'Program':widgetData.content?.contentType)\">\r\n </ws-widget-display-content-type>\r\n <div class=\"flex items-center\">\r\n <ng-container [ngTemplateOutlet]=\"rating\"></ng-container>\r\n <button type=\"button\" mat-icon-button i18n-aria-label [matMenuTriggerFor]=\"cardMenu\">\r\n <mat-icon>more_vertical</mat-icon>\r\n </button>\r\n </div>\r\n </div>\r\n </mat-card-content>\r\n </ng-container>\r\n <ng-container *ngIf=\"isCardFlipped\">\r\n <div class=\"flex items-center\">\r\n <h2 class=\"mat-subheading-2 flex-1 min-w-0 margin-remove-bottom\" i18n>Reason</h2>\r\n <button mat-icon-button (click)=\"isCardFlipped = false\">\r\n <mat-icon>close</mat-icon>\r\n </button>\r\n </div>\r\n <p class=\"text-justify mat-body-1\">\r\n {{ widgetData.content.reason }}\r\n </p>\r\n </ng-container>\r\n </div>\r\n </mat-card>\r\n</ng-template>\r\n\r\n<!-- <ng-template #cardWithUserDetails>\r\n <mat-card [attr.name]=\"'widget-card-content ' + widgetData?.content?.name\"\r\n class=\"card-with-user-details-container mr-6\" [ngClass]=\"{\r\n greyOut:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\" (click)=\"(showIntranetContent || !isLiveOrMarkForDeletion) && showSnackbar()\">\r\n <div class=\"display-contents\" [ngClass]=\"{\r\n disableClick:\r\n widgetData.deletedMode === 'greyOut' && !isLiveOrMarkForDeletion\r\n ? true\r\n : widgetData?.intranetMode === 'greyOut' && showIntranetContent\r\n }\">\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Content expired or deleted\" i18n-matTooltip\r\n matTooltip=\"Content may be expired or deleted\" *ngIf=\"!isLiveOrMarkForDeletion\"></div>\r\n <div class=\"status-danger\" role=\"note\" i18n-aria-label aria-label=\"Intranet content\" i18n-matTooltip\r\n matTooltip=\"Available only in Company's network\"\r\n *ngIf=\"widgetData?.intranetMode === 'greyOut' && showIntranetContent\"></div>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData.content | pipeContentRoute).queryParams\" role=\"link\" class=\"rounded-t\"\r\n aria-label=\"Content\" i18n-aria-label=\"Content | Click to view\">\r\n <div *ngIf=\"\r\n widgetData?.content?.creatorDetails?.length ||\r\n widgetData?.content?.creatorContacts?.length\r\n \" class=\"flex flex-wrap items-center mb-4\">\r\n <ws-widget-user-image class=\"author-image\" [userName]=\"\r\n widgetData?.content?.creatorDetails && (widgetData.content?.creatorDetails)[0]?.name\r\n ? (widgetData?.content?.creatorDetails)[0]?.name\r\n : (widgetData?.content?.creatorContacts)[0]?.name\r\n \" [userId]=\"\r\n widgetData?.content?.creatorDetails && (widgetData.content?.creatorDetails)[0]?.id\r\n ? (widgetData?.content?.creatorDetails)[0]?.id\r\n : (widgetData?.content?.creatorContacts)[0]?.id\r\n \" [imageType]=\"'name-initial'\"></ws-widget-user-image>\r\n <div class=\"width-expand\">\r\n <div class=\"margin-remove font-semibold text-truncate\">\r\n {{\r\n widgetData.content?.creatorDetails && (widgetData.content?.creatorDetails)[0].name\r\n ? (widgetData.content?.creatorDetails)[0]?.name === 'null null'\r\n ? 'Not disclosed'\r\n : (widgetData.content?.creatorDetails)[0]?.name\r\n : (widgetData.content?.creatorContacts)[0]?.name === 'null null'\r\n ? 'Not disclosed'\r\n : (widgetData.content?.creatorContacts)[0]?.name\r\n }}\r\n {{ checkDisplayName }}\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <img mat-card-image [src]=\"widgetData?.content?.appIcon\" class=\"card-img ws-mat-primary-lite-background\"\r\n [ngClass]=\"{ 'greyed-img': isGreyedImage }\" [wsUtilsDefaultThumbnail]=\"defaultThumbnail\"\r\n [alt]=\"widgetData?.content?.name\" [title]=\"widgetData.content.name\" />\r\n <ws-widget-content-progress class=\"progress-bar\" *ngIf=\"widgetData?.content?.identifier\"\r\n [contentId]=\"widgetData?.content?.identifier\" [progress]=\"widgetData?.content?.progress\">\r\n </ws-widget-content-progress>\r\n </a>\r\n <mat-card-content>\r\n <a (click)=\"raiseTelemetry()\" [routerLink]=\"(widgetData?.content | pipeContentRoute).url\"\r\n [queryParams]=\"(widgetData?.content | pipeContentRoute).queryParams\" role=\"link\" aria-label=\"Content\"\r\n i18n-aria-label>\r\n <div *ngIf=\"widgetData?.content?.resourceType || widgetData?.content?.contentType\"\r\n class=\"back-color px-4 py-2 -mx-4 text-white\">\r\n <ws-widget-display-content-type i18n-title title=\"Content Type\"\r\n *ngIf=\"widgetData?.content?.displayContentType\" class=\"font-normal text-xs\"\r\n [displayContentType]=\"widgetData.content?.displayContentType\">\r\n </ws-widget-display-content-type>\r\n </div>\r\n <div class=\"ws-mat-primary-text mat-title title-text title-truncate\">\r\n {{ widgetData.content.name }}\r\n </div>\r\n </a>\r\n </mat-card-content>\r\n <div class=\"flex items-center justify-between flex-row-reverse space-0 mb-0\">\r\n <ws-widget-btn-content-like [color]=\"'primary'\" class=\"flex items-center\"\r\n [widgetData]=\"widgetData?.content | pipePartialContent: ['identifier']\" [likesCount]=\"widgetData?.likes\">\r\n </ws-widget-btn-content-like>\r\n\r\n <div *ngIf=\"showContentTag || false\" i18n class=\"mode-tag px-2 ws-mat-primary-background\">\r\n {{ widgetData.contentTags.tag }}\r\n </div>\r\n </div>\r\n </div>\r\n </mat-card>\r\n</ng-template> -->",
8117
8117
  styles: [".card-minimal-container{position:relative}.card-minimal-container .card-link{width:265px;height:150px;display:block}.card-minimal-container .card-link .card-thumbnail{object-fit:contain;width:100%;height:100%}.card-minimal-container .card-overlay{position:absolute;bottom:4px;background-color:rgba(0,0,0,.55);color:#fff;padding:4px 12px;box-sizing:border-box;width:100%}.card-minimal-container .card-overlay .card-title{margin-bottom:-6px}.status-danger{width:16px;height:16px;position:absolute;border-radius:50%;top:16px;left:16px;pointer-events:auto;cursor:pointer;background:#ce3939}.card-space-saving-container{position:relative;width:265px;height:100%;box-sizing:border-box}.card-space-saving-container .progress-bar{display:block;width:calc(100% + 32px);margin-left:-16px;margin-top:-16px}.card-space-saving-container mat-card-content{margin:0 -4px;min-height:120px}.card-space-saving-container .card-img{height:150px;display:block}.card-space-saving-container .card-header-meta{margin-top:8px}.card-space-saving-container .title-text{display:block;margin:12px 0}.card-space-saving-container .flip-desc-text{position:relative;overflow:hidden;line-height:1.4em;height:5.6em;margin-bottom:36px}.card-space-saving-container .flip-actions{position:absolute;bottom:0;left:0;width:100%;padding:12px;box-sizing:border-box}.card-space-saving-container .flip-actions .source-name{margin-bottom:0;font-weight:400}.card-ford-container{padding:16px 16px 0;position:relative;width:220px;height:243px;overflow:hidden;box-sizing:border-box}.card-ford-container .progress-bar{display:block;width:calc(100% + 32px);margin-left:-16px;margin-top:-16px}.card-ford-container mat-card-content{margin:160px}.card-ford-container .card-img{height:125px;display:block;object-fit:contain}@media only screen and (max-width:599px){.card-ford-container{width:200px;height:240px}.card-ford-container .card-img{height:115px}}.card-ford-container .complexity{display:flex;font-size:14px}.card-ford-container .duration{height:1.6em;display:flex}.card-ford-container .duration .resource-type{order:3;margin-left:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-ford-container .duration .duration-time{order:2;margin-left:auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card-ford-container .title-text{margin:12px 0;position:relative;overflow:hidden;height:1.3em;line-height:1.3em;text-overflow:ellipsis;white-space:nowrap}.card-ford-container .mode-tag{border-radius:5px;color:#fff}.card-ford-container .description-text{position:relative;overflow:hidden;height:4.2em;line-height:1.4em}.card-ford-container .mat-chip-list-wrapper{padding:8px 0 16px!important}.card-ford-container .text-description-trim{overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:9;display:-webkit-box;-webkit-box-orient:vertical;text-align:justify}@media only screen and (max-width:599px){.card-ford-container .text-description-trim{-webkit-line-clamp:8}}.card-standard-container{position:relative;width:268px;height:100%;min-height:346px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #99999933}.card-standard-container .progress-bar{display:block;width:calc(100% + 30px);margin-left:-15px;display:flex;margin-top:62px;background:bisque}.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{margin:0 -4px}.card-standard-container .card-img{min-width:269px;max-width:269px;display:block;object-fit:contain;border-top-left-radius:8px;border-top-right-radius:8px}.card-standard-container .complexity{padding-top:7px;display:flex;font-size:14px;line-height:27px;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}.card-standard-container .complexity .time-text{margin:0 5px 0 6px}.card-standard-container .basic{margin:auto 0}.card-standard-container .title-text{margin:12px 0;position:relative;overflow:hidden;height:48px}.card-standard-container .description-text{position:relative;overflow:hidden;height:63px}.card-discussions-container{flex:1;display:flex;position:relative;height:100%;min-height:140px;border-radius:8px;box-sizing:border-box;box-shadow:0 10px 30px #99999933}.card-discussions-container .progress-bar{display:block;width:calc(100% + 30px);margin-left:-15px;display:flex;margin-top:62px;background:bisque}.card-discussions-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-discussions-container .source-div .source-icon{border-radius:8px;display:block;margin:auto;max-width:58px;max-height:-webkit-fill-available}.card-discussions-container mat-card-content{margin:0 -4px;flex:1}.card-discussions-container .card-img{min-width:269px;max-width:269px;display:block;object-fit:contain;border-top-left-radius:8px;border-top-right-radius:8px}.card-discussions-container .complexity{padding-top:7px;display:flex;font-size:14px;line-height:27px;padding-bottom:10px}.card-discussions-container .complexity .mode-tag{border-radius:5px;order:2;margin-left:auto;color:#fff;font-size:10px}.card-discussions-container .complexity .duration{display:flex;margin-left:auto;order:3}.card-discussions-container .complexity .time-text{margin:0 5px 0 6px}.card-discussions-container .basic{margin:auto 0}.card-discussions-container .title-text{overflow:hidden}.card-discussions-container .description-text{position:relative;overflow:hidden;height:auto;line-height:1.9em}.card-basic-infomartion-container{position:relative;width:265px;height:100%;box-sizing:border-box;min-height:300px}.card-basic-infomartion-container .card-img{height:150px;display:block;margin-bottom:0!important;object-fit:contain}.card-basic-infomartion-container .source-name{margin-bottom:0;font-weight:400;line-height:1.25rem!important}.card-basic-infomartion-container .title-text{margin:12px 0 0;position:relative;overflow:hidden;height:2.6em;line-height:1.3em}.card-basic-infomartion-container .source-image{object-fit:contain;height:35px;width:55px;overflow:auto}.card-with-user-details-container{position:relative;width:265px;height:100%;box-sizing:border-box;min-height:270px}.card-with-user-details-container .card-img{height:150px;display:block;margin-bottom:0!important;object-fit:contain}.card-with-user-details-container .source-name{margin-bottom:0;font-weight:400}.card-with-user-details-container .title-text{margin:12px 0 0;position:relative;overflow:hidden;height:2.6em;line-height:1.3em}.card-with-user-details-container .author-image{margin-right:12px;height:44px;width:44px}.card-with-user-details-container .back-color{background-color:#7e0a80}.card-with-user-details-container .space-0{margin-top:0!important;padding-top:0!important;margin-bottom:0!important}.detail-button{position:absolute;top:12px;right:12px;z-index:1}.greyOut{filter:grayscale(1);opacity:.7;cursor:auto!important}.disableClick{pointer-events:none}.display-contents{display:contents}.title-truncate{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.typeofc{width:101px;height:30px;border:1px solid;border-radius:8px;opacity:.4;align-items:center;justify-content:center;display:flex}.flex-9{flex:9}.center-right{align-items:center;justify-content:flex-end}.no-box{box-shadow:none!important}"]
8118
8118
  }] }
8119
8119
  ];