@posiwise/resource-module 0.0.136 → 0.0.138

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.
@@ -450,11 +450,11 @@ class ResourceNoteCardComponent extends AppBaseComponent {
450
450
  });
451
451
  }
452
452
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourceNoteCardComponent, deps: [{ token: i0.Injector }, { token: ResourceService }, { token: i2.AuthService }, { token: i2.TagService }], target: i0.ɵɵFactoryTarget.Component }); }
453
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceNoteCardComponent, selector: "pw-resource-note-card", inputs: { releaseHeader: "releaseHeader", categoryId: "categoryId", isReleasePress: "isReleasePress", postSlice: "postSlice", resourceTitle: "resourceTitle", tag: "tag" }, usesInheritance: true, ngImport: i0, template: "<section class=\"msp-vault-section bg-white\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isEditingTitle }\">\n <ng-container *ngIf=\"!isEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['product']?.title; else fallback\" [innerHTML]=\"postTags['product']?.title\"></span>\n <ng-template #fallback>Product Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditTitle()\" (keydown.enter)=\"toggleEditTitle()\" (keydown.space)=\"toggleEditTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('product')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a class=\"view-all\" *ngIf=\"!postSlice\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['product']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasProductReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['product']\">\n <pw-resource-edit-card\n *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getProductReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url?.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Product Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Product Resource Default Icon\" />\n </ng-template>\n <ng-template #ctaContent>\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n<section class=\"msp-vault-section bg-white\" *ngIf=\"isReleasePress\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isPressEditingTitle }\">\n <ng-container *ngIf=\"!isPressEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['press']?.title; else fallback\" [innerHTML]=\"postTags['press']?.title\"></span>\n <ng-template #fallback>Press Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditPressTitle()\" (keydown.enter)=\"toggleEditPressTitle()\" (keydown.space)=\"toggleEditPressTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isPressEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('press')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isPressEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a *ngIf=\"!postSlice\" class=\"view-all\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['press']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasPressReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['press']\">\n <pw-resource-edit-card\n*ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getPressReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Press Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Press Resource Default Icon\" />\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n", styles: [".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"], dependencies: [{ kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i6$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i5.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i8.LazyImgDirective, selector: "img" }, { kind: "component", type: ResourceEditCardComponent, selector: "pw-resource-edit-card", inputs: ["id", "resourceData"], outputs: ["updated"] }, { kind: "pipe", type: i10$1.TranslocoPipe, name: "transloco" }] }); }
453
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceNoteCardComponent, selector: "pw-resource-note-card", inputs: { releaseHeader: "releaseHeader", categoryId: "categoryId", isReleasePress: "isReleasePress", postSlice: "postSlice", resourceTitle: "resourceTitle", tag: "tag" }, usesInheritance: true, ngImport: i0, template: "<section class=\"msp-vault-section bg-white\" *ngIf=\"hasProductReleases()\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isEditingTitle }\">\n <ng-container *ngIf=\"!isEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['product']?.title; else fallback\" [innerHTML]=\"postTags['product']?.title\"></span>\n <ng-template #fallback>Product Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditTitle()\" (keydown.enter)=\"toggleEditTitle()\" (keydown.space)=\"toggleEditTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('product')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a class=\"view-all\" *ngIf=\"!postSlice\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['product']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasProductReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['product']\">\n <pw-resource-edit-card\n *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getProductReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url?.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Product Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Product Resource Default Icon\" />\n </ng-template>\n <ng-template #ctaContent>\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n<section class=\"msp-vault-section bg-white\" *ngIf=\"isReleasePress && hasPressReleases()\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isPressEditingTitle }\">\n <ng-container *ngIf=\"!isPressEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['press']?.title; else fallback\" [innerHTML]=\"postTags['press']?.title\"></span>\n <ng-template #fallback>Press Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditPressTitle()\" (keydown.enter)=\"toggleEditPressTitle()\" (keydown.space)=\"toggleEditPressTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isPressEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('press')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isPressEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a *ngIf=\"!postSlice\" class=\"view-all\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['press']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasPressReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['press']\">\n <pw-resource-edit-card\n*ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getPressReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Press Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Press Resource Default Icon\" />\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n", styles: [".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"], dependencies: [{ kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i6$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i5.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i8.LazyImgDirective, selector: "img" }, { kind: "component", type: ResourceEditCardComponent, selector: "pw-resource-edit-card", inputs: ["id", "resourceData"], outputs: ["updated"] }, { kind: "pipe", type: i10$1.TranslocoPipe, name: "transloco" }] }); }
454
454
  }
