@posiwise/resource-module 0.0.115 → 0.0.117
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/public/components/resource-case-studies/case-studies-cards/case-studies-cards.component.mjs +3 -3
- package/esm2022/lib/public/components/resource-integration/resource-integration.component.mjs +3 -3
- package/fesm2022/posiwise-resource-module.mjs +4 -4
- package/fesm2022/posiwise-resource-module.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -434,11 +434,11 @@ class CaseStudyCardComponent extends AppBaseComponent {
|
|
|
434
434
|
});
|
|
435
435
|
}
|
|
436
436
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CaseStudyCardComponent, deps: [{ token: i0.Injector }, { token: ResourceService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
437
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: CaseStudyCardComponent, selector: "pw-case-studies-card", inputs: { showCaseStudyHeader: "showCaseStudyHeader", categoryId: "categoryId", postSlice: "postSlice", resourceTitle: "resourceTitle" }, usesInheritance: true, ngImport: i0, template: "<section class=\"msp-vault-section bg-white text-center py-5 extra-top-padding section-outer\" id=\"msp-case-studies\">\n <div class=\"container\">\n <div *ngIf=\"showCaseStudyHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading\" id=\"msp-case-studies\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n <a class=\"view-all\" routerLink=\"/resources/case-studies\">VIEW ALL ></a>\n </div>\n <div *ngIf=\"!showCaseStudyHeader\" class=\"d-md-flex justify-content-between align-items-start\">\n <div class=\"vault-header\">\n <h2 class=\"section-heading\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n </div>\n </div>\n\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"posts.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n\n\n <div class=\"row d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"posts.length !== 0 && isLoaded\">\n <div class=\"testimonial-box\" *ngFor=\"let post of posts\">\n
|
|
437
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: CaseStudyCardComponent, selector: "pw-case-studies-card", inputs: { showCaseStudyHeader: "showCaseStudyHeader", categoryId: "categoryId", postSlice: "postSlice", resourceTitle: "resourceTitle" }, usesInheritance: true, ngImport: i0, template: "<section class=\"msp-vault-section bg-white text-center py-5 extra-top-padding section-outer\" id=\"msp-case-studies\">\n <div class=\"container\">\n <div *ngIf=\"showCaseStudyHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading\" id=\"msp-case-studies\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n <a class=\"view-all\" routerLink=\"/resources/case-studies\">VIEW ALL ></a>\n </div>\n <div *ngIf=\"!showCaseStudyHeader\" class=\"d-md-flex justify-content-between align-items-start\">\n <div class=\"vault-header\">\n <h2 class=\"section-heading\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n </div>\n </div>\n\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"posts.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n\n\n <div class=\"row d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"posts.length !== 0 && isLoaded\">\n <div class=\"testimonial-box\" *ngFor=\"let post of posts\">\n\n <div>\n <img *ngIf=\"!post.rectangular_picture.url.includes('default-photo.jpg') \" [src]=\"post.rectangular_picture.url\"\n alt=\"IT Partners Logo\"\n class=\"company-logo mb-3\" />\n\n <p class=\"mb-4 testimonial-section\">\n <span [innerHTML]=\"post.title\"></span>\n </p>\n </div>\n\n <!-- BOTTOM AVATAR -->\n <div class=\"avatar-container mt-5\">\n <img [src]=\"post.picture.url\"\n alt=\"User Avatar\"\n *ngIf=\"post.picture.url && !post.picture.url.includes('default-photo.jpg')\"\n class=\"testimonial-avatar\" />\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"read-more-btn-overlay\"\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=\"read-more-btn-overlay\" 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 </div>\n</section>\n", styles: [".msp-vault-section{background:#fff;text-align:center;padding:3rem 0}.section-outer,.container{padding:0 15px}.d-md-flex{display:flex}.justify-content-between{justify-content:space-between}.align-items-start{align-items:flex-start}.vault-heading{font-size:2rem;font-weight:700}.video-row{margin-top:3rem;gap:5.5rem!important}.row{display:flex;flex-wrap:wrap}.col-md-6,.col-lg-4{flex:0 0 auto;width:100%}@media (width >= 768px){.col-md-6,.col-lg-4{width:50%}}@media (width >= 992px){.col-md-6,.col-lg-4{width:33.3333%}}.mb-4{margin-bottom:1.5rem}.testimonial-box{display:flex;flex-direction:column;justify-content:space-between;background:#fff;color:#000;border-radius:20px;box-shadow:0 0 20px #0000001a;text-align:center;width:338px;height:auto;padding:2.5rem 1.5rem;font-size:1.1rem}.testimonial-box .testimonial-section{font-size:1.5rem;line-height:2rem;font-weight:400;color:var(--text-color, black)}.testimonial-box .testimonial-section strong{display:block}.testimonial-box .company-logo{width:100%!important;height:auto!important;max-width:150px!important;object-fit:contain;align-self:center}.testimonial-box .avatar-container{margin-top:auto;position:relative;display:inline-block}.testimonial-box .avatar-container .testimonial-avatar{width:60%;aspect-ratio:1/1;height:auto;border-radius:50%;object-fit:fill}.testimonial-box .avatar-container .read-more-btn-overlay{position:absolute;text-decoration:none!important;bottom:0;left:50%;transform:translate(-50%);background-color:var(--text-color, black);color:#fff;width:240px;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-items:center;text-align:left;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.testimonial-box .avatar-container .read-more-btn-overlay:hover{background:#fff;color:var(--text-color, black)!important}.testimonial-box .avatar-container .read-more-btn-overlay .arrow{margin-bottom:.3rem}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i5$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i6.LazyImgDirective, selector: "img" }, { kind: "pipe", type: i8.TranslocoPipe, name: "transloco" }] }); }
|
|
438
438
|
}
|
|
439
439
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CaseStudyCardComponent, decorators: [{
|
|
440
440
|
type: Component,
|
|
441
|
-
args: [{ selector: 'pw-case-studies-card', template: "<section class=\"msp-vault-section bg-white text-center py-5 extra-top-padding section-outer\" id=\"msp-case-studies\">\n <div class=\"container\">\n <div *ngIf=\"showCaseStudyHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading\" id=\"msp-case-studies\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n <a class=\"view-all\" routerLink=\"/resources/case-studies\">VIEW ALL ></a>\n </div>\n <div *ngIf=\"!showCaseStudyHeader\" class=\"d-md-flex justify-content-between align-items-start\">\n <div class=\"vault-header\">\n <h2 class=\"section-heading\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n </div>\n </div>\n\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"posts.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n\n\n <div class=\"row d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"posts.length !== 0 && isLoaded\">\n <div class=\"testimonial-box\" *ngFor=\"let post of posts\">\n
|
|
441
|
+
args: [{ selector: 'pw-case-studies-card', template: "<section class=\"msp-vault-section bg-white text-center py-5 extra-top-padding section-outer\" id=\"msp-case-studies\">\n <div class=\"container\">\n <div *ngIf=\"showCaseStudyHeader\" class=\"d-flex justify-content-between align-items-center flex-wrap\">\n <h2 class=\"section-heading\" id=\"msp-case-studies\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n <a class=\"view-all\" routerLink=\"/resources/case-studies\">VIEW ALL ></a>\n </div>\n <div *ngIf=\"!showCaseStudyHeader\" class=\"d-md-flex justify-content-between align-items-start\">\n <div class=\"vault-header\">\n <h2 class=\"section-heading\" [innerHTML]=\"resourceTitle || 'Case Studies'\"></h2>\n </div>\n </div>\n\n <div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div *ngIf=\"posts.length === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Resource.NoDataMessage' | transloco\"/>\n </div>\n\n\n <div class=\"row d-flex flex-wrap justify-content-center gap-4 video-row\" *ngIf=\"posts.length !== 0 && isLoaded\">\n <div class=\"testimonial-box\" *ngFor=\"let post of posts\">\n\n <div>\n <img *ngIf=\"!post.rectangular_picture.url.includes('default-photo.jpg') \" [src]=\"post.rectangular_picture.url\"\n alt=\"IT Partners Logo\"\n class=\"company-logo mb-3\" />\n\n <p class=\"mb-4 testimonial-section\">\n <span [innerHTML]=\"post.title\"></span>\n </p>\n </div>\n\n <!-- BOTTOM AVATAR -->\n <div class=\"avatar-container mt-5\">\n <img [src]=\"post.picture.url\"\n alt=\"User Avatar\"\n *ngIf=\"post.picture.url && !post.picture.url.includes('default-photo.jpg')\"\n class=\"testimonial-avatar\" />\n <a *ngIf=\"post?.external_url; else internalLink\"\n class=\"read-more-btn-overlay\"\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=\"read-more-btn-overlay\" 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 </div>\n</section>\n", styles: [".msp-vault-section{background:#fff;text-align:center;padding:3rem 0}.section-outer,.container{padding:0 15px}.d-md-flex{display:flex}.justify-content-between{justify-content:space-between}.align-items-start{align-items:flex-start}.vault-heading{font-size:2rem;font-weight:700}.video-row{margin-top:3rem;gap:5.5rem!important}.row{display:flex;flex-wrap:wrap}.col-md-6,.col-lg-4{flex:0 0 auto;width:100%}@media (width >= 768px){.col-md-6,.col-lg-4{width:50%}}@media (width >= 992px){.col-md-6,.col-lg-4{width:33.3333%}}.mb-4{margin-bottom:1.5rem}.testimonial-box{display:flex;flex-direction:column;justify-content:space-between;background:#fff;color:#000;border-radius:20px;box-shadow:0 0 20px #0000001a;text-align:center;width:338px;height:auto;padding:2.5rem 1.5rem;font-size:1.1rem}.testimonial-box .testimonial-section{font-size:1.5rem;line-height:2rem;font-weight:400;color:var(--text-color, black)}.testimonial-box .testimonial-section strong{display:block}.testimonial-box .company-logo{width:100%!important;height:auto!important;max-width:150px!important;object-fit:contain;align-self:center}.testimonial-box .avatar-container{margin-top:auto;position:relative;display:inline-block}.testimonial-box .avatar-container .testimonial-avatar{width:60%;aspect-ratio:1/1;height:auto;border-radius:50%;object-fit:fill}.testimonial-box .avatar-container .read-more-btn-overlay{position:absolute;text-decoration:none!important;bottom:0;left:50%;transform:translate(-50%);background-color:var(--text-color, black);color:#fff;width:240px;padding:10px 24px;border-radius:24px;font-size:1.5rem;font-weight:500;cursor:pointer;transition:background .3s ease;display:flex;justify-content:space-between;align-items:center;text-align:left;border:1px solid;box-shadow:none!important;border-color:var(--text-color, black)}.testimonial-box .avatar-container .read-more-btn-overlay:hover{background:#fff;color:var(--text-color, black)!important}.testimonial-box .avatar-container .read-more-btn-overlay .arrow{margin-bottom:.3rem}\n"] }]
|
|
442
442
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: ResourceService }], propDecorators: { showCaseStudyHeader: [{
|
|
443
443
|
type: Input
|
|
444
444
|
}], categoryId: [{
|
|
@@ -786,11 +786,11 @@ class ResourceIntegrationComponent extends AppBaseComponent {
|
|
|
786
786
|
this.videoWebinarLoaded = true;
|
|
787
787
|
}
|
|
788
788
|
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: i2.TagService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
789
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceIntegrationComponent, selector: "pw-resource-integration", 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 [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\" *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 [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 <div class=\"how-it-works-wrapper\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\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\">\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 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\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <h1 class=\"guide-title mb-3\">{{guideData?.title || 'A guide to implementing CloudOlive in your business'}}</h1>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.description || 'View where CloudOlive sits in your internal technology stack and monthly workflows, and see how easy it is to get started.'\">\n </p> <p class=\"guide-note mb-4\">View the quick guide now:</p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <img [src]=\"guideData?.image_url && !guideData?.image_url.includes('default-photo.jpg') ? guideData.image_url : '/assets/img/resource/guide.png'\"\n alt=\"Guide\"\n class=\"guide-img\" />\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\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\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}.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}@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-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!important;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}.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 >= 991px){.section-outer{padding-top:7rem!important}}\n", "::ng-deep .navbar-nav .nav-item .nav-link{color:#fff!important}.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}.msp-vault-section .resource-blog-card iframe{max-width:280px!important;margin-right:0!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:1rem 3rem!important}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$1.Trial4ContactUsComponent, selector: "pw-trial-4-contact-us", inputs: ["subscriptionId", "sourceId", "masterSubscriptionId", "experimentName", "microserviceName"] }, { kind: "component", type: i5$1.ResourceHeaderComponent, selector: "pw-resource-header" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i5$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i6.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"] }, { kind: "component", type: ResourceCompanyCardComponent, selector: "pw-resource-company-card", inputs: ["header", "data", "integrationCountDisplay", "vendor"] }, { kind: "pipe", type: i8.TranslocoPipe, name: "transloco" }] }); }
|
|
789
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourceIntegrationComponent, selector: "pw-resource-integration", 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 [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\" *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 [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 <div class=\"how-it-works-wrapper\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\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\">\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 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\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <h1 class=\"guide-title mb-3\">{{guideData?.title || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'}}</h1>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.description || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'\">\n </p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <ng-container *ngIf=\"guideData?.image_url && !guideData.image_url.includes('default-photo.jpg'); else noDataTemplate\">\n <img\n [src]=\"guideData.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\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\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}.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}@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-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!important;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}.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 >= 991px){.section-outer{padding-top:7rem!important}}\n", "::ng-deep .navbar-nav .nav-item .nav-link{color:#fff!important}.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}.msp-vault-section .resource-blog-card iframe{max-width:280px!important;margin-right:0!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:1rem 3rem!important}}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$1.Trial4ContactUsComponent, selector: "pw-trial-4-contact-us", inputs: ["subscriptionId", "sourceId", "masterSubscriptionId", "experimentName", "microserviceName"] }, { kind: "component", type: i5$1.ResourceHeaderComponent, selector: "pw-resource-header" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i5$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i6.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"] }, { kind: "component", type: ResourceCompanyCardComponent, selector: "pw-resource-company-card", inputs: ["header", "data", "integrationCountDisplay", "vendor"] }, { kind: "pipe", type: i8.TranslocoPipe, name: "transloco" }] }); }
|
|
790
790
|
}
|
|
791
791
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourceIntegrationComponent, decorators: [{
|
|
792
792
|
type: Component,
|
|
793
|
-
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 [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\" *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 [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 <div class=\"how-it-works-wrapper\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\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\">\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 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\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <h1 class=\"guide-title mb-3\">{{guideData?.title || 'A guide to implementing CloudOlive in your business'}}</h1>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.description || 'View where CloudOlive sits in your internal technology stack and monthly workflows, and see how easy it is to get started.'\">\n </p> <p class=\"guide-note mb-4\">View the quick guide now:</p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <img [src]=\"guideData?.image_url && !guideData?.image_url.includes('default-photo.jpg') ? guideData.image_url : '/assets/img/resource/guide.png'\"\n alt=\"Guide\"\n class=\"guide-img\" />\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\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\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}.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}@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-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!important;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}.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 >= 991px){.section-outer{padding-top:7rem!important}}\n", "::ng-deep .navbar-nav .nav-item .nav-link{color:#fff!important}.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}.msp-vault-section .resource-blog-card iframe{max-width:280px!important;margin-right:0!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:1rem 3rem!important}}\n"] }]
|
|
793
|
+
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 [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\" *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 [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 <div class=\"how-it-works-wrapper\">\n <h1 class=\"it-works-title mb-0\">{{integrations?.title || 'How it works'}}</h1>\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\">\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 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\">\n <div class=\"container\">\n <div class=\"row align-items-start\">\n <div class=\"col-md-6 text-md-start text-center\">\n <h1 class=\"guide-title mb-3\">{{guideData?.title || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'}}</h1>\n <p class=\"guide-subtext\"\n [innerHTML]=\"guideData?.description || '--UPDATE ME ON THE ADMIN/DOMAINS MODULE--'\">\n </p>\n <a class=\"vault-btn\"\n [href]=\"guideData?.guide_url\"\n target=\"_blank\"\n rel=\"noopener noreferrer\">\n {{guideData?.button_text || 'View the guide'}}\n </a>\n\n </div>\n\n <div class=\"col-md-6 text-center\">\n <ng-container *ngIf=\"guideData?.image_url && !guideData.image_url.includes('default-photo.jpg'); else noDataTemplate\">\n <img\n [src]=\"guideData.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\" [releaseHeader]=\"true\" [resourceTitle]=\"resourcePostTag?.title\"></pw-resource-note-card>\n\n<pw-trial-4-contact-us></pw-trial-4-contact-us>\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}.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}@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-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!important;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}.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 >= 991px){.section-outer{padding-top:7rem!important}}\n", "::ng-deep .navbar-nav .nav-item .nav-link{color:#fff!important}.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}.msp-vault-section .resource-blog-card iframe{max-width:280px!important;margin-right:0!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:1rem 3rem!important}}\n"] }]
|
|
794
794
|
}], ctorParameters: () => [{ type: i2$1.DomSanitizer }, { type: ResourceService }, { type: i2.TagService }, { type: i0.Injector }] });
|
|
795
795
|
|
|
796
796
|
class ResourceBlog {
|