455
455
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourceNoteCardComponent, decorators: [{
456
456
  type: Component,
457
- args: [{ selector: 'pw-resource-note-card', template: "<section class=\"msp-vault-section bg-white\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isEditingTitle }\">\n <ng-container *ngIf=\"!isEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['product']?.title; else fallback\" [innerHTML]=\"postTags['product']?.title\"></span>\n <ng-template #fallback>Product Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditTitle()\" (keydown.enter)=\"toggleEditTitle()\" (keydown.space)=\"toggleEditTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('product')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a class=\"view-all\" *ngIf=\"!postSlice\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['product']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasProductReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['product']\">\n <pw-resource-edit-card\n *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getProductReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url?.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Product Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Product Resource Default Icon\" />\n </ng-template>\n <ng-template #ctaContent>\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n<section class=\"msp-vault-section bg-white\" *ngIf=\"isReleasePress\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isPressEditingTitle }\">\n <ng-container *ngIf=\"!isPressEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['press']?.title; else fallback\" [innerHTML]=\"postTags['press']?.title\"></span>\n <ng-template #fallback>Press Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditPressTitle()\" (keydown.enter)=\"toggleEditPressTitle()\" (keydown.space)=\"toggleEditPressTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isPressEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('press')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isPressEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a *ngIf=\"!postSlice\" class=\"view-all\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['press']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasPressReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['press']\">\n <pw-resource-edit-card\n*ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getPressReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Press Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Press Resource Default Icon\" />\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n", styles: [".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"] }]
457
+ args: [{ selector: 'pw-resource-note-card', template: "<section class=\"msp-vault-section bg-white\" *ngIf=\"hasProductReleases()\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isEditingTitle }\">\n <ng-container *ngIf=\"!isEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['product']?.title; else fallback\" [innerHTML]=\"postTags['product']?.title\"></span>\n <ng-template #fallback>Product Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditTitle()\" (keydown.enter)=\"toggleEditTitle()\" (keydown.space)=\"toggleEditTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('product')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a class=\"view-all\" *ngIf=\"!postSlice\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['product']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasProductReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['product']\">\n <pw-resource-edit-card\n *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getProductReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url?.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Product Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Product Resource Default Icon\" />\n </ng-template>\n <ng-template #ctaContent>\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <ng-container *ngTemplateOutlet=\"ctaContent\"></ng-container>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n<section class=\"msp-vault-section bg-white\" *ngIf=\"isReleasePress && hasPressReleases()\">\n <div class=\"container\">\n <div class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading d-flex align-items-center\" [ngClass]=\"{ 'w-50': isPressEditingTitle }\">\n <ng-container *ngIf=\"!isPressEditingTitle; else editTitleBlock\">\n <span *ngIf=\"postTags['press']?.title; else fallback\" [innerHTML]=\"postTags['press']?.title\"></span>\n <ng-template #fallback>Press Release Notes</ng-template>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\" class=\"fa fa-edit in-page-edit-icon ms-3 cursor-pointer\" (click)=\"toggleEditPressTitle()\" (keydown.enter)=\"toggleEditPressTitle()\" (keydown.space)=\"toggleEditPressTitle()\" title=\"Edit Title\"></i>\n </ng-container>\n\n <ng-template #editTitleBlock>\n <input [(ngModel)]=\"editedTitle\" class=\"form-control d-inline w-auto me-2\" [ngClass]=\"{ 'w-100': isPressEditingTitle }\" />\n <button class=\"btn btn-sm btn-primary me-1\" (click)=\"saveEditedTitle('press')\">Save</button>\n <button class=\"btn btn-sm btn-secondary\" (click)=\"isPressEditingTitle = false\">Cancel</button>\n </ng-template>\n </h2>\n <a *ngIf=\"!postSlice\" class=\"view-all\" routerLink=\"/resources/release-notes\">VIEW ALL ></a>\n </div>\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"releasePosts['press']?.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"row mt-5 d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"hasPressReleases()\">\n <div class=\"resource-blog-card p-4\" *ngFor=\"let post of releasePosts['press']\">\n <pw-resource-edit-card\n*ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"getPressReleasePosts(1, 100)\"></pw-resource-edit-card>\n <p class=\"resource-title\" [innerHTML]=\"post.title\"></p>\n <img *ngIf=\"!post.picture?.url.includes('default-photo.jpg'); else resourceRocketBox\"\n src=\"{{ post.picture.url }}\"\n class=\"resource-image mt-auto\"\n alt=\"Press Resource Icon\" />\n\n <ng-template #resourceRocketBox>\n <img\n src=\"assets/img/resource/rocket-box.png\"\n class=\"press-release-icon mt-auto\"\n alt=\"Press Resource Default Icon\" />\n </ng-template>\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"resource-btn mt-3\"\n aria-label=\"Navigate to external url\"\n [href]=\"post.external_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n\n <ng-template #internalLink>\n <a class=\"resource-btn mt-3\" aria-label=\"Navigate to resource view\" [routerLink]=\"['/resources/view', post?.slug]\">\n <span>{{ post?.cta_text && post.cta_text !== 'null' ? post.cta_text : 'Read Now' }}</span>\n <span class=\"arrow\">\u2192</span>\n </a>\n </ng-template>\n </div>\n </div>\n </div>\n</section>\n", styles: [".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"] }]
458
458
  }], ctorParameters: () => [{ type: i0.Injector }, { type: ResourceService }, { type: i2.AuthService }, { type: i2.TagService }], propDecorators: { releaseHeader: [{
459
459
  type: Input
460
460
  }], categoryId: [{
@@ -997,11 +997,11 @@ class TestimonialCardListComponent {
997
997
  });
998
998
  }
999
999
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: TestimonialCardListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1000
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TestimonialCardListComponent, selector: "pw-testimonial-card", inputs: { posts: "posts", postHeader: "postHeader" }, outputs: { editPost: "editPost" }, usesOnChanges: true, ngImport: i0, template: "<section class=\"resource-section section-outer bg-white\">\n <div class=\"container\">\n <div *ngIf=\"postHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap mb-3\">\n <h2 class=\"section-heading\">{{postHeader}}</h2>\n </div>\n <div *ngIf=\"posts.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n<div [hidden]=\"posts.length === 0\">\n <div class=\"swiper-container\">\n <div class=\"swiper-wrapper\">\n <div class=\"swiper-slide\" *ngFor=\"let post of posts\">\n <div class=\"testimonial-box\">\n <pw-resource-edit-card\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"editPost.emit(1, 100)\"\n ></pw-resource-edit-card>\n <div class=\"stars mb-5\">\u2605\u2605\u2605\u2605\u2605</div>\n <div class=\"testimonial-content\">\n <div class=\"ql-container ql-snow ql-res\">\n <div class=\"ql-editor\"\n [innerHTML]=\"post?.body\">\n </div>\n </div>\n </div>\n\n <!-- THIS STAYS AT BOTTOM -->\n <div class=\"avatar-container\">\n <img\n *ngIf=\"!post.rectangular_picture.url.includes('default-photo.jpg') \" [src]=\"post.rectangular_picture.url\"\n alt=\"Logo\"\n class=\"testimonial-logo mt-4\"\n />\n </div>\n </div>\n\n </div>\n </div>\n <div class=\"swiper-pagination\"></div>\n <div class=\"swiper-button-prev\"></div>\n <div class=\"swiper-button-next\"></div>\n </div>\n</div>\n </div>\n</section>", styles: [".resource-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 767px){.container{padding:0 1rem!important}}.ql-res{resize:none!important;border-width:0}.swiper-container{padding:20px;position:relative;overflow:hidden}@media (width >= 768px){.swiper-container{padding:20px 40px}}.resource-card{background:#fff;border-radius:8px;box-shadow:0 0 20px #0000001a;padding:1.5rem;height:100%;display:flex;flex-direction:column;margin:0 auto;width:100%;max-width:350px}.resource-title{font-size:1.25rem;font-weight:600;margin-bottom:1rem}.resource-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px}.read-now-btn{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;color:#000;text-decoration:none;font-weight:500}.read-now-btn .arrow{transition:transform .2s ease}.read-now-btn:hover .arrow{transform:translate(5px)}.swiper-button-prev,.swiper-button-next{color:#000}.swiper-button-prev:after,.swiper-button-next:after{font-size:24px}@media (width <= 767px){.swiper-button-prev,.swiper-button-next{display:none}}.swiper-pagination{position:relative;margin-top:20px}.swiper-pagination-bullet{background:#000;opacity:.5}.swiper-pagination-bullet-active{opacity:1}.swiper-wrapper{display:flex;align-items:stretch}.swiper-slide{display:flex;align-items:stretch;height:auto}.testimonial-box{display:flex;flex-direction:column;justify-content:space-between;background:#fff;border-radius:20px;padding:2.5rem 1.5rem;box-shadow:0 0 20px #0000001a;text-align:center;width:338px;font-size:1.1rem;height:100%;min-height:100%}.testimonial-box span{margin:0;font-size:22px}.testimonial-box .avatar-container{margin-top:auto}.testimonial-box .testimonial-logo{width:100%!important;height:auto!important;max-width:150px!important;object-fit:contain;align-self:center}.testimonial-box .stars{font-size:2.2rem;color:#f6b300;margin-bottom:2.5rem}.centaris-text{margin-bottom:3rem!important}@media (width <= 768px){::ng-deep .swiper-wrapper{gap:1rem!important}.testimonial-box{width:300px!important}}\n", ".video-row{gap:5.5rem!important;margin-top:3rem!important}::ng-deep .resource-section{box-shadow:0 4px 32px -14px #40576d4d!important}.release-icon{height:auto;margin:0 11px 1.9rem;display:block;align-self:center}@media (width >= 768px) and (width <= 1200px){.resource-title{font-size:1.4rem!important}}textarea{font-size:1.4rem!important}@media (width <= 768px){.resource-title{font-size:1.2rem!important}.container{padding:7rem 3rem 1rem!important}}@media (width >= 768px) and (width <= 1200px){.container{padding:1rem 3rem!important}}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .vault-card{width:100%!important}.msp-vault-section .vault-btn{margin-left:0!important;width:100%!important}}@media (width >= 991px){::ng-deep .trial-meeting-section:before{top:600px!important}::ng-deep .dashboard{margin-bottom:1rem!important}section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}section.bg-white.text-center.extra-top-padding:before,section.bg-white.text-center.extra-top-padding:after{content:\"\";position:absolute;background:url(/assets/img/logos/background-banner.png) no-repeat;background-size:contain;width:160px;height:450px;z-index:0;opacity:.8}section.bg-white.text-center.extra-top-padding:before{top:500px;left:0}section.bg-white.text-center.extra-top-padding:after{top:90px;right:0}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 1200px){.resource-card{width:100%!important}.release-notes-section{padding:7rem 0!important}}@media (width >= 768px) and (width <= 1200px){.nce-hero-section{padding:0 6rem!important}.cards-row{justify-content:center}}.resource-body-section{background-color:#fff}.resource-body-section .container{padding:0 1.5rem;padding-bottom:4rem!important;padding-top:7rem!important;max-width:850px;margin:0 auto;text-align:left}.user-not-logged-in{background:#f7f7f7;border:1px solid rgb(238,238,238);font-weight:400}.user-not-logged-in a{color:var(--first)!important;text-decoration:none;font-weight:500}.nce-book-section{background:#fff;padding-top:7rem;padding-bottom:0}.nce-book-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-book-section .nce-contact{line-height:1.6;font-size:1.5rem}.nce-book-section .nce-contact a{text-decoration:underline;color:#000;margin:0 .2rem}.nce-book-section .nce-contact a:hover{color:var(--first)!important}.nce-offer-section{background:#fff;padding-top:2rem}.nce-offer-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-offer-section .nce-title{font-size:2rem;font-weight:700;color:#000;margin-bottom:.25em!important}.nce-offer-section .nce-title strong{font-weight:700}.nce-offer-section .nce-description{font-size:1.5rem;line-height:1.8rem;color:#333;margin-bottom:1.5rem}.nce-offer-section .nce-offer-list{font-size:1.1rem;line-height:1.5rem;margin-bottom:2.5rem;margin-top:2.5rem}.nce-offer-section .nce-offer-list p{font-size:1.5rem;margin:.5rem 0;font-weight:400}.nce-offer-section .nce-signup{margin-bottom:2.5rem}.nce-offer-section .nce-signup .signup-link{font-size:1.5rem;font-weight:400;text-decoration:underline;color:#000}@media (width <= 768px){.nce-offer-section .nce-book-section{padding-top:5rem!important}.nce-offer-section .container{text-align:left}.nce-offer-section .nce-title{font-size:1.5rem}.nce-offer-section .nce-description,.nce-offer-section .nce-offer-list,.nce-offer-section .nce-signup,.nce-offer-section .signup-link,.nce-offer-section .nce-contact,.nce-offer-section .nce-offer-list p{font-size:1.2rem!important}}.nce-offer-intro{font-size:1.5rem;font-weight:400}.outer-section-fadeout{position:absolute;top:139rem;height:40px;width:100%;background:linear-gradient(to bottom,#fff0,#f8f9fa)}.body-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}@media (width <= 768px){.nce-book-section{padding-top:5rem!important}.nce-contact{font-size:1.2rem!important}}::ng-deep .body-quill{border-width:0!important;max-width:900px;display:block;margin-left:auto;margin-right:auto}::ng-deep .p-inputtextarea{border-radius:.5rem;border-color:#ced4da;font-size:1rem}.card{background-color:#fff;border-radius:12px}.comment-row{gap:2rem;padding-bottom:5rem;max-width:1000px;display:block;margin-left:auto;margin-right:auto}.comment-label{font-size:1.5rem!important}.response-row{max-width:1000px;display:block;margin-left:auto;margin-right:auto;margin-top:6rem!important}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i8.LazyImgDirective, selector: "img" }, { kind: "component", type: ResourceEditCardComponent, selector: "pw-resource-edit-card", inputs: ["id", "resourceData"], outputs: ["updated"] }, { kind: "pipe", type: i10$1.TranslocoPipe, name: "transloco" }] }); }
1000
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TestimonialCardListComponent, selector: "pw-testimonial-card", inputs: { posts: "posts", postHeader: "postHeader" }, outputs: { editPost: "editPost" }, usesOnChanges: true, ngImport: i0, template: "<section class=\"resource-section section-outer bg-white\">\n <div class=\"container\">\n <div *ngIf=\"postHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap mb-3\">\n <h2 class=\"section-heading\">{{postHeader}}</h2>\n </div>\n <div *ngIf=\"posts.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n<div [hidden]=\"posts.length === 0\">\n <div class=\"swiper-container\">\n <div class=\"swiper-wrapper\">\n <div class=\"swiper-slide\" *ngFor=\"let post of posts\">\n <div class=\"testimonial-box\">\n <pw-resource-edit-card\n *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"editPost.emit(1, 100)\"\n ></pw-resource-edit-card>\n <div class=\"stars mb-5\">\u2605\u2605\u2605\u2605\u2605</div>\n <div class=\"testimonial-content\">\n <div class=\"ql-container ql-snow ql-res\">\n <div class=\"ql-editor\"\n [innerHTML]=\"post?.body\">\n </div>\n </div>\n </div>\n\n <!-- THIS STAYS AT BOTTOM -->\n <div class=\"avatar-container\">\n <img\n *ngIf=\"!post.rectangular_picture.url.includes('default-photo.jpg') \" [src]=\"post.rectangular_picture.url\"\n alt=\"Logo\"\n class=\"testimonial-logo mt-4\"\n />\n </div>\n </div>\n\n </div>\n </div>\n <div class=\"swiper-pagination\"></div>\n <div class=\"swiper-button-prev\"></div>\n <div class=\"swiper-button-next\"></div>\n </div>\n</div>\n </div>\n</section>", styles: [".resource-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 767px){.container{padding:0 1rem!important}}.ql-res{resize:none!important;border-width:0}.swiper-container{padding:20px;position:relative;overflow:hidden}@media (width >= 768px){.swiper-container{padding:20px 40px}}.resource-card{background:#fff;border-radius:8px;box-shadow:0 0 20px #0000001a;padding:1.5rem;height:100%;display:flex;flex-direction:column;margin:0 auto;width:100%;max-width:350px}.resource-title{font-size:1.25rem;font-weight:600;margin-bottom:1rem}.resource-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px}.read-now-btn{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;color:#000;text-decoration:none;font-weight:500}.read-now-btn .arrow{transition:transform .2s ease}.read-now-btn:hover .arrow{transform:translate(5px)}.swiper-button-prev,.swiper-button-next{color:#000}.swiper-button-prev:after,.swiper-button-next:after{font-size:24px}@media (width <= 767px){.swiper-button-prev,.swiper-button-next{display:none}}.swiper-pagination{position:relative;margin-top:20px}.swiper-pagination-bullet{background:#000;opacity:.5}.swiper-pagination-bullet-active{opacity:1}.swiper-wrapper{display:flex;align-items:stretch}.swiper-slide{display:flex;align-items:stretch;height:auto}.testimonial-box{display:flex;flex-direction:column;justify-content:space-between;background:#fff;border-radius:20px;padding:2.5rem 1.5rem;box-shadow:0 0 20px #0000001a;text-align:center;width:338px;font-size:1.1rem;height:100%;min-height:100%}.testimonial-box span{margin:0;font-size:22px}.testimonial-box .avatar-container{margin-top:auto}.testimonial-box .testimonial-logo{width:100%!important;height:auto!important;max-width:150px!important;object-fit:contain;align-self:center}.testimonial-box .stars{font-size:2.2rem;color:#f6b300;margin-bottom:2.5rem}.centaris-text{margin-bottom:3rem!important}@media (width <= 768px){::ng-deep .swiper-wrapper{gap:1rem!important}.testimonial-box{width:300px!important}}\n", ".video-row{gap:5.5rem!important;margin-top:3rem!important}::ng-deep .resource-section{box-shadow:0 4px 32px -14px #40576d4d!important}.release-icon{height:auto;margin:0 11px 1.9rem;display:block;align-self:center}@media (width >= 768px) and (width <= 1200px){.resource-title{font-size:1.4rem!important}}textarea{font-size:1.4rem!important}@media (width <= 768px){.resource-title{font-size:1.2rem!important}.container{padding:7rem 3rem 1rem!important}}@media (width >= 768px) and (width <= 1200px){.container{padding:1rem 3rem!important}}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .vault-card{width:100%!important}.msp-vault-section .vault-btn{margin-left:0!important;width:100%!important}}@media (width >= 991px){::ng-deep .trial-meeting-section:before{top:600px!important}::ng-deep .dashboard{margin-bottom:1rem!important}section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}section.bg-white.text-center.extra-top-padding:before,section.bg-white.text-center.extra-top-padding:after{content:\"\";position:absolute;background:url(/assets/img/logos/background-banner.png) no-repeat;background-size:contain;width:160px;height:450px;z-index:0;opacity:.8}section.bg-white.text-center.extra-top-padding:before{top:500px;left:0}section.bg-white.text-center.extra-top-padding:after{top:90px;right:0}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 1200px){.resource-card{width:100%!important}.release-notes-section{padding:7rem 0!important}}@media (width >= 768px) and (width <= 1200px){.nce-hero-section{padding:0 6rem!important}.cards-row{justify-content:center}}.resource-body-section{background-color:#fff}.resource-body-section .container{padding:0 1.5rem;padding-bottom:4rem!important;padding-top:7rem!important;max-width:850px;margin:0 auto;text-align:left}.user-not-logged-in{background:#f7f7f7;border:1px solid rgb(238,238,238);font-weight:400}.user-not-logged-in a{color:var(--first)!important;text-decoration:none;font-weight:500}.nce-book-section{background:#fff;padding-top:7rem;padding-bottom:0}.nce-book-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-book-section .nce-contact{line-height:1.6;font-size:1.5rem}.nce-book-section .nce-contact a{text-decoration:underline;color:#000;margin:0 .2rem}.nce-book-section .nce-contact a:hover{color:var(--first)!important}.nce-offer-section{background:#fff;padding-top:2rem}.nce-offer-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-offer-section .nce-title{font-size:2rem;font-weight:700;color:#000;margin-bottom:.25em!important}.nce-offer-section .nce-title strong{font-weight:700}.nce-offer-section .nce-description{font-size:1.5rem;line-height:1.8rem;color:#333;margin-bottom:1.5rem}.nce-offer-section .nce-offer-list{font-size:1.1rem;line-height:1.5rem;margin-bottom:2.5rem;margin-top:2.5rem}.nce-offer-section .nce-offer-list p{font-size:1.5rem;margin:.5rem 0;font-weight:400}.nce-offer-section .nce-signup{margin-bottom:2.5rem}.nce-offer-section .nce-signup .signup-link{font-size:1.5rem;font-weight:400;text-decoration:underline;color:#000}@media (width <= 768px){.nce-offer-section .nce-book-section{padding-top:5rem!important}.nce-offer-section .container{text-align:left}.nce-offer-section .nce-title{font-size:1.5rem}.nce-offer-section .nce-description,.nce-offer-section .nce-offer-list,.nce-offer-section .nce-signup,.nce-offer-section .signup-link,.nce-offer-section .nce-contact,.nce-offer-section .nce-offer-list p{font-size:1.2rem!important}}.nce-offer-intro{font-size:1.5rem;font-weight:400}.outer-section-fadeout{position:absolute;top:139rem;height:40px;width:100%;background:linear-gradient(to bottom,#fff0,#f8f9fa)}.body-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}@media (width <= 768px){.nce-book-section{padding-top:5rem!important}.nce-contact{font-size:1.2rem!important}}::ng-deep .body-quill{border-width:0!important;max-width:900px;display:block;margin-left:auto;margin-right:auto}::ng-deep .p-inputtextarea{border-radius:.5rem;border-color:#ced4da;font-size:1rem}.card{background-color:#fff;border-radius:12px}.comment-row{gap:2rem;padding-bottom:5rem;max-width:1000px;display:block;margin-left:auto;margin-right:auto}.comment-label{font-size:1.5rem!important}.response-row{max-width:1000px;display:block;margin-left:auto;margin-right:auto;margin-top:6rem!important}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i8.LazyImgDirective, selector: "img" }, { kind: "component", type: ResourceEditCardComponent, selector: "pw-resource-edit-card", inputs: ["id", "resourceData"], outputs: ["updated"] }, { kind: "pipe", type: i10$1.TranslocoPipe, name: "transloco" }] }); }
1001
1001
  }
1002
1002
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: TestimonialCardListComponent, decorators: [{
1003
1003
  type: Component,
1004
- args: [{ selector: 'pw-testimonial-card', template: "<section class=\"resource-section section-outer bg-white\">\n <div class=\"container\">\n <div *ngIf=\"postHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap mb-3\">\n <h2 class=\"section-heading\">{{postHeader}}</h2>\n </div>\n <div *ngIf=\"posts.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n<div [hidden]=\"posts.length === 0\">\n <div class=\"swiper-container\">\n <div class=\"swiper-wrapper\">\n <div class=\"swiper-slide\" *ngFor=\"let post of posts\">\n <div class=\"testimonial-box\">\n <pw-resource-edit-card\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"editPost.emit(1, 100)\"\n ></pw-resource-edit-card>\n <div class=\"stars mb-5\">\u2605\u2605\u2605\u2605\u2605</div>\n <div class=\"testimonial-content\">\n <div class=\"ql-container ql-snow ql-res\">\n <div class=\"ql-editor\"\n [innerHTML]=\"post?.body\">\n </div>\n </div>\n </div>\n\n <!-- THIS STAYS AT BOTTOM -->\n <div class=\"avatar-container\">\n <img\n *ngIf=\"!post.rectangular_picture.url.includes('default-photo.jpg') \" [src]=\"post.rectangular_picture.url\"\n alt=\"Logo\"\n class=\"testimonial-logo mt-4\"\n />\n </div>\n </div>\n\n </div>\n </div>\n <div class=\"swiper-pagination\"></div>\n <div class=\"swiper-button-prev\"></div>\n <div class=\"swiper-button-next\"></div>\n </div>\n</div>\n </div>\n</section>", styles: [".resource-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 767px){.container{padding:0 1rem!important}}.ql-res{resize:none!important;border-width:0}.swiper-container{padding:20px;position:relative;overflow:hidden}@media (width >= 768px){.swiper-container{padding:20px 40px}}.resource-card{background:#fff;border-radius:8px;box-shadow:0 0 20px #0000001a;padding:1.5rem;height:100%;display:flex;flex-direction:column;margin:0 auto;width:100%;max-width:350px}.resource-title{font-size:1.25rem;font-weight:600;margin-bottom:1rem}.resource-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px}.read-now-btn{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;color:#000;text-decoration:none;font-weight:500}.read-now-btn .arrow{transition:transform .2s ease}.read-now-btn:hover .arrow{transform:translate(5px)}.swiper-button-prev,.swiper-button-next{color:#000}.swiper-button-prev:after,.swiper-button-next:after{font-size:24px}@media (width <= 767px){.swiper-button-prev,.swiper-button-next{display:none}}.swiper-pagination{position:relative;margin-top:20px}.swiper-pagination-bullet{background:#000;opacity:.5}.swiper-pagination-bullet-active{opacity:1}.swiper-wrapper{display:flex;align-items:stretch}.swiper-slide{display:flex;align-items:stretch;height:auto}.testimonial-box{display:flex;flex-direction:column;justify-content:space-between;background:#fff;border-radius:20px;padding:2.5rem 1.5rem;box-shadow:0 0 20px #0000001a;text-align:center;width:338px;font-size:1.1rem;height:100%;min-height:100%}.testimonial-box span{margin:0;font-size:22px}.testimonial-box .avatar-container{margin-top:auto}.testimonial-box .testimonial-logo{width:100%!important;height:auto!important;max-width:150px!important;object-fit:contain;align-self:center}.testimonial-box .stars{font-size:2.2rem;color:#f6b300;margin-bottom:2.5rem}.centaris-text{margin-bottom:3rem!important}@media (width <= 768px){::ng-deep .swiper-wrapper{gap:1rem!important}.testimonial-box{width:300px!important}}\n", ".video-row{gap:5.5rem!important;margin-top:3rem!important}::ng-deep .resource-section{box-shadow:0 4px 32px -14px #40576d4d!important}.release-icon{height:auto;margin:0 11px 1.9rem;display:block;align-self:center}@media (width >= 768px) and (width <= 1200px){.resource-title{font-size:1.4rem!important}}textarea{font-size:1.4rem!important}@media (width <= 768px){.resource-title{font-size:1.2rem!important}.container{padding:7rem 3rem 1rem!important}}@media (width >= 768px) and (width <= 1200px){.container{padding:1rem 3rem!important}}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .vault-card{width:100%!important}.msp-vault-section .vault-btn{margin-left:0!important;width:100%!important}}@media (width >= 991px){::ng-deep .trial-meeting-section:before{top:600px!important}::ng-deep .dashboard{margin-bottom:1rem!important}section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}section.bg-white.text-center.extra-top-padding:before,section.bg-white.text-center.extra-top-padding:after{content:\"\";position:absolute;background:url(/assets/img/logos/background-banner.png) no-repeat;background-size:contain;width:160px;height:450px;z-index:0;opacity:.8}section.bg-white.text-center.extra-top-padding:before{top:500px;left:0}section.bg-white.text-center.extra-top-padding:after{top:90px;right:0}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 1200px){.resource-card{width:100%!important}.release-notes-section{padding:7rem 0!important}}@media (width >= 768px) and (width <= 1200px){.nce-hero-section{padding:0 6rem!important}.cards-row{justify-content:center}}.resource-body-section{background-color:#fff}.resource-body-section .container{padding:0 1.5rem;padding-bottom:4rem!important;padding-top:7rem!important;max-width:850px;margin:0 auto;text-align:left}.user-not-logged-in{background:#f7f7f7;border:1px solid rgb(238,238,238);font-weight:400}.user-not-logged-in a{color:var(--first)!important;text-decoration:none;font-weight:500}.nce-book-section{background:#fff;padding-top:7rem;padding-bottom:0}.nce-book-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-book-section .nce-contact{line-height:1.6;font-size:1.5rem}.nce-book-section .nce-contact a{text-decoration:underline;color:#000;margin:0 .2rem}.nce-book-section .nce-contact a:hover{color:var(--first)!important}.nce-offer-section{background:#fff;padding-top:2rem}.nce-offer-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-offer-section .nce-title{font-size:2rem;font-weight:700;color:#000;margin-bottom:.25em!important}.nce-offer-section .nce-title strong{font-weight:700}.nce-offer-section .nce-description{font-size:1.5rem;line-height:1.8rem;color:#333;margin-bottom:1.5rem}.nce-offer-section .nce-offer-list{font-size:1.1rem;line-height:1.5rem;margin-bottom:2.5rem;margin-top:2.5rem}.nce-offer-section .nce-offer-list p{font-size:1.5rem;margin:.5rem 0;font-weight:400}.nce-offer-section .nce-signup{margin-bottom:2.5rem}.nce-offer-section .nce-signup .signup-link{font-size:1.5rem;font-weight:400;text-decoration:underline;color:#000}@media (width <= 768px){.nce-offer-section .nce-book-section{padding-top:5rem!important}.nce-offer-section .container{text-align:left}.nce-offer-section .nce-title{font-size:1.5rem}.nce-offer-section .nce-description,.nce-offer-section .nce-offer-list,.nce-offer-section .nce-signup,.nce-offer-section .signup-link,.nce-offer-section .nce-contact,.nce-offer-section .nce-offer-list p{font-size:1.2rem!important}}.nce-offer-intro{font-size:1.5rem;font-weight:400}.outer-section-fadeout{position:absolute;top:139rem;height:40px;width:100%;background:linear-gradient(to bottom,#fff0,#f8f9fa)}.body-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}@media (width <= 768px){.nce-book-section{padding-top:5rem!important}.nce-contact{font-size:1.2rem!important}}::ng-deep .body-quill{border-width:0!important;max-width:900px;display:block;margin-left:auto;margin-right:auto}::ng-deep .p-inputtextarea{border-radius:.5rem;border-color:#ced4da;font-size:1rem}.card{background-color:#fff;border-radius:12px}.comment-row{gap:2rem;padding-bottom:5rem;max-width:1000px;display:block;margin-left:auto;margin-right:auto}.comment-label{font-size:1.5rem!important}.response-row{max-width:1000px;display:block;margin-left:auto;margin-right:auto;margin-top:6rem!important}\n"] }]
1004
+ args: [{ selector: 'pw-testimonial-card', template: "<section class=\"resource-section section-outer bg-white\">\n <div class=\"container\">\n <div *ngIf=\"postHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap mb-3\">\n <h2 class=\"section-heading\">{{postHeader}}</h2>\n </div>\n <div *ngIf=\"posts.length === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n<div [hidden]=\"posts.length === 0\">\n <div class=\"swiper-container\">\n <div class=\"swiper-wrapper\">\n <div class=\"swiper-slide\" *ngFor=\"let post of posts\">\n <div class=\"testimonial-box\">\n <pw-resource-edit-card\n *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n [id]=\"post.id\"\n [resourceData]=\"post\"\n (updated)=\"editPost.emit(1, 100)\"\n ></pw-resource-edit-card>\n <div class=\"stars mb-5\">\u2605\u2605\u2605\u2605\u2605</div>\n <div class=\"testimonial-content\">\n <div class=\"ql-container ql-snow ql-res\">\n <div class=\"ql-editor\"\n [innerHTML]=\"post?.body\">\n </div>\n </div>\n </div>\n\n <!-- THIS STAYS AT BOTTOM -->\n <div class=\"avatar-container\">\n <img\n *ngIf=\"!post.rectangular_picture.url.includes('default-photo.jpg') \" [src]=\"post.rectangular_picture.url\"\n alt=\"Logo\"\n class=\"testimonial-logo mt-4\"\n />\n </div>\n </div>\n\n </div>\n </div>\n <div class=\"swiper-pagination\"></div>\n <div class=\"swiper-button-prev\"></div>\n <div class=\"swiper-button-next\"></div>\n </div>\n</div>\n </div>\n</section>", styles: [".resource-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 767px){.container{padding:0 1rem!important}}.ql-res{resize:none!important;border-width:0}.swiper-container{padding:20px;position:relative;overflow:hidden}@media (width >= 768px){.swiper-container{padding:20px 40px}}.resource-card{background:#fff;border-radius:8px;box-shadow:0 0 20px #0000001a;padding:1.5rem;height:100%;display:flex;flex-direction:column;margin:0 auto;width:100%;max-width:350px}.resource-title{font-size:1.25rem;font-weight:600;margin-bottom:1rem}.resource-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:4px}.read-now-btn{margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;color:#000;text-decoration:none;font-weight:500}.read-now-btn .arrow{transition:transform .2s ease}.read-now-btn:hover .arrow{transform:translate(5px)}.swiper-button-prev,.swiper-button-next{color:#000}.swiper-button-prev:after,.swiper-button-next:after{font-size:24px}@media (width <= 767px){.swiper-button-prev,.swiper-button-next{display:none}}.swiper-pagination{position:relative;margin-top:20px}.swiper-pagination-bullet{background:#000;opacity:.5}.swiper-pagination-bullet-active{opacity:1}.swiper-wrapper{display:flex;align-items:stretch}.swiper-slide{display:flex;align-items:stretch;height:auto}.testimonial-box{display:flex;flex-direction:column;justify-content:space-between;background:#fff;border-radius:20px;padding:2.5rem 1.5rem;box-shadow:0 0 20px #0000001a;text-align:center;width:338px;font-size:1.1rem;height:100%;min-height:100%}.testimonial-box span{margin:0;font-size:22px}.testimonial-box .avatar-container{margin-top:auto}.testimonial-box .testimonial-logo{width:100%!important;height:auto!important;max-width:150px!important;object-fit:contain;align-self:center}.testimonial-box .stars{font-size:2.2rem;color:#f6b300;margin-bottom:2.5rem}.centaris-text{margin-bottom:3rem!important}@media (width <= 768px){::ng-deep .swiper-wrapper{gap:1rem!important}.testimonial-box{width:300px!important}}\n", ".video-row{gap:5.5rem!important;margin-top:3rem!important}::ng-deep .resource-section{box-shadow:0 4px 32px -14px #40576d4d!important}.release-icon{height:auto;margin:0 11px 1.9rem;display:block;align-self:center}@media (width >= 768px) and (width <= 1200px){.resource-title{font-size:1.4rem!important}}textarea{font-size:1.4rem!important}@media (width <= 768px){.resource-title{font-size:1.2rem!important}.container{padding:7rem 3rem 1rem!important}}@media (width >= 768px) and (width <= 1200px){.container{padding:1rem 3rem!important}}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .vault-card{width:100%!important}.msp-vault-section .vault-btn{margin-left:0!important;width:100%!important}}@media (width >= 991px){::ng-deep .trial-meeting-section:before{top:600px!important}::ng-deep .dashboard{margin-bottom:1rem!important}section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}section.bg-white.text-center.extra-top-padding:before,section.bg-white.text-center.extra-top-padding:after{content:\"\";position:absolute;background:url(/assets/img/logos/background-banner.png) no-repeat;background-size:contain;width:160px;height:450px;z-index:0;opacity:.8}section.bg-white.text-center.extra-top-padding:before{top:500px;left:0}section.bg-white.text-center.extra-top-padding:after{top:90px;right:0}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 1200px){.resource-card{width:100%!important}.release-notes-section{padding:7rem 0!important}}@media (width >= 768px) and (width <= 1200px){.nce-hero-section{padding:0 6rem!important}.cards-row{justify-content:center}}.resource-body-section{background-color:#fff}.resource-body-section .container{padding:0 1.5rem;padding-bottom:4rem!important;padding-top:7rem!important;max-width:850px;margin:0 auto;text-align:left}.user-not-logged-in{background:#f7f7f7;border:1px solid rgb(238,238,238);font-weight:400}.user-not-logged-in a{color:var(--first)!important;text-decoration:none;font-weight:500}.nce-book-section{background:#fff;padding-top:7rem;padding-bottom:0}.nce-book-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-book-section .nce-contact{line-height:1.6;font-size:1.5rem}.nce-book-section .nce-contact a{text-decoration:underline;color:#000;margin:0 .2rem}.nce-book-section .nce-contact a:hover{color:var(--first)!important}.nce-offer-section{background:#fff;padding-top:2rem}.nce-offer-section .container{max-width:850px;margin:0 auto;padding:0 1.5rem;text-align:left}.nce-offer-section .nce-title{font-size:2rem;font-weight:700;color:#000;margin-bottom:.25em!important}.nce-offer-section .nce-title strong{font-weight:700}.nce-offer-section .nce-description{font-size:1.5rem;line-height:1.8rem;color:#333;margin-bottom:1.5rem}.nce-offer-section .nce-offer-list{font-size:1.1rem;line-height:1.5rem;margin-bottom:2.5rem;margin-top:2.5rem}.nce-offer-section .nce-offer-list p{font-size:1.5rem;margin:.5rem 0;font-weight:400}.nce-offer-section .nce-signup{margin-bottom:2.5rem}.nce-offer-section .nce-signup .signup-link{font-size:1.5rem;font-weight:400;text-decoration:underline;color:#000}@media (width <= 768px){.nce-offer-section .nce-book-section{padding-top:5rem!important}.nce-offer-section .container{text-align:left}.nce-offer-section .nce-title{font-size:1.5rem}.nce-offer-section .nce-description,.nce-offer-section .nce-offer-list,.nce-offer-section .nce-signup,.nce-offer-section .signup-link,.nce-offer-section .nce-contact,.nce-offer-section .nce-offer-list p{font-size:1.2rem!important}}.nce-offer-intro{font-size:1.5rem;font-weight:400}.outer-section-fadeout{position:absolute;top:139rem;height:40px;width:100%;background:linear-gradient(to bottom,#fff0,#f8f9fa)}.body-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}@media (width <= 768px){.nce-book-section{padding-top:5rem!important}.nce-contact{font-size:1.2rem!important}}::ng-deep .body-quill{border-width:0!important;max-width:900px;display:block;margin-left:auto;margin-right:auto}::ng-deep .p-inputtextarea{border-radius:.5rem;border-color:#ced4da;font-size:1rem}.card{background-color:#fff;border-radius:12px}.comment-row{gap:2rem;padding-bottom:5rem;max-width:1000px;display:block;margin-left:auto;margin-right:auto}.comment-label{font-size:1.5rem!important}.response-row{max-width:1000px;display:block;margin-left:auto;margin-right:auto;margin-top:6rem!important}\n"] }]
1005
1005
  }], propDecorators: { editPost: [{
1006
1006
  type: Output
1007
1007
  }], posts: [{
@@ -1229,7 +1229,7 @@ class ResourceIntegrationComponent extends AppBaseComponent {
1229
1229
  });
1230
1230
  }
1231
1231
  loadMicrosoftVideo(videoUrl) {
1232
- window.open(videoUrl, '_blank');
1232
+ window.open(videoUrl, '_blank', 'noopener,noreferrer');
1233
1233
  }
1234
1234
  loadKeseyaVideo() {
1235
1235
  const baseUrl = `https://www.youtube.com/embed/${this.youtubeVideoId}?autoplay=1`;
@@ -1302,11 +1302,11 @@ class ResourceIntegrationComponent extends AppBaseComponent {
1302
1302
  moveItemInArray(this.editingGuides.items, event.previousIndex, event.currentIndex);
1303
1303
  }
1304
1304
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourceIntegrationComponent, deps: [{ token: i2$1.DomSanitizer }, { token: ResourceService }, { token: i3.NgbModal }, { token: i2.TagService }, { token: i2.AuthService }, { token: i5$2.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
1305
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceIntegrationComponent, selector: "pw-resource-integration", viewQueries: [{ propertyName: "editIntegrationsModal", first: true, predicate: ["editIntegrationsModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pw-resource-header></pw-resource-header>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container sec-container\">\n <div *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations (& counting)</h1>\n <p class=\"int-text\"> Search the current list of {{companyName}} vendor and distributor integrations below. <br />\n </p>\n </div>\n <pw-resource-company-card *ngIf=\"isLoaded\" [header]=\"'integrated vendors'\"\n (getPosts)=\"getPostTags()\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n [data]=\"posts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"text-center pt-3 mt-4\" *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <p class=\"see-span\"> Don\u2019t see what you\u2019re after? <a [href]=\"contactUsUrl\"\n target=\"_blank\"\n class=\"int-span team-span\">Speak with our team to request a connection >\n </a>\n </p>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container\">\n <pw-resource-company-card [header]=\"'integrated Distributors'\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n *ngIf=\"isLoaded\"\n [vendor]=\"true\"\n (getPosts)=\"getPostTags()\"\n [data]=\"distributerPosts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"integrations\">\n <div class=\"container\">\n\n <div class=\"how-it-works-wrapper\">\n <div class=\"d-flex\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n <div class=\"row section-row\" [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n <ng-container *ngIf=\"integrations?.items?.length > 0; else noIntegrations\">\n <ng-container *ngFor=\"let integration of integrations?.items\">\n <div\n class=\"col-md-6\"\n *ngIf=\"integration?.image_url || integration?.title || integration?.description\"\n >\n <ng-container *ngIf=\"integration?.video_url && integration?.video_url.includes('https'); else noVideo\">\n <div class=\"d-flex justify-content-center\">\n <img\n *ngIf=\"integration?.video_url\"\n [src]=\"integration?.image_url\"\n (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n class=\"how-it-works-img\"\n alt=\"Integration Video Thumbnail\"\n />\n </div>\n </ng-container>\n\n <ng-template #noVideo>\n <div class=\"d-flex justify-content-center\">\n <div class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #noIntegrations>\n <div class=\"w-100 text-center\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n </div>\n </ng-template>\n\n </div>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"showIntegrations()\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <div class=\"d-flex\">\n <h1 class=\"guide-title mb-3\">{{guideData?.items[0]?.title || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openGuidesModal(guidesEditModal)\"\n (keydown.enter)=\"openGuidesModal(guidesEditModal)\"\n (keydown.space)=\"openGuidesModal(guidesEditModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.items[0]?.description || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'\">\n </p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.items[0]?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.items[0]?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <ng-container *ngIf=\"guideData?.items[0]?.image_url && !guideData?.items[0].image_url.includes('default-photo.jpg'); else noDataTemplate\">\n <img\n [src]=\"guideData?.items[0].image_url\"\n alt=\"Guide\"\n class=\"guide-img\" />\n </ng-container>\n\n <ng-template #noDataTemplate>\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'--ADD ME ON THE ADMIN/DOMAINS MODULE--' | transloco\" />\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<pw-resource-note-card *ngIf=\"resourcePostTag?.tag_category_id\" [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Integrations Section</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-title\">Title</label>\n <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\" />\n </div>\n\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-description\">Description</label>\n <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"></textarea>\n </div>\n\n <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n <div *ngFor=\"let integration of editingIntegrations.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"d-flex justify-content-between align-items-center mb-2\">\n <label class=\"form-label mb-0\" for=\"integration-item\">Integration Item</label>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" />\n </div>\n <div class=\"col-md-12 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" />\n </div>\n </div>\n\n <div class=\"d-flex justify-content-end\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\" (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Guides</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n <div *ngFor=\"let guide of editingGuides.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" />\n </div>\n <div class=\"col-12 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n </div>\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".int-span{font-size:3rem;color:#3d8fbe}.team-span{font-size:2rem;color:#3d8fbe;font-weight:100}.see-span{font-size:2rem;font-weight:100}::ng-deep .edit-card .in-page-edit-icon{margin-left:1rem!important;margin-top:.5rem!important}::ng-deep .modal-content{margin-top:5rem!important}.how-it-works-wrapper .it-works-title{font-size:3rem;margin-bottom:2rem;color:var(--text-color, black);font-weight:200!important;padding-bottom:12px!important}.how-it-works-wrapper .how-it-works-img{width:85%!important;margin:0 auto!important}.how-it-works-wrapper p{padding-top:1rem;font-size:2rem;color:#000;font-weight:100;margin-bottom:4rem}.guide-wrapper{padding:55px 47px 220px}.guide-wrapper .horizontal{position:absolute;left:0;bottom:24%;width:100%}.guide-wrapper .pb-20{padding-bottom:20px}.guide-wrapper .flex{display:flex}.guide-wrapper .guideimg{margin:0 auto}.guide-wrapper .guide-title{font: 500 28px Montserrat-Regular,sans-serif}.guide-wrapper p{font: 400 17px Montserrat-Regular,sans-serif;color:#182527}.cloudolive-guide-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}.cloudolive-guide-section .integration-fadeout{position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to bottom,#fff0,#f8f9fa);pointer-events:none}@media (width >= 768px){.cloudolive-guide-section .container-section{padding:20px 190px 20px 120px!important}}@media (width <= 768px){.cloudolive-guide-section .container-section{padding:3rem!important}.cloudolive-guide-section .guide-img{max-width:236px!important}.cloudolive-guide-section .guide-title{font-size:3.25rem!important}.cloudolive-guide-section .vault-btn{width:90%!important;margin-bottom:3rem!important}.cloudolive-guide-section .guide-subtext{padding:2rem;line-height:2rem!important}}.cloudolive-guide-section .guide-title{font-size:3rem;font-weight:200}.cloudolive-guide-section .guide-subtext{font-size:1.7rem;line-height:3rem;color:var(--text-color, black);font-weight:200;margin-bottom:2rem}.cloudolive-guide-section .guide-note{font-size:1.7rem;color:#000;font-weight:100}.cloudolive-guide-section .vault-btn{display:inline-block;background:var(--text-color, black);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;margin-top:1rem!important;font-size:1.4rem;border:1px solid;box-shadow:none!important;border-color:var(--text-color, textColor)}.cloudolive-guide-section .vault-btn:hover{background:#fff;color:var(--text-color, black)!important}.cloudolive-guide-section .guide-img{max-width:536px;max-height:536px!important;height:auto}.int-title{color:var(--text-color, black);font-size:4rem!important;font-weight:400}.int-text{font-size:1.3rem;font-weight:300}@media (width >= 991px){.section-outer{padding-top:7rem!important}}\n", ".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"], dependencies: [{ kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.Trial4ContactUsComponent, selector: "pw-trial-4-contact-us", inputs: ["subscriptionId", "sourceId", "masterSubscriptionId", "experimentName", "microserviceName", "shardName"] }, { kind: "component", type: i5.ResourceHeaderComponent, selector: "pw-resource-header" }, { kind: "component", type: i6$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i11.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i11.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i11.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i5.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i8.LazyImgDirective, selector: "img" }, { kind: "component", type: IntegrationTopBannerComponent, selector: "pw-integration-top-banner" }, { kind: "component", type: ResourceNoteCardComponent, selector: "pw-resource-note-card", inputs: ["releaseHeader", "categoryId", "isReleasePress", "postSlice", "resourceTitle", "tag"] }, { kind: "component", type: ResourceCompanyCardComponent, selector: "pw-resource-company-card", inputs: ["header", "data", "integrationCountDisplay", "vendor"], outputs: ["getPosts"] }, { kind: "pipe", type: i10$1.TranslocoPipe, name: "transloco" }] }); }
1305
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceIntegrationComponent, selector: "pw-resource-integration", viewQueries: [{ propertyName: "editIntegrationsModal", first: true, predicate: ["editIntegrationsModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<pw-resource-header></pw-resource-header>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container sec-container\">\n <div *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations (& counting)</h1>\n <p class=\"int-text\"> Search the current list of {{companyName}} vendor and distributor integrations below. <br />\n </p>\n </div>\n <pw-resource-company-card *ngIf=\"isLoaded\" [header]=\"'integrated vendors'\"\n (getPosts)=\"getPostTags()\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n [data]=\"posts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"text-center pt-3 mt-4\" *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <p class=\"see-span\"> Don\u2019t see what you\u2019re after? <a [href]=\"contactUsUrl\"\n target=\"_blank\"\n class=\"int-span team-span\">Speak with our team to request a connection >\n </a>\n </p>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container\">\n <pw-resource-company-card [header]=\"'integrated Distributors'\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n *ngIf=\"isLoaded\"\n [vendor]=\"true\"\n (getPosts)=\"getPostTags()\"\n [data]=\"distributerPosts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"integrations\">\n <div class=\"container\">\n\n <div class=\"how-it-works-wrapper\">\n <div class=\"d-flex\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n <div class=\"row section-row\" [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n <ng-container *ngIf=\"integrations?.items?.length > 0; else noIntegrations\">\n <ng-container *ngFor=\"let integration of integrations?.items\">\n <div\n class=\"col-md-6\"\n *ngIf=\"integration?.image_url || integration?.title || integration?.description\"\n >\n <ng-container *ngIf=\"integration?.video_url && integration?.video_url.includes('https'); else noVideo\">\n <div class=\"d-flex justify-content-center cursor-pointer\">\n <img\n *ngIf=\"integration?.video_url\"\n [src]=\"integration?.image_url\"\n (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n class=\"how-it-works-img\"\n alt=\"Integration Video Thumbnail\"\n />\n </div>\n </ng-container>\n\n <ng-template #noVideo>\n <div class=\"d-flex justify-content-center\">\n <div class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #noIntegrations>\n <div class=\"w-100 text-center\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n </div>\n </ng-template>\n\n </div>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"showIntegrations()\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <div class=\"d-flex\">\n <h1 class=\"guide-title mb-3\">{{guideData?.items[0]?.title || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openGuidesModal(guidesEditModal)\"\n (keydown.enter)=\"openGuidesModal(guidesEditModal)\"\n (keydown.space)=\"openGuidesModal(guidesEditModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.items[0]?.description || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'\">\n </p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.items[0]?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.items[0]?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <ng-container *ngIf=\"guideData?.items[0]?.image_url && !guideData?.items[0].image_url.includes('default-photo.jpg'); else noDataTemplate\">\n <img\n [src]=\"guideData?.items[0].image_url\"\n alt=\"Guide\"\n class=\"guide-img\" />\n </ng-container>\n\n <ng-template #noDataTemplate>\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'--ADD ME ON THE ADMIN/DOMAINS MODULE--' | transloco\" />\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<pw-resource-note-card *ngIf=\"resourcePostTag?.tag_category_id\" [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Integrations Section</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-title\">Title</label>\n <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\" />\n </div>\n\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-description\">Description</label>\n <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"></textarea>\n </div>\n\n <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n <div *ngFor=\"let integration of editingIntegrations.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"d-flex justify-content-between align-items-center mb-2\">\n <label class=\"form-label mb-0\" for=\"integration-item\">Integration Item</label>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" />\n </div>\n <div class=\"col-md-12 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" />\n </div>\n </div>\n\n <div class=\"d-flex justify-content-end\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\" (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Guides</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n <div *ngFor=\"let guide of editingGuides.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" />\n </div>\n <div class=\"col-12 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n </div>\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".int-span{font-size:3rem;color:#3d8fbe}.team-span{font-size:2rem;color:#3d8fbe;font-weight:100}.see-span{font-size:2rem;font-weight:100}::ng-deep .edit-card .in-page-edit-icon{margin-left:1rem!important;margin-top:.5rem!important}::ng-deep .modal-content{margin-top:5rem!important}.how-it-works-wrapper .it-works-title{font-size:3rem;margin-bottom:2rem;color:var(--text-color, black);font-weight:200!important;padding-bottom:12px!important}.how-it-works-wrapper .how-it-works-img{width:85%!important;margin:0 auto!important}.how-it-works-wrapper p{padding-top:1rem;font-size:2rem;color:#000;font-weight:100;margin-bottom:4rem}.guide-wrapper{padding:55px 47px 220px}.guide-wrapper .horizontal{position:absolute;left:0;bottom:24%;width:100%}.guide-wrapper .pb-20{padding-bottom:20px}.guide-wrapper .flex{display:flex}.guide-wrapper .guideimg{margin:0 auto}.guide-wrapper .guide-title{font: 500 28px Montserrat-Regular,sans-serif}.guide-wrapper p{font: 400 17px Montserrat-Regular,sans-serif;color:#182527}.cloudolive-guide-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}.cloudolive-guide-section .integration-fadeout{position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to bottom,#fff0,#f8f9fa);pointer-events:none}@media (width >= 768px){.cloudolive-guide-section .container-section{padding:20px 190px 20px 120px!important}}@media (width <= 768px){.cloudolive-guide-section .container-section{padding:3rem!important}.cloudolive-guide-section .guide-img{max-width:236px!important}.cloudolive-guide-section .guide-title{font-size:3.25rem!important}.cloudolive-guide-section .vault-btn{width:90%!important;margin-bottom:3rem!important}.cloudolive-guide-section .guide-subtext{padding:2rem;line-height:2rem!important}}.cloudolive-guide-section .guide-title{font-size:3rem;font-weight:200}.cloudolive-guide-section .guide-subtext{font-size:1.7rem;line-height:3rem;color:var(--text-color, black);font-weight:200;margin-bottom:2rem}.cloudolive-guide-section .guide-note{font-size:1.7rem;color:#000;font-weight:100}.cloudolive-guide-section .vault-btn{display:inline-block;background:var(--text-color, black);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;margin-top:1rem!important;font-size:1.4rem;border:1px solid;box-shadow:none!important;border-color:var(--text-color, textColor)}.cloudolive-guide-section .vault-btn:hover{background:#fff;color:var(--text-color, black)!important}.cloudolive-guide-section .guide-img{max-width:536px;max-height:536px!important;height:auto}.int-title{color:var(--text-color, black);font-size:4rem!important;font-weight:400}.int-text{font-size:1.3rem;font-weight:300}@media (width >= 991px){.section-outer{padding-top:7rem!important}}\n", ".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"], dependencies: [{ kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.Trial4ContactUsComponent, selector: "pw-trial-4-contact-us", inputs: ["subscriptionId", "sourceId", "masterSubscriptionId", "experimentName", "microserviceName", "shardName"] }, { kind: "component", type: i5.ResourceHeaderComponent, selector: "pw-resource-header" }, { kind: "component", type: i6$1.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i11.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i11.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i11.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "component", type: i5.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i8.LazyImgDirective, selector: "img" }, { kind: "component", type: IntegrationTopBannerComponent, selector: "pw-integration-top-banner" }, { kind: "component", type: ResourceNoteCardComponent, selector: "pw-resource-note-card", inputs: ["releaseHeader", "categoryId", "isReleasePress", "postSlice", "resourceTitle", "tag"] }, { kind: "component", type: ResourceCompanyCardComponent, selector: "pw-resource-company-card", inputs: ["header", "data", "integrationCountDisplay", "vendor"], outputs: ["getPosts"] }, { kind: "pipe", type: i10$1.TranslocoPipe, name: "transloco" }] }); }
1306
1306
  }
1307
1307
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourceIntegrationComponent, decorators: [{
1308
1308
  type: Component,
1309
- args: [{ selector: 'pw-resource-integration', template: "<pw-resource-header></pw-resource-header>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container sec-container\">\n <div *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations (& counting)</h1>\n <p class=\"int-text\"> Search the current list of {{companyName}} vendor and distributor integrations below. <br />\n </p>\n </div>\n <pw-resource-company-card *ngIf=\"isLoaded\" [header]=\"'integrated vendors'\"\n (getPosts)=\"getPostTags()\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n [data]=\"posts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"text-center pt-3 mt-4\" *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <p class=\"see-span\"> Don\u2019t see what you\u2019re after? <a [href]=\"contactUsUrl\"\n target=\"_blank\"\n class=\"int-span team-span\">Speak with our team to request a connection >\n </a>\n </p>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container\">\n <pw-resource-company-card [header]=\"'integrated Distributors'\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n *ngIf=\"isLoaded\"\n [vendor]=\"true\"\n (getPosts)=\"getPostTags()\"\n [data]=\"distributerPosts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"integrations\">\n <div class=\"container\">\n\n <div class=\"how-it-works-wrapper\">\n <div class=\"d-flex\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n <div class=\"row section-row\" [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n <ng-container *ngIf=\"integrations?.items?.length > 0; else noIntegrations\">\n <ng-container *ngFor=\"let integration of integrations?.items\">\n <div\n class=\"col-md-6\"\n *ngIf=\"integration?.image_url || integration?.title || integration?.description\"\n >\n <ng-container *ngIf=\"integration?.video_url && integration?.video_url.includes('https'); else noVideo\">\n <div class=\"d-flex justify-content-center\">\n <img\n *ngIf=\"integration?.video_url\"\n [src]=\"integration?.image_url\"\n (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n class=\"how-it-works-img\"\n alt=\"Integration Video Thumbnail\"\n />\n </div>\n </ng-container>\n\n <ng-template #noVideo>\n <div class=\"d-flex justify-content-center\">\n <div class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #noIntegrations>\n <div class=\"w-100 text-center\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n </div>\n </ng-template>\n\n </div>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"showIntegrations()\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <div class=\"d-flex\">\n <h1 class=\"guide-title mb-3\">{{guideData?.items[0]?.title || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openGuidesModal(guidesEditModal)\"\n (keydown.enter)=\"openGuidesModal(guidesEditModal)\"\n (keydown.space)=\"openGuidesModal(guidesEditModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.items[0]?.description || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'\">\n </p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.items[0]?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.items[0]?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <ng-container *ngIf=\"guideData?.items[0]?.image_url && !guideData?.items[0].image_url.includes('default-photo.jpg'); else noDataTemplate\">\n <img\n [src]=\"guideData?.items[0].image_url\"\n alt=\"Guide\"\n class=\"guide-img\" />\n </ng-container>\n\n <ng-template #noDataTemplate>\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'--ADD ME ON THE ADMIN/DOMAINS MODULE--' | transloco\" />\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<pw-resource-note-card *ngIf=\"resourcePostTag?.tag_category_id\" [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Integrations Section</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-title\">Title</label>\n <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\" />\n </div>\n\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-description\">Description</label>\n <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"></textarea>\n </div>\n\n <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n <div *ngFor=\"let integration of editingIntegrations.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"d-flex justify-content-between align-items-center mb-2\">\n <label class=\"form-label mb-0\" for=\"integration-item\">Integration Item</label>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" />\n </div>\n <div class=\"col-md-12 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" />\n </div>\n </div>\n\n <div class=\"d-flex justify-content-end\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\" (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Guides</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n <div *ngFor=\"let guide of editingGuides.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" />\n </div>\n <div class=\"col-12 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n </div>\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".int-span{font-size:3rem;color:#3d8fbe}.team-span{font-size:2rem;color:#3d8fbe;font-weight:100}.see-span{font-size:2rem;font-weight:100}::ng-deep .edit-card .in-page-edit-icon{margin-left:1rem!important;margin-top:.5rem!important}::ng-deep .modal-content{margin-top:5rem!important}.how-it-works-wrapper .it-works-title{font-size:3rem;margin-bottom:2rem;color:var(--text-color, black);font-weight:200!important;padding-bottom:12px!important}.how-it-works-wrapper .how-it-works-img{width:85%!important;margin:0 auto!important}.how-it-works-wrapper p{padding-top:1rem;font-size:2rem;color:#000;font-weight:100;margin-bottom:4rem}.guide-wrapper{padding:55px 47px 220px}.guide-wrapper .horizontal{position:absolute;left:0;bottom:24%;width:100%}.guide-wrapper .pb-20{padding-bottom:20px}.guide-wrapper .flex{display:flex}.guide-wrapper .guideimg{margin:0 auto}.guide-wrapper .guide-title{font: 500 28px Montserrat-Regular,sans-serif}.guide-wrapper p{font: 400 17px Montserrat-Regular,sans-serif;color:#182527}.cloudolive-guide-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}.cloudolive-guide-section .integration-fadeout{position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to bottom,#fff0,#f8f9fa);pointer-events:none}@media (width >= 768px){.cloudolive-guide-section .container-section{padding:20px 190px 20px 120px!important}}@media (width <= 768px){.cloudolive-guide-section .container-section{padding:3rem!important}.cloudolive-guide-section .guide-img{max-width:236px!important}.cloudolive-guide-section .guide-title{font-size:3.25rem!important}.cloudolive-guide-section .vault-btn{width:90%!important;margin-bottom:3rem!important}.cloudolive-guide-section .guide-subtext{padding:2rem;line-height:2rem!important}}.cloudolive-guide-section .guide-title{font-size:3rem;font-weight:200}.cloudolive-guide-section .guide-subtext{font-size:1.7rem;line-height:3rem;color:var(--text-color, black);font-weight:200;margin-bottom:2rem}.cloudolive-guide-section .guide-note{font-size:1.7rem;color:#000;font-weight:100}.cloudolive-guide-section .vault-btn{display:inline-block;background:var(--text-color, black);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;margin-top:1rem!important;font-size:1.4rem;border:1px solid;box-shadow:none!important;border-color:var(--text-color, textColor)}.cloudolive-guide-section .vault-btn:hover{background:#fff;color:var(--text-color, black)!important}.cloudolive-guide-section .guide-img{max-width:536px;max-height:536px!important;height:auto}.int-title{color:var(--text-color, black);font-size:4rem!important;font-weight:400}.int-text{font-size:1.3rem;font-weight:300}@media (width >= 991px){.section-outer{padding-top:7rem!important}}\n", ".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"] }]
1309
+ args: [{ selector: 'pw-resource-integration', template: "<pw-resource-header></pw-resource-header>\n<pw-integration-top-banner></pw-integration-top-banner>\n<div class=\"bg-white\">\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container sec-container\">\n <div *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <h1 class=\"int-title mb-0\">{{ integrationCountDisplay }}+ integrations (& counting)</h1>\n <p class=\"int-text\"> Search the current list of {{companyName}} vendor and distributor integrations below. <br />\n </p>\n </div>\n <pw-resource-company-card *ngIf=\"isLoaded\" [header]=\"'integrated vendors'\"\n (getPosts)=\"getPostTags()\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n [data]=\"posts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n <div class=\"text-center pt-3 mt-4\" *ngIf=\"isLoaded && integrationCountDisplay > 0\">\n <p class=\"see-span\"> Don\u2019t see what you\u2019re after? <a [href]=\"contactUsUrl\"\n target=\"_blank\"\n class=\"int-span team-span\">Speak with our team to request a connection >\n </a>\n </p>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\">\n <div class=\"container\">\n <pw-resource-company-card [header]=\"'integrated Distributors'\"\n [integrationCountDisplay]=\"integrationCountDisplay\"\n *ngIf=\"isLoaded\"\n [vendor]=\"true\"\n (getPosts)=\"getPostTags()\"\n [data]=\"distributerPosts\"></pw-resource-company-card>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"integrationCountDisplay === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"integrations\">\n <div class=\"container\">\n\n <div class=\"how-it-works-wrapper\">\n <div class=\"d-flex\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.enter)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n (keydown.space)=\"openEditIntegrationsModal(editIntegrationsModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"pb-20\" [innerHTML]=\"integrations?.description || 'View short example videos to understand how these integrations can work for you:'\"></p>\n <div class=\"row section-row\" [ngClass]=\"{ 'justify-content-center': integrations?.items?.length === 1 }\">\n <ng-container *ngIf=\"integrations?.items?.length > 0; else noIntegrations\">\n <ng-container *ngFor=\"let integration of integrations?.items\">\n <div\n class=\"col-md-6\"\n *ngIf=\"integration?.image_url || integration?.title || integration?.description\"\n >\n <ng-container *ngIf=\"integration?.video_url && integration?.video_url.includes('https'); else noVideo\">\n <div class=\"d-flex justify-content-center cursor-pointer\">\n <img\n *ngIf=\"integration?.video_url\"\n [src]=\"integration?.image_url\"\n (click)=\"loadMicrosoftVideo(integration?.video_url)\"\n (keydown.enter)=\"loadMicrosoftVideo(integration?.video_url)\"\n class=\"how-it-works-img\"\n alt=\"Integration Video Thumbnail\"\n />\n </div>\n </ng-container>\n\n <ng-template #noVideo>\n <div class=\"d-flex justify-content-center\">\n <div class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'No video found' | transloco\">\n </pw-no-data>\n </div>\n </div>\n </ng-template>\n </div>\n </ng-container>\n </ng-container>\n <ng-template #noIntegrations>\n <div class=\"w-100 text-center\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Integration.NoDataMessage' | transloco\"></pw-no-data>\n </div>\n </ng-template>\n\n </div>\n </div>\n </div>\n\n </section>\n <section class=\"cloudolive-guide-section bg-white py-5 section-outer\" *ngIf=\"showIntegrations()\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <div class=\"d-flex\">\n <h1 class=\"guide-title mb-3\">{{guideData?.items[0]?.title || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'}}</h1>\n <i *ngIf=\"userLoggedIn && user?.auth?.granted['Pages.Admin']\"\n class=\"fa fa-edit in-page-edit-icon text-black ms-4 mt-3 cursor-pointer\"\n (click)=\"openGuidesModal(guidesEditModal)\"\n (keydown.enter)=\"openGuidesModal(guidesEditModal)\"\n (keydown.space)=\"openGuidesModal(guidesEditModal)\"\n title=\"Edit Integrations Section\"></i>\n </div>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.items[0]?.description || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'\">\n </p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.items[0]?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.items[0]?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <ng-container *ngIf=\"guideData?.items[0]?.image_url && !guideData?.items[0].image_url.includes('default-photo.jpg'); else noDataTemplate\">\n <img\n [src]=\"guideData?.items[0].image_url\"\n alt=\"Guide\"\n class=\"guide-img\" />\n </ng-container>\n\n <ng-template #noDataTemplate>\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'--ADD ME ON THE ADMIN/DOMAINS MODULE--' | transloco\" />\n </div>\n </ng-template>\n </div>\n </div>\n </div>\n </section>\n</div>\n\n<pw-resource-note-card *ngIf=\"resourcePostTag?.tag_category_id\" [categoryId]=\"resourcePostTag?.tag_category_id\" [tag]=\"resourcePostTag\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\n\n\n\n<ng-template #editIntegrationsModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Integrations Section</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-title\">Title</label>\n <input class=\"form-control\" id=\"integration-title\" [(ngModel)]=\"editingIntegrations.title\" />\n </div>\n\n <div class=\"mb-3\">\n <label class=\"form-label\" for=\"integration-description\">Description</label>\n <textarea class=\"form-control\" id=\"integration-description\" rows=\"3\" [(ngModel)]=\"editingIntegrations.description\"></textarea>\n </div>\n\n <div cdkDropList (cdkDropListDropped)=\"dropIntegrationItems($event)\">\n <div *ngFor=\"let integration of editingIntegrations.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"d-flex justify-content-between align-items-center mb-2\">\n <label class=\"form-label mb-0\" for=\"integration-item\">Integration Item</label>\n <i class=\"fa fa-bars cursor-move in-page-bars-icon\" cdkDragHandle></i>\n </div>\n\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'integration-item-title-' + i\" [(ngModel)]=\"integration.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-description-' + i\">Description</label>\n <input class=\"form-control\" [id]=\"'integration-item-description-' + i\" [(ngModel)]=\"integration.description\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-blog-url-' + i\">Blog URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-blog-url-' + i\" [(ngModel)]=\"integration.blog_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-image-url-' + i\" [(ngModel)]=\"integration.image_url\" />\n </div>\n <div class=\"col-md-12 mb-2\">\n <label class=\"form-label\" [for]=\"'integration-item-video-url-' + i\">Video URL</label>\n <input class=\"form-control\" [id]=\"'integration-item-video-url-' + i\" [(ngModel)]=\"integration.video_url\" />\n </div>\n </div>\n\n <div class=\"d-flex justify-content-end\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeIntegrationItem(i)\" (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"></i>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-outline-primary btn-sm\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveIntegrations(modal)\">Save</button>\n </div>\n</ng-template>\n\n\n\n<ng-template #guidesEditModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Edit Guides</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n\n <div class=\"modal-body\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div cdkDropList (cdkDropListDropped)=\"dropGuides($event)\">\n <div *ngFor=\"let guide of editingGuides.items; let i = index\" class=\"border p-3 mb-3\" cdkDrag>\n <div class=\"row\">\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-title-' + i\">Title</label>\n <input class=\"form-control\" [id]=\"'guide-title-' + i\" [(ngModel)]=\"guide.title\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-button-text-' + i\">Button Text</label>\n <input class=\"form-control\" [id]=\"'guide-button-text-' + i\" [(ngModel)]=\"guide.button_text\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-image-url-' + i\">Image URL</label>\n <input class=\"form-control\" [id]=\"'guide-image-url-' + i\" [(ngModel)]=\"guide.image_url\" />\n </div>\n <div class=\"col-md-6 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-url-' + i\">Guide URL</label>\n <input class=\"form-control\" [id]=\"'guide-url-' + i\" [(ngModel)]=\"guide.guide_url\" />\n </div>\n <div class=\"col-12 mb-2\">\n <label class=\"form-label\" [for]=\"'guide-description-' + i\">Description</label>\n <textarea class=\"form-control\" [id]=\"'guide-description-' + i\" rows=\"3\" [(ngModel)]=\"guide.description\"></textarea>\n </div>\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <i class=\"fa fa-trash text-danger cursor-pointer\" (click)=\"removeGuide(i)\" (keydown.enter)=\"removeGuide(i)\" (keydown.space)=\"removeGuide(i)\"></i>\n <i class=\"fa fa-bars cursor-move\" cdkDragHandle></i>\n </div>\n </div>\n </div>\n </div>\n\n <button class=\"btn btn-primary mt-2\" (click)=\"addGuide()\">+ Add Guide</button>\n </div>\n\n <div class=\"modal-footer\">\n <button class=\"btn btn-secondary\" (click)=\"modal.dismiss()\">Cancel</button>\n <button class=\"btn btn-primary\" (click)=\"saveGuides(modal)\">Save</button>\n </div>\n</ng-template>\n", styles: [".int-span{font-size:3rem;color:#3d8fbe}.team-span{font-size:2rem;color:#3d8fbe;font-weight:100}.see-span{font-size:2rem;font-weight:100}::ng-deep .edit-card .in-page-edit-icon{margin-left:1rem!important;margin-top:.5rem!important}::ng-deep .modal-content{margin-top:5rem!important}.how-it-works-wrapper .it-works-title{font-size:3rem;margin-bottom:2rem;color:var(--text-color, black);font-weight:200!important;padding-bottom:12px!important}.how-it-works-wrapper .how-it-works-img{width:85%!important;margin:0 auto!important}.how-it-works-wrapper p{padding-top:1rem;font-size:2rem;color:#000;font-weight:100;margin-bottom:4rem}.guide-wrapper{padding:55px 47px 220px}.guide-wrapper .horizontal{position:absolute;left:0;bottom:24%;width:100%}.guide-wrapper .pb-20{padding-bottom:20px}.guide-wrapper .flex{display:flex}.guide-wrapper .guideimg{margin:0 auto}.guide-wrapper .guide-title{font: 500 28px Montserrat-Regular,sans-serif}.guide-wrapper p{font: 400 17px Montserrat-Regular,sans-serif;color:#182527}.cloudolive-guide-section{box-shadow:0 4px 32px -14px #40576d4d!important;position:relative}.cloudolive-guide-section .integration-fadeout{position:absolute;bottom:0;left:0;width:100%;height:80px;background:linear-gradient(to bottom,#fff0,#f8f9fa);pointer-events:none}@media (width >= 768px){.cloudolive-guide-section .container-section{padding:20px 190px 20px 120px!important}}@media (width <= 768px){.cloudolive-guide-section .container-section{padding:3rem!important}.cloudolive-guide-section .guide-img{max-width:236px!important}.cloudolive-guide-section .guide-title{font-size:3.25rem!important}.cloudolive-guide-section .vault-btn{width:90%!important;margin-bottom:3rem!important}.cloudolive-guide-section .guide-subtext{padding:2rem;line-height:2rem!important}}.cloudolive-guide-section .guide-title{font-size:3rem;font-weight:200}.cloudolive-guide-section .guide-subtext{font-size:1.7rem;line-height:3rem;color:var(--text-color, black);font-weight:200;margin-bottom:2rem}.cloudolive-guide-section .guide-note{font-size:1.7rem;color:#000;font-weight:100}.cloudolive-guide-section .vault-btn{display:inline-block;background:var(--text-color, black);color:#fff;padding:1rem 2rem;border-radius:40px;font-weight:500;text-decoration:none;margin-top:1rem!important;font-size:1.4rem;border:1px solid;box-shadow:none!important;border-color:var(--text-color, textColor)}.cloudolive-guide-section .vault-btn:hover{background:#fff;color:var(--text-color, black)!important}.cloudolive-guide-section .guide-img{max-width:536px;max-height:536px!important;height:auto}.int-title{color:var(--text-color, black);font-size:4rem!important;font-weight:400}.int-text{font-size:1.3rem;font-weight:300}@media (width >= 991px){.section-outer{padding-top:7rem!important}}\n", ".bold{font-weight:700}.nce-heading{margin-bottom:2rem}.nce-note{margin-top:1rem;font-size:.85rem;color:#555}.nce-divider{border:0;height:40px;width:100%;background:linear-gradient(to bottom,#0000,#00000026);margin:0}.press-release-icon{height:auto!important;margin:0 11px 1.9rem;display:block;align-self:center;width:auto!important;aspect-ratio:0!important;object-fit:cover;margin-top:auto;margin-right:0!important}.msp-vault-section{padding:60px 0;background:#fff;padding-bottom:9rem!important;padding-top:7rem!important;box-shadow:0 4px 32px -14px #40576d4d!important}.msp-vault-section .vault-heading{font-size:3rem;font-weight:300}.msp-vault-section .explore-link{color:#000;font-weight:400;text-decoration:none;font-size:1.5rem}.msp-vault-section .resource-blog-card{display:flex;flex-direction:column;justify-content:space-between;background-color:#fff;border-radius:30px;box-shadow:0 20px 40px #00000014;padding:25px;text-align:center;width:338px;height:auto!important}.msp-vault-section .resource-blog-card h5{font-size:1.5rem;font-weight:400;margin-bottom:.5rem;color:var(--text-color, black)}.msp-vault-section .resource-blog-card p{font-size:1.5rem;color:var(--text-color, black);line-height:2rem}.msp-vault-section .resource-blog-card img{width:100%;border-radius:10px;aspect-ratio:1/1;object-fit:cover;margin-top:auto;margin-right:0!important;max-width:250px!important;align-self:center!important}.msp-vault-section .resource-blog-card iframe{height:210px;border-radius:10px;object-fit:cover;margin-right:0!important;max-width:280px!important}.msp-vault-section .resource-blog-card .resource-btn{background-color:var(--text-color, black);color:#fff;margin-top:auto;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;width:100%;max-width:240px;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-self:center;align-items:center;text-align:left;text-decoration:none;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.msp-vault-section .resource-blog-card .resource-btn:hover{background:#fff;color:var(--text-color, black)!important}.msp-vault-section .vault-description{text-align:left;max-width:657px;color:#182527;line-height:2.3rem!important;font-size:1.65rem}@media (width <= 1200px){.msp-vault-section .vault-heading{font-size:3.5rem}.msp-vault-section .vault-description{margin-top:1.35rem}.msp-vault-section .resource-btn{margin-left:0!important}}.video-row{gap:5.5rem!important;margin-top:3rem!important}@media (width >= 991px){section.bg-white.text-center.extra-top-padding{position:relative;overflow:hidden}section.bg-white.text-center.extra-top-padding .banner-header{margin-bottom:4rem!important}}.vault-header{text-align:left}@media (width >= 768px) and (width <= 1200px){.container{padding:0 6rem!important}}@media (width <= 768px){.video-row{gap:3rem!important}}@media (width <= 768px){.vault-header{text-align:center!important}.vault-heading{font-size:3rem!important}}@media (width <= 1200px){.container{padding:7rem 3rem 1rem!important}}\n"] }]
1310
1310
  }], ctorParameters: () => [{ type: i2$1.DomSanitizer }, { type: ResourceService }, { type: i3.NgbModal }, { type: i2.TagService }, { type: i2.AuthService }, { type: i5$2.AdminService }, { type: i0.Injector }], propDecorators: { editIntegrationsModal: [{
1311
1311
  type: ViewChild,
1312
1312
  args: ['editIntegrationsModal']