@jooler/jooler-websites-shared 0.0.131 → 0.0.133
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/esm2020/lib/achievements/achievements.component.mjs +2 -2
- package/esm2020/lib/call-to-action-section/call-to-action-section.component.mjs +2 -2
- package/esm2020/lib/call-to-action-section-two/call-to-action-section-two.component.mjs +2 -2
- package/esm2020/lib/coming-soon/coming-soon.component.mjs +2 -2
- package/esm2020/lib/contact-us-page/contact-us-page.component.mjs +2 -2
- package/esm2020/lib/cta-section-style-four/cta-section-style-four.component.mjs +22 -10
- package/esm2020/lib/faq-category-listing/faq-category-listing.component.mjs +2 -2
- package/esm2020/lib/faq-listing/faq-listing.component.mjs +2 -2
- package/esm2020/lib/get-started-cta/get-started-cta.component.mjs +2 -2
- package/esm2020/lib/image-gallery-modal/image-gallery-modal.component.mjs +3 -3
- package/esm2020/lib/our-client-listing/our-client-listing.component.mjs +2 -2
- package/esm2020/lib/our-clients/our-clients.component.mjs +2 -2
- package/esm2020/lib/page-section-style-ten/page-section-style-ten.component.mjs +2 -2
- package/esm2020/lib/page-section-style-thirteen/page-section-style-thirteen.component.mjs +2 -2
- package/esm2020/lib/page-section-style-three/page-section-style-three.component.mjs +2 -2
- package/esm2020/lib/page-section-with-multiple-cards/page-section-with-multiple-cards.component.mjs +2 -2
- package/esm2020/lib/pricing-plans/pricing-plans.component.mjs +2 -2
- package/esm2020/lib/section-title/section-title.component.mjs +2 -2
- package/esm2020/lib/success-message-dialog/success-message-dialog.component.mjs +2 -2
- package/esm2020/lib/team/team.component.mjs +2 -2
- package/esm2020/lib/value-props-section/value-props-section.component.mjs +2 -2
- package/esm2020/lib/values/values.component.mjs +2 -2
- package/fesm2015/jooler-websites-shared.mjs +69 -58
- package/fesm2015/jooler-websites-shared.mjs.map +1 -1
- package/fesm2020/jooler-websites-shared.mjs +69 -58
- package/fesm2020/jooler-websites-shared.mjs.map +1 -1
- package/lib/cta-section-style-four/cta-section-style-four.component.d.ts +3 -1
- package/package.json +2 -2
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { Component, Input, EventEmitter, Output, HostListener, forwardRef, NgModule } from '@angular/core';
|
|
3
|
-
import * as
|
|
3
|
+
import * as i3 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
|
-
import * as i2
|
|
5
|
+
import * as i2 from '@fortawesome/angular-fontawesome';
|
|
6
6
|
import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
|
|
7
|
-
import * as i3 from '@angular/material/expansion';
|
|
7
|
+
import * as i3$1 from '@angular/material/expansion';
|
|
8
8
|
import { AppMaterialModule } from '@jooler/app-material';
|
|
9
9
|
import { FontAwesomeSharedModule } from '@jooler/font-awesome-shared';
|
|
10
10
|
import * as i1 from '@angular/router';
|
|
11
|
-
import * as i3$
|
|
11
|
+
import * as i3$2 from '@angular/material/button';
|
|
12
12
|
import * as i4 from '@angular/material/tooltip';
|
|
13
13
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
14
14
|
import { trigger, transition, style, animate } from '@angular/animations';
|
|
@@ -19,19 +19,19 @@ import * as i4$2 from 'primeng/api';
|
|
|
19
19
|
import * as i1$2 from '@angular/material/dialog';
|
|
20
20
|
import * as i5 from 'primeng/carousel';
|
|
21
21
|
import { CarouselModule } from 'primeng/carousel';
|
|
22
|
-
import * as i3$
|
|
22
|
+
import * as i3$3 from '@angular/forms';
|
|
23
23
|
import { NG_VALUE_ACCESSOR, FormControl, ReactiveFormsModule, FormsModule } from '@angular/forms';
|
|
24
|
-
import * as i3$
|
|
24
|
+
import * as i3$4 from '@ng-select/ng-select';
|
|
25
25
|
import { NgSelectModule } from '@ng-select/ng-select';
|
|
26
26
|
import * as i1$3 from '@angular/material/icon';
|
|
27
27
|
|
|
28
28
|
class SectionTitleComponent {
|
|
29
29
|
}
|
|
30
30
|
SectionTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SectionTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
31
|
-
SectionTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SectionTitleComponent, selector: "section-title", inputs: { sectionTitle: "sectionTitle" }, ngImport: i0, template: "<div class=\"section-container\" [ngClass]=\"{'align-left':sectionTitle.alignLeft,'align-center':!sectionTitle.alignLeft,'dark-background':sectionTitle.isDarkBg ,'light-background':!sectionTitle.isDarkBg, 'without-divider':sectionTitle.isWithoutDivider}\">\n <div class=\"title-container\">\n <div class=\"title\">{{sectionTitle.title}}</div>\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\n </div>\n </div>\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\n {{sectionTitle.subtitle}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
31
|
+
SectionTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SectionTitleComponent, selector: "section-title", inputs: { sectionTitle: "sectionTitle" }, ngImport: i0, template: "<div class=\"section-container\" [ngClass]=\"{'align-left':sectionTitle.alignLeft,'align-center':!sectionTitle.alignLeft,'dark-background':sectionTitle.isDarkBg ,'light-background':!sectionTitle.isDarkBg, 'without-divider':sectionTitle.isWithoutDivider}\">\n <div class=\"title-container\">\n <div class=\"title\">{{sectionTitle.title}}</div>\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\n </div>\n </div>\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\n {{sectionTitle.subtitle}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section-container{width:100%}.align-center{text-align:center}.align-center .title-container{margin:auto}.align-center .divider{margin:.2rem auto 3.2rem}.align-center .description{margin:auto;width:70%}.title-container{margin:auto;width:-moz-fit-content;width:fit-content}.title{font-weight:bolder;font-size:4.5rem;width:auto;margin:auto;line-height:normal}.divider{height:.4rem;width:auto;border-radius:4rem}.dark-background .divider{background-color:#fff}.dark-background .title,.dark-background .description{color:#fff}.without-divider{display:flex;flex-direction:column;row-gap:3rem}.without-divider .title{font-size:5rem}.without-divider .description{font-size:2rem}@media only screen and (max-width: 37.5em){.without-divider .title{font-size:3rem}.without-divider .description{font-size:1.8rem}}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500;font-size:1.6rem}.align-left .title{margin:0}.align-left .divider{margin:.2rem 0 3.2rem;width:auto}.align-left .description{width:85%;margin:0}.align-left .title-container{margin:0}@media only screen and (max-width: 37.5em){.align-left .title,.align-center .title{font-size:3rem}.align-left .description,.align-center .description{width:85%;font-size:1.8rem}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
32
32
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SectionTitleComponent, decorators: [{
|
|
33
33
|
type: Component,
|
|
34
|
-
args: [{ selector: 'section-title', template: "<div class=\"section-container\" [ngClass]=\"{'align-left':sectionTitle.alignLeft,'align-center':!sectionTitle.alignLeft,'dark-background':sectionTitle.isDarkBg ,'light-background':!sectionTitle.isDarkBg, 'without-divider':sectionTitle.isWithoutDivider}\">\n <div class=\"title-container\">\n <div class=\"title\">{{sectionTitle.title}}</div>\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\n </div>\n </div>\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\n {{sectionTitle.subtitle}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
34
|
+
args: [{ selector: 'section-title', template: "<div class=\"section-container\" [ngClass]=\"{'align-left':sectionTitle.alignLeft,'align-center':!sectionTitle.alignLeft,'dark-background':sectionTitle.isDarkBg ,'light-background':!sectionTitle.isDarkBg, 'without-divider':sectionTitle.isWithoutDivider}\">\n <div class=\"title-container\">\n <div class=\"title\">{{sectionTitle.title}}</div>\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\n </div>\n </div>\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\n {{sectionTitle.subtitle}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section-container{width:100%}.align-center{text-align:center}.align-center .title-container{margin:auto}.align-center .divider{margin:.2rem auto 3.2rem}.align-center .description{margin:auto;width:70%}.title-container{margin:auto;width:-moz-fit-content;width:fit-content}.title{font-weight:bolder;font-size:4.5rem;width:auto;margin:auto;line-height:normal}.divider{height:.4rem;width:auto;border-radius:4rem}.dark-background .divider{background-color:#fff}.dark-background .title,.dark-background .description{color:#fff}.without-divider{display:flex;flex-direction:column;row-gap:3rem}.without-divider .title{font-size:5rem}.without-divider .description{font-size:2rem}@media only screen and (max-width: 37.5em){.without-divider .title{font-size:3rem}.without-divider .description{font-size:1.8rem}}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500;font-size:1.6rem}.align-left .title{margin:0}.align-left .divider{margin:.2rem 0 3.2rem;width:auto}.align-left .description{width:85%;margin:0}.align-left .title-container{margin:0}@media only screen and (max-width: 37.5em){.align-left .title,.align-center .title{font-size:3rem}.align-left .description,.align-center .description{width:85%;font-size:1.8rem}}\n"] }]
|
|
35
35
|
}], propDecorators: { sectionTitle: [{
|
|
36
36
|
type: Input
|
|
37
37
|
}] } });
|
|
@@ -50,10 +50,10 @@ class PageSectionStyleTenComponent {
|
|
|
50
50
|
}
|
|
51
51
|
}
|
|
52
52
|
PageSectionStyleTenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleTenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
53
|
-
PageSectionStyleTenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleTenComponent, selector: "page-section-style-ten", inputs: { data: "data", iconName: "iconName", selectedPanel: "selectedPanel" }, outputs: { panelChanged: "panelChanged" }, ngImport: i0, template: "<mat-accordion class=\"mat-mdc-form-field\">\n <mat-expansion-panel (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\n <mat-expansion-panel-header>\n <div class=\"panel-headline\">\n <mat-panel-title>\n <fa-icon [icon]=\"iconName\">\n </fa-icon>\n {{item.question}}\n </mat-panel-title>\n </div>\n </mat-expansion-panel-header>\n\n <div class=\"panel-content\">\n <ul>\n <li>\n {{item.answer}}\n </li>\n </ul>\n </div>\n </mat-expansion-panel>\n</mat-accordion>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
53
|
+
PageSectionStyleTenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleTenComponent, selector: "page-section-style-ten", inputs: { data: "data", iconName: "iconName", selectedPanel: "selectedPanel" }, outputs: { panelChanged: "panelChanged" }, ngImport: i0, template: "<mat-accordion class=\"mat-mdc-form-field\">\n <mat-expansion-panel (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\n <mat-expansion-panel-header>\n <div class=\"panel-headline\">\n <mat-panel-title>\n <fa-icon [icon]=\"iconName\">\n </fa-icon>\n {{item.question}}\n </mat-panel-title>\n </div>\n </mat-expansion-panel-header>\n\n <div class=\"panel-content\">\n <ul>\n <li>\n {{item.answer}}\n </li>\n </ul>\n </div>\n </mat-expansion-panel>\n</mat-accordion>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}mat-card{height:10rem;width:40rem;margin:4.5rem 4.5rem 4.5rem 25rem}.mat-mdc-form-field{display:grid;row-gap:1rem}.main-container{width:100%;height:90vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;justify-self:stretch;margin:2rem auto;z-index:1;max-width:130rem;padding:0 5rem}mat-expansion-panel{background:#FAFAFA}mat-expansion-panel fa-icon{font-size:.7rem;margin-right:1rem}mat-expansion-panel-header{height:100%;min-height:7rem;font-size:1.7rem;font-weight:600}.mat-expansion-panel-header.mat-expanded{height:auto}@media only screen and (max-width: 37.5em){mat-expansion-panel{margin:0rem 1rem}}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i3$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i3$1.MatExpansionPanelTitle, selector: "mat-panel-title" }] });
|
|
54
54
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleTenComponent, decorators: [{
|
|
55
55
|
type: Component,
|
|
56
|
-
args: [{ selector: 'page-section-style-ten', template: "<mat-accordion class=\"mat-mdc-form-field\">\n <mat-expansion-panel (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\n <mat-expansion-panel-header>\n <div class=\"panel-headline\">\n <mat-panel-title>\n <fa-icon [icon]=\"iconName\">\n </fa-icon>\n {{item.question}}\n </mat-panel-title>\n </div>\n </mat-expansion-panel-header>\n\n <div class=\"panel-content\">\n <ul>\n <li>\n {{item.answer}}\n </li>\n </ul>\n </div>\n </mat-expansion-panel>\n</mat-accordion>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
56
|
+
args: [{ selector: 'page-section-style-ten', template: "<mat-accordion class=\"mat-mdc-form-field\">\n <mat-expansion-panel (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\n <mat-expansion-panel-header>\n <div class=\"panel-headline\">\n <mat-panel-title>\n <fa-icon [icon]=\"iconName\">\n </fa-icon>\n {{item.question}}\n </mat-panel-title>\n </div>\n </mat-expansion-panel-header>\n\n <div class=\"panel-content\">\n <ul>\n <li>\n {{item.answer}}\n </li>\n </ul>\n </div>\n </mat-expansion-panel>\n</mat-accordion>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}mat-card{height:10rem;width:40rem;margin:4.5rem 4.5rem 4.5rem 25rem}.mat-mdc-form-field{display:grid;row-gap:1rem}.main-container{width:100%;height:90vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;justify-self:stretch;margin:2rem auto;z-index:1;max-width:130rem;padding:0 5rem}mat-expansion-panel{background:#FAFAFA}mat-expansion-panel fa-icon{font-size:.7rem;margin-right:1rem}mat-expansion-panel-header{height:100%;min-height:7rem;font-size:1.7rem;font-weight:600}.mat-expansion-panel-header.mat-expanded{height:auto}@media only screen and (max-width: 37.5em){mat-expansion-panel{margin:0rem 1rem}}\n"] }]
|
|
57
57
|
}], ctorParameters: function () { return []; }, propDecorators: { data: [{
|
|
58
58
|
type: Input
|
|
59
59
|
}], iconName: [{
|
|
@@ -74,10 +74,10 @@ class GetStartedCTAComponent {
|
|
|
74
74
|
}
|
|
75
75
|
}
|
|
76
76
|
GetStartedCTAComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetStartedCTAComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
77
|
-
GetStartedCTAComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: GetStartedCTAComponent, selector: "get-started-cta", inputs: { ctaCardData: "ctaCardData" }, ngImport: i0, template: "<div class=\"all\">\n <div class=\"get-started\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\n <path\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\n fill=\"#155ED4\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\n <path\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg-3\">\n <path\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\n <path\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\n <path\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\n </svg>\n\n\n <div class=\"content\">\n <h1>{{ctaCardData.title}}</h1>\n <div class=\"description\">\n {{ctaCardData.description}}\n </div>\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\n <div class=\"create-account\">\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\n <button mat-raised-button class=\"sign-up-btn\"\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
77
|
+
GetStartedCTAComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: GetStartedCTAComponent, selector: "get-started-cta", inputs: { ctaCardData: "ctaCardData" }, ngImport: i0, template: "<div class=\"all\">\n <div class=\"get-started\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\n <path\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\n fill=\"#155ED4\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\n <path\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg-3\">\n <path\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\n <path\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\n <path\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\n </svg>\n\n\n <div class=\"content\">\n <h1>{{ctaCardData.title}}</h1>\n <div class=\"description\">\n {{ctaCardData.description}}\n </div>\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\n <div class=\"create-account\">\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\n <button mat-raised-button class=\"sign-up-btn\"\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .logo-img{cursor:pointer;margin:2vh 0 5vh;width:20rem;margin:auto}.get-started .create-account{display:flex;justify-content:center;align-items:center;height:3.4rem;width:50%;margin:auto;column-gap:2%}.get-started .sign-up-btn{background-color:#155ed4;color:#fff;height:100%;width:40%;max-width:70%;font-family:inherit}.get-started .email-input{width:60%;height:100%;max-width:80%}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}.get-started .sign-up-btn{height:4rem;width:20rem}.get-started .email-input{width:29rem;height:3.5rem}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"], dependencies: [{ kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
|
|
78
78
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetStartedCTAComponent, decorators: [{
|
|
79
79
|
type: Component,
|
|
80
|
-
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\n <div class=\"get-started\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\n <path\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\n fill=\"#155ED4\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\n <path\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg-3\">\n <path\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\n <path\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\n <path\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\n </svg>\n\n\n <div class=\"content\">\n <h1>{{ctaCardData.title}}</h1>\n <div class=\"description\">\n {{ctaCardData.description}}\n </div>\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\n <div class=\"create-account\">\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\n <button mat-raised-button class=\"sign-up-btn\"\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
80
|
+
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\n <div class=\"get-started\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\n <path\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\n fill=\"#155ED4\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\n <path\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg-3\">\n <path\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\n <path\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\n </svg>\n\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\n <path\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\n </svg>\n\n\n <div class=\"content\">\n <h1>{{ctaCardData.title}}</h1>\n <div class=\"description\">\n {{ctaCardData.description}}\n </div>\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\n <div class=\"create-account\">\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\n <button mat-raised-button class=\"sign-up-btn\"\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .logo-img{cursor:pointer;margin:2vh 0 5vh;width:20rem;margin:auto}.get-started .create-account{display:flex;justify-content:center;align-items:center;height:3.4rem;width:50%;margin:auto;column-gap:2%}.get-started .sign-up-btn{background-color:#155ed4;color:#fff;height:100%;width:40%;max-width:70%;font-family:inherit}.get-started .email-input{width:60%;height:100%;max-width:80%}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}.get-started .sign-up-btn{height:4rem;width:20rem}.get-started .email-input{width:29rem;height:3.5rem}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"] }]
|
|
81
81
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { ctaCardData: [{
|
|
82
82
|
type: Input
|
|
83
83
|
}] } });
|
|
@@ -87,10 +87,10 @@ class AchievementsComponent {
|
|
|
87
87
|
ngOnInit() { }
|
|
88
88
|
}
|
|
89
89
|
AchievementsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AchievementsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
90
|
-
AchievementsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AchievementsComponent, selector: "achievements", inputs: { achievements: "achievements" }, ngImport: i0, template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': achievements.sectionTitle.isDarkBg}\">\n <div class=\"content\">\n <div>\n <section-title [sectionTitle]=\"achievements.sectionTitle\"></section-title>\n </div>\n <div class=\"achievements-cards\">\n <div class=\"achievement-card\" *ngFor=\"let achievement of achievements.achievements\">\n <div class=\"number\">\n {{achievement.number}}\n </div>\n <div class=\"subtitle\">\n {{achievement.subtitle}}\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
90
|
+
AchievementsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AchievementsComponent, selector: "achievements", inputs: { achievements: "achievements" }, ngImport: i0, template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': achievements.sectionTitle.isDarkBg}\">\n <div class=\"content\">\n <div>\n <section-title [sectionTitle]=\"achievements.sectionTitle\"></section-title>\n </div>\n <div class=\"achievements-cards\">\n <div class=\"achievement-card\" *ngFor=\"let achievement of achievements.achievements\">\n <div class=\"number\">\n {{achievement.number}}\n </div>\n <div class=\"subtitle\">\n {{achievement.subtitle}}\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.achievements{display:grid;row-gap:2rem;margin:auto;width:100%}.achievements .content{margin:auto;width:90%}@media only screen and (min-width: 1500px){.achievements .content{width:150rem}}.achievements .achievements-cards{display:flex;flex-wrap:wrap;justify-content:center;width:100%;margin:2rem 0rem;row-gap:4rem;column-gap:1rem}.achievements .achievements-cards .achievement-card{display:grid;grid-template-rows:6rem auto;margin:auto;padding:1rem;width:30rem;min-width:23%;height:12rem;border-radius:1.5rem;box-shadow:.2rem .2rem .4rem #00000040;row-gap:.4rem}@media screen and (max-width: 800px){.achievements .achievements-cards .achievement-card{width:33%}}@media only screen and (max-width: 37.5em){.achievements .achievements-cards .achievement-card{width:50%}}.achievements .achievements-cards .achievement-card .number{text-align:center;color:#fff;font-weight:700;font-size:2.8rem;display:grid;align-content:end}.achievements .achievements-cards .achievement-card .subtitle{color:#fff;text-align:center;font-weight:500;font-size:1.8rem}.blue-background{background:linear-gradient(90deg,#155ED4 3.16%,#0F2844 97.43%);padding:2rem 0rem;color:#fff}.blue-background .achievements-cards{width:100%}.blue-background .achievements-cards .achievement-card{background-color:#fff}.blue-background .achievements-cards .achievement-card .number{color:#155ed4}.blue-background .achievements-cards .achievement-card .subtitle{color:#32353b;font-weight:550}@media only screen and (max-width: 75em){.achievements .achievements-cards{width:100%;display:flex;flex-wrap:wrap;justify-content:center;margin:2rem auto}.achievements .achievements-cards .achievement-card{grid-template-rows:auto auto;width:20rem;height:16rem}.achievements .achievements-cards .achievement-card .subtitle{font-size:1.8rem}}@media only screen and (max-width: 37.5em){.achievements .achievements-cards .achievement-card{height:10rem}.achievements .achievements-cards .achievement-card .number{font-size:2rem}.achievements .achievements-cards .achievement-card .subtitle{font-size:1.4rem}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
91
91
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AchievementsComponent, decorators: [{
|
|
92
92
|
type: Component,
|
|
93
|
-
args: [{ selector: 'achievements', template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': achievements.sectionTitle.isDarkBg}\">\n <div class=\"content\">\n <div>\n <section-title [sectionTitle]=\"achievements.sectionTitle\"></section-title>\n </div>\n <div class=\"achievements-cards\">\n <div class=\"achievement-card\" *ngFor=\"let achievement of achievements.achievements\">\n <div class=\"number\">\n {{achievement.number}}\n </div>\n <div class=\"subtitle\">\n {{achievement.subtitle}}\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
93
|
+
args: [{ selector: 'achievements', template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': achievements.sectionTitle.isDarkBg}\">\n <div class=\"content\">\n <div>\n <section-title [sectionTitle]=\"achievements.sectionTitle\"></section-title>\n </div>\n <div class=\"achievements-cards\">\n <div class=\"achievement-card\" *ngFor=\"let achievement of achievements.achievements\">\n <div class=\"number\">\n {{achievement.number}}\n </div>\n <div class=\"subtitle\">\n {{achievement.subtitle}}\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.achievements{display:grid;row-gap:2rem;margin:auto;width:100%}.achievements .content{margin:auto;width:90%}@media only screen and (min-width: 1500px){.achievements .content{width:150rem}}.achievements .achievements-cards{display:flex;flex-wrap:wrap;justify-content:center;width:100%;margin:2rem 0rem;row-gap:4rem;column-gap:1rem}.achievements .achievements-cards .achievement-card{display:grid;grid-template-rows:6rem auto;margin:auto;padding:1rem;width:30rem;min-width:23%;height:12rem;border-radius:1.5rem;box-shadow:.2rem .2rem .4rem #00000040;row-gap:.4rem}@media screen and (max-width: 800px){.achievements .achievements-cards .achievement-card{width:33%}}@media only screen and (max-width: 37.5em){.achievements .achievements-cards .achievement-card{width:50%}}.achievements .achievements-cards .achievement-card .number{text-align:center;color:#fff;font-weight:700;font-size:2.8rem;display:grid;align-content:end}.achievements .achievements-cards .achievement-card .subtitle{color:#fff;text-align:center;font-weight:500;font-size:1.8rem}.blue-background{background:linear-gradient(90deg,#155ED4 3.16%,#0F2844 97.43%);padding:2rem 0rem;color:#fff}.blue-background .achievements-cards{width:100%}.blue-background .achievements-cards .achievement-card{background-color:#fff}.blue-background .achievements-cards .achievement-card .number{color:#155ed4}.blue-background .achievements-cards .achievement-card .subtitle{color:#32353b;font-weight:550}@media only screen and (max-width: 75em){.achievements .achievements-cards{width:100%;display:flex;flex-wrap:wrap;justify-content:center;margin:2rem auto}.achievements .achievements-cards .achievement-card{grid-template-rows:auto auto;width:20rem;height:16rem}.achievements .achievements-cards .achievement-card .subtitle{font-size:1.8rem}}@media only screen and (max-width: 37.5em){.achievements .achievements-cards .achievement-card{height:10rem}.achievements .achievements-cards .achievement-card .number{font-size:2rem}.achievements .achievements-cards .achievement-card .subtitle{font-size:1.4rem}}\n"] }]
|
|
94
94
|
}], ctorParameters: function () { return []; }, propDecorators: { achievements: [{
|
|
95
95
|
type: Input
|
|
96
96
|
}] } });
|
|
@@ -104,10 +104,10 @@ class PricingPlansComponent {
|
|
|
104
104
|
}
|
|
105
105
|
}
|
|
106
106
|
PricingPlansComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PricingPlansComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
107
|
-
PricingPlansComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PricingPlansComponent, selector: "pricing-plans", inputs: { servicePlan: "servicePlan" }, ngImport: i0, template: " <div class=\"plan-content\" >\n <div class=\"title-price-desc\">\n <h1 class=\"plan-title\">\n {{servicePlan.name}}\n </h1>\n <div class=\"price\" *ngIf=\"servicePlan.price\">\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\n <span>/{{servicePlan.frequency}}</span>\n </div>\n <div class=\"description\">\n {{servicePlan.description}}\n </div>\n <div class=\"divider\"></div>\n </div>\n <div class=\"perks\">\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\n <span class=\"check-icon\">\n <fa-icon icon=\"check\"></fa-icon>\n </span>\n <div class=\"service-description\">\n <div class=\"service-perk\">\n {{perk.perk}}\n </div>\n <span class=\"exclamation-mark\">\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\"\n icon=\"circle-exclamation\"></fa-icon>\n </span>\n </div>\n </div>\n </div>\n <div class=\"registration-button\">\n <button mat-raised-button class=\"button\">\n Choose Plan\n </button>\n </div>\n </div>\n", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
107
|
+
PricingPlansComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PricingPlansComponent, selector: "pricing-plans", inputs: { servicePlan: "servicePlan" }, ngImport: i0, template: " <div class=\"plan-content\" >\n <div class=\"title-price-desc\">\n <h1 class=\"plan-title\">\n {{servicePlan.name}}\n </h1>\n <div class=\"price\" *ngIf=\"servicePlan.price\">\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\n <span>/{{servicePlan.frequency}}</span>\n </div>\n <div class=\"description\">\n {{servicePlan.description}}\n </div>\n <div class=\"divider\"></div>\n </div>\n <div class=\"perks\">\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\n <span class=\"check-icon\">\n <fa-icon icon=\"check\"></fa-icon>\n </span>\n <div class=\"service-description\">\n <div class=\"service-perk\">\n {{perk.perk}}\n </div>\n <span class=\"exclamation-mark\">\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\"\n icon=\"circle-exclamation\"></fa-icon>\n </span>\n </div>\n </div>\n </div>\n <div class=\"registration-button\">\n <button mat-raised-button class=\"button\">\n Choose Plan\n </button>\n </div>\n </div>\n", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.service-suggestion{display:flex;justify-content:center;align-items:top;font-weight:650;font-size:2.4rem;height:2rem;color:#32353b;margin-bottom:2.5rem}.plan-content{display:flex;flex-direction:column;width:20%;background:#FFFFFF;border-radius:1rem;padding:3rem 2rem;min-width:33rem;row-gap:.5rem;transition:all .2s ease-in-out;box-shadow:#0000001f 0 .1rem .3rem,#0000003d 0 .1rem .2rem;height:100%;margin:auto}@media only screen and (max-width: 552px){.plan-content{min-width:60%}}@media only screen and (max-width: 75em){.plan-content{width:33rem}}@media only screen and (max-width: 620px){.plan-content{width:90%;height:99%}}.plan-content .title-price-desc{height:22rem}.plan-content .title-price-desc .divider{width:90%;border:.1rem solid #155ED4;margin:1rem auto}.plan-content .plan-title{grid-row:1;color:#155ed4;text-transform:uppercase;font-weight:700;font-size:2.5rem;padding:1rem 0rem;text-align:center}.plan-content .description{color:#32353b;font-size:1.2rem;padding:1rem 0rem;text-align:center;height:8rem}.plan-content .perks{display:flex;row-gap:.5rem;height:100%;align-items:flex-start;flex-direction:column}.plan-content .perks .perk{display:flex;align-items:center;width:100%}.plan-content .perks .perk .service-description{align-items:center;font-weight:600;font-size:1.3rem;margin-left:1rem;color:#36393fe8;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:row;justify-content:space-between;width:100%}.plan-content .perks .perk .service-description .exclamation-mark{cursor:pointer;color:#32353b}.plan-content .service-price{font-weight:800;font-size:4.2rem;text-align:center}.plan-content .registration-button{display:flex;padding:1rem 0rem;height:100%}.plan-content .registration-button .button{align-self:flex-end;font-weight:600;width:85%;background-color:#155ed4;color:#fff;width:100%}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { 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: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
|
|
108
108
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PricingPlansComponent, decorators: [{
|
|
109
109
|
type: Component,
|
|
110
|
-
args: [{ selector: 'pricing-plans', template: " <div class=\"plan-content\" >\n <div class=\"title-price-desc\">\n <h1 class=\"plan-title\">\n {{servicePlan.name}}\n </h1>\n <div class=\"price\" *ngIf=\"servicePlan.price\">\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\n <span>/{{servicePlan.frequency}}</span>\n </div>\n <div class=\"description\">\n {{servicePlan.description}}\n </div>\n <div class=\"divider\"></div>\n </div>\n <div class=\"perks\">\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\n <span class=\"check-icon\">\n <fa-icon icon=\"check\"></fa-icon>\n </span>\n <div class=\"service-description\">\n <div class=\"service-perk\">\n {{perk.perk}}\n </div>\n <span class=\"exclamation-mark\">\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\"\n icon=\"circle-exclamation\"></fa-icon>\n </span>\n </div>\n </div>\n </div>\n <div class=\"registration-button\">\n <button mat-raised-button class=\"button\">\n Choose Plan\n </button>\n </div>\n </div>\n", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
110
|
+
args: [{ selector: 'pricing-plans', template: " <div class=\"plan-content\" >\n <div class=\"title-price-desc\">\n <h1 class=\"plan-title\">\n {{servicePlan.name}}\n </h1>\n <div class=\"price\" *ngIf=\"servicePlan.price\">\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\n <span>/{{servicePlan.frequency}}</span>\n </div>\n <div class=\"description\">\n {{servicePlan.description}}\n </div>\n <div class=\"divider\"></div>\n </div>\n <div class=\"perks\">\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\n <span class=\"check-icon\">\n <fa-icon icon=\"check\"></fa-icon>\n </span>\n <div class=\"service-description\">\n <div class=\"service-perk\">\n {{perk.perk}}\n </div>\n <span class=\"exclamation-mark\">\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\"\n icon=\"circle-exclamation\"></fa-icon>\n </span>\n </div>\n </div>\n </div>\n <div class=\"registration-button\">\n <button mat-raised-button class=\"button\">\n Choose Plan\n </button>\n </div>\n </div>\n", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.service-suggestion{display:flex;justify-content:center;align-items:top;font-weight:650;font-size:2.4rem;height:2rem;color:#32353b;margin-bottom:2.5rem}.plan-content{display:flex;flex-direction:column;width:20%;background:#FFFFFF;border-radius:1rem;padding:3rem 2rem;min-width:33rem;row-gap:.5rem;transition:all .2s ease-in-out;box-shadow:#0000001f 0 .1rem .3rem,#0000003d 0 .1rem .2rem;height:100%;margin:auto}@media only screen and (max-width: 552px){.plan-content{min-width:60%}}@media only screen and (max-width: 75em){.plan-content{width:33rem}}@media only screen and (max-width: 620px){.plan-content{width:90%;height:99%}}.plan-content .title-price-desc{height:22rem}.plan-content .title-price-desc .divider{width:90%;border:.1rem solid #155ED4;margin:1rem auto}.plan-content .plan-title{grid-row:1;color:#155ed4;text-transform:uppercase;font-weight:700;font-size:2.5rem;padding:1rem 0rem;text-align:center}.plan-content .description{color:#32353b;font-size:1.2rem;padding:1rem 0rem;text-align:center;height:8rem}.plan-content .perks{display:flex;row-gap:.5rem;height:100%;align-items:flex-start;flex-direction:column}.plan-content .perks .perk{display:flex;align-items:center;width:100%}.plan-content .perks .perk .service-description{align-items:center;font-weight:600;font-size:1.3rem;margin-left:1rem;color:#36393fe8;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:row;justify-content:space-between;width:100%}.plan-content .perks .perk .service-description .exclamation-mark{cursor:pointer;color:#32353b}.plan-content .service-price{font-weight:800;font-size:4.2rem;text-align:center}.plan-content .registration-button{display:flex;padding:1rem 0rem;height:100%}.plan-content .registration-button .button{align-self:flex-end;font-weight:600;width:85%;background-color:#155ed4;color:#fff;width:100%}\n"] }]
|
|
111
111
|
}], ctorParameters: function () { return []; }, propDecorators: { servicePlan: [{
|
|
112
112
|
type: Input
|
|
113
113
|
}] } });
|
|
@@ -185,7 +185,7 @@ class ImageGalleryModal {
|
|
|
185
185
|
}
|
|
186
186
|
}
|
|
187
187
|
ImageGalleryModal.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ImageGalleryModal, deps: [{ token: i1$1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
188
|
-
ImageGalleryModal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ImageGalleryModal, selector: "image-gallery-modal", inputs: { galleryData: "galleryData", showCount: "showCount" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: "<div class=\"gallery-image-gallery-modal-container\">\n <div class=\"gallery\">\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.imageSrc\" [alt]=\"image.imageAlt\">\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\n </div>\n </div>\n </div>\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\n <div *ngIf=\"showCount\" class=\"count\">\n {{currentIndex + 1}}/{{totalImageCount}}\n </div>\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\n <fa-icon icon=\"times\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\n </button>\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\"\n class=\"image-gallery-modal-img\">\n <img [src]=\"currentImageGalleryModal.imageSrc\" [alt]=\"currentImageGalleryModal.imageAlt\">\n </div>\n </div>\n</div>\n<p-galleria class=\"gallery-custom\" [value]=\"galleryData\" [responsiveOptions]=\"responsiveOptions\"\n [containerStyle]=\"{ 'max-width': '900px' }\" [numVisible]=\"6\">\n <ng-template pTemplate=\"item\" let-item>\n <div class=\"img\">\n <img class=\"big-img\" [src]=\"item.imageSrc\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"thumbnail\" let-item>\n <div class=\"grid grid-nogutter justify-content-center\">\n <img [src]=\"item.imageSrc\" style=\"width: 10rem; height:12rem\" class=\"small-img\" />\n </div>\n </ng-template>\n</p-galleria>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
188
|
+
ImageGalleryModal.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ImageGalleryModal, selector: "image-gallery-modal", inputs: { galleryData: "galleryData", showCount: "showCount" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: "<div class=\"gallery-image-gallery-modal-container\">\n <div class=\"gallery\">\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.imageSrc\" [alt]=\"image.imageAlt\">\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\n </div>\n </div>\n </div>\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\n <div *ngIf=\"showCount\" class=\"count\">\n {{currentIndex + 1}}/{{totalImageCount}}\n </div>\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\n <fa-icon icon=\"times\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\n </button>\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\"\n class=\"image-gallery-modal-img\">\n <img [src]=\"currentImageGalleryModal.imageSrc\" [alt]=\"currentImageGalleryModal.imageAlt\">\n </div>\n </div>\n</div>\n<p-galleria class=\"gallery-custom\" [value]=\"galleryData\" [responsiveOptions]=\"responsiveOptions\"\n [containerStyle]=\"{ 'max-width': '900px' }\" [numVisible]=\"6\">\n <ng-template pTemplate=\"item\" let-item>\n <div class=\"img\">\n <img class=\"big-img\" [src]=\"item.imageSrc\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"thumbnail\" let-item>\n <div class=\"grid grid-nogutter justify-content-center\">\n <img [src]=\"item.imageSrc\" style=\"width: 10rem; height:12rem\" class=\"small-img\" />\n </div>\n </ng-template>\n</p-galleria>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.gallery-custom{display:none}.gallery-image-gallery-modal-container{position:relative;display:block;padding:2.5rem;width:90%;margin:auto}@media only screen and (min-width: 1500px){.gallery-image-gallery-modal-container{max-width:150rem}}.gallery-image-gallery-modal-container .gallery{line-height:0;column-count:4;column-gap:.8rem}.gallery-image-gallery-modal-container .gallery .gallery-image{overflow:hidden;transition:all .3s;position:relative;margin-bottom:1rem;box-shadow:#00000026 0 1.5rem 2.5rem,#0000000d 0 .5rem 1rem}.gallery-image-gallery-modal-container .gallery .gallery-image:hover img{filter:brightness(.5)}.gallery-image-gallery-modal-container .gallery .gallery-image:hover .image-cta{opacity:1}.gallery-image-gallery-modal-container .gallery .gallery-image img{width:100%;height:auto;cursor:zoom-in;border-radius:.35rem}.gallery-image-gallery-modal-container .gallery .gallery-image .image-cta{opacity:0;position:absolute;width:100%;top:50%;text-align:center;color:#fff;font-size:2rem;cursor:zoom-in;transition:opacity .3s}.gallery-image-gallery-modal-container .gallery .gallery-image .image-cta fa-icon{font-size:2rem;margin-left:1rem;color:#fff}.gallery-image-gallery-modal-container .image-gallery-modal{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;width:100%;background-color:#000000d9;z-index:101;height:100%;overflow-y:auto}.gallery-image-gallery-modal-container .count{position:absolute;top:0;left:0;width:7%;height:10%;color:#fff;opacity:.7;font-size:1.8rem;display:flex;justify-content:center;align-items:center;margin-left:.5rem}.gallery-image-gallery-modal-container .close-btn{position:absolute;top:0;right:0;padding:0;color:#fff;background:0 0;border:0;cursor:pointer;width:7%;height:10%;z-index:10}.gallery-image-gallery-modal-container .close-btn fa-icon{font-size:2.5rem}.gallery-image-gallery-modal-container .btn-image-gallery-modal-carousel{display:flex;justify-content:center;align-items:center;position:absolute;z-index:1;width:8%;height:8%;padding:0;color:#fff;text-align:center;background:0 0;border:0;cursor:pointer}.gallery-image-gallery-modal-container .btn-prev{left:0}.gallery-image-gallery-modal-container .btn-next{right:0}.gallery-image-gallery-modal-container .icon-image-gallery-modal-carousel{color:#fff;opacity:.5;transition:all .15s ease}.gallery-image-gallery-modal-container .icon-image-gallery-modal-carousel:hover{opacity:.9}.gallery-image-gallery-modal-container .icon-image-gallery-modal-carousel:active{opacity:.5}.gallery-image-gallery-modal-container .icon-prev,.gallery-image-gallery-modal-container .icon-next{font-size:3rem}.gallery-image-gallery-modal-container .image-gallery-modal-img img{width:100%;max-height:90vh;border-radius:1rem}.gallery-image-gallery-modal-container .hide-overflow{overflow:hidden}@media only screen and (max-width: 75em){.gallery-image-gallery-modal-container .gallery-custom{display:normal}.gallery-image-gallery-modal-container .gallery-image-gallery-modal-container{display:none}.gallery-image-gallery-modal-container .gallery{column-count:3;width:100%}.gallery-image-gallery-modal-container .gallery-img img{width:100%}}@media only screen and (max-width: 56.25em){.gallery-image-gallery-modal-container .gallery{column-count:2}.gallery-image-gallery-modal-container .gallery-img img{max-width:100%}}@media only screen and (max-width: 37.5em){.gallery-image-gallery-modal-container .gallery{column-count:1}.gallery-image-gallery-modal-container .gallery-img img{width:100%}}.small-img{width:10rem;height:12rem}@media only screen and (max-width: 56.25em){.gallery-custom{display:block;margin:auto;width:90%}.gallery-custom .img{width:90%}.gallery-custom .big-img{width:100%;height:50rem;object-fit:cover;border-radius:1.5rem;box-shadow:2rem 1rem 1.5rem -.5rem #e0e0e075;margin-bottom:2rem}.gallery-custom .small-img{object-fit:cover;border-radius:.7rem;box-shadow:1rem .4rem .5rem -.5rem #e0e0e075}.gallery-image-gallery-modal-container{display:none}}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.Galleria, selector: "p-galleria", inputs: ["activeIndex", "fullScreen", "id", "value", "numVisible", "responsiveOptions", "showItemNavigators", "showThumbnailNavigators", "showItemNavigatorsOnHover", "changeItemOnIndicatorHover", "circular", "autoPlay", "transitionInterval", "showThumbnails", "thumbnailsPosition", "verticalThumbnailViewPortHeight", "showIndicators", "showIndicatorsOnItem", "indicatorsPosition", "baseZIndex", "maskClass", "containerClass", "containerStyle", "showTransitionOptions", "hideTransitionOptions", "visible"], outputs: ["activeIndexChange", "visibleChange"] }, { kind: "directive", type: i4$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }], animations: [
|
|
189
189
|
trigger('animation', [
|
|
190
190
|
transition('void => visible', [
|
|
191
191
|
style({ transform: 'scale(0.5)' }),
|
|
@@ -222,7 +222,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
222
222
|
animate('50ms', style({ opacity: 0.8 }))
|
|
223
223
|
])
|
|
224
224
|
])
|
|
225
|
-
], template: "<div class=\"gallery-image-gallery-modal-container\">\n <div class=\"gallery\">\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.imageSrc\" [alt]=\"image.imageAlt\">\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\n </div>\n </div>\n </div>\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\n <div *ngIf=\"showCount\" class=\"count\">\n {{currentIndex + 1}}/{{totalImageCount}}\n </div>\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\n <fa-icon icon=\"times\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\n </button>\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\"\n class=\"image-gallery-modal-img\">\n <img [src]=\"currentImageGalleryModal.imageSrc\" [alt]=\"currentImageGalleryModal.imageAlt\">\n </div>\n </div>\n</div>\n<p-galleria class=\"gallery-custom\" [value]=\"galleryData\" [responsiveOptions]=\"responsiveOptions\"\n [containerStyle]=\"{ 'max-width': '900px' }\" [numVisible]=\"6\">\n <ng-template pTemplate=\"item\" let-item>\n <div class=\"img\">\n <img class=\"big-img\" [src]=\"item.imageSrc\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"thumbnail\" let-item>\n <div class=\"grid grid-nogutter justify-content-center\">\n <img [src]=\"item.imageSrc\" style=\"width: 10rem; height:12rem\" class=\"small-img\" />\n </div>\n </ng-template>\n</p-galleria>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
225
|
+
], template: "<div class=\"gallery-image-gallery-modal-container\">\n <div class=\"gallery\">\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.imageSrc\" [alt]=\"image.imageAlt\">\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\n </div>\n </div>\n </div>\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\n <div *ngIf=\"showCount\" class=\"count\">\n {{currentIndex + 1}}/{{totalImageCount}}\n </div>\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\n <fa-icon icon=\"times\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\n </button>\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\n </button>\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\"\n class=\"image-gallery-modal-img\">\n <img [src]=\"currentImageGalleryModal.imageSrc\" [alt]=\"currentImageGalleryModal.imageAlt\">\n </div>\n </div>\n</div>\n<p-galleria class=\"gallery-custom\" [value]=\"galleryData\" [responsiveOptions]=\"responsiveOptions\"\n [containerStyle]=\"{ 'max-width': '900px' }\" [numVisible]=\"6\">\n <ng-template pTemplate=\"item\" let-item>\n <div class=\"img\">\n <img class=\"big-img\" [src]=\"item.imageSrc\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"thumbnail\" let-item>\n <div class=\"grid grid-nogutter justify-content-center\">\n <img [src]=\"item.imageSrc\" style=\"width: 10rem; height:12rem\" class=\"small-img\" />\n </div>\n </ng-template>\n</p-galleria>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.gallery-custom{display:none}.gallery-image-gallery-modal-container{position:relative;display:block;padding:2.5rem;width:90%;margin:auto}@media only screen and (min-width: 1500px){.gallery-image-gallery-modal-container{max-width:150rem}}.gallery-image-gallery-modal-container .gallery{line-height:0;column-count:4;column-gap:.8rem}.gallery-image-gallery-modal-container .gallery .gallery-image{overflow:hidden;transition:all .3s;position:relative;margin-bottom:1rem;box-shadow:#00000026 0 1.5rem 2.5rem,#0000000d 0 .5rem 1rem}.gallery-image-gallery-modal-container .gallery .gallery-image:hover img{filter:brightness(.5)}.gallery-image-gallery-modal-container .gallery .gallery-image:hover .image-cta{opacity:1}.gallery-image-gallery-modal-container .gallery .gallery-image img{width:100%;height:auto;cursor:zoom-in;border-radius:.35rem}.gallery-image-gallery-modal-container .gallery .gallery-image .image-cta{opacity:0;position:absolute;width:100%;top:50%;text-align:center;color:#fff;font-size:2rem;cursor:zoom-in;transition:opacity .3s}.gallery-image-gallery-modal-container .gallery .gallery-image .image-cta fa-icon{font-size:2rem;margin-left:1rem;color:#fff}.gallery-image-gallery-modal-container .image-gallery-modal{display:flex;align-items:center;justify-content:center;position:fixed;top:0;left:0;width:100%;background-color:#000000d9;z-index:101;height:100%;overflow-y:auto}.gallery-image-gallery-modal-container .count{position:absolute;top:0;left:0;width:7%;height:10%;color:#fff;opacity:.7;font-size:1.8rem;display:flex;justify-content:center;align-items:center;margin-left:.5rem}.gallery-image-gallery-modal-container .close-btn{position:absolute;top:0;right:0;padding:0;color:#fff;background:0 0;border:0;cursor:pointer;width:7%;height:10%;z-index:10}.gallery-image-gallery-modal-container .close-btn fa-icon{font-size:2.5rem}.gallery-image-gallery-modal-container .btn-image-gallery-modal-carousel{display:flex;justify-content:center;align-items:center;position:absolute;z-index:1;width:8%;height:8%;padding:0;color:#fff;text-align:center;background:0 0;border:0;cursor:pointer}.gallery-image-gallery-modal-container .btn-prev{left:0}.gallery-image-gallery-modal-container .btn-next{right:0}.gallery-image-gallery-modal-container .icon-image-gallery-modal-carousel{color:#fff;opacity:.5;transition:all .15s ease}.gallery-image-gallery-modal-container .icon-image-gallery-modal-carousel:hover{opacity:.9}.gallery-image-gallery-modal-container .icon-image-gallery-modal-carousel:active{opacity:.5}.gallery-image-gallery-modal-container .icon-prev,.gallery-image-gallery-modal-container .icon-next{font-size:3rem}.gallery-image-gallery-modal-container .image-gallery-modal-img img{width:100%;max-height:90vh;border-radius:1rem}.gallery-image-gallery-modal-container .hide-overflow{overflow:hidden}@media only screen and (max-width: 75em){.gallery-image-gallery-modal-container .gallery-custom{display:normal}.gallery-image-gallery-modal-container .gallery-image-gallery-modal-container{display:none}.gallery-image-gallery-modal-container .gallery{column-count:3;width:100%}.gallery-image-gallery-modal-container .gallery-img img{width:100%}}@media only screen and (max-width: 56.25em){.gallery-image-gallery-modal-container .gallery{column-count:2}.gallery-image-gallery-modal-container .gallery-img img{max-width:100%}}@media only screen and (max-width: 37.5em){.gallery-image-gallery-modal-container .gallery{column-count:1}.gallery-image-gallery-modal-container .gallery-img img{width:100%}}.small-img{width:10rem;height:12rem}@media only screen and (max-width: 56.25em){.gallery-custom{display:block;margin:auto;width:90%}.gallery-custom .img{width:90%}.gallery-custom .big-img{width:100%;height:50rem;object-fit:cover;border-radius:1.5rem;box-shadow:2rem 1rem 1.5rem -.5rem #e0e0e075;margin-bottom:2rem}.gallery-custom .small-img{object-fit:cover;border-radius:.7rem;box-shadow:1rem .4rem .5rem -.5rem #e0e0e075}.gallery-image-gallery-modal-container{display:none}}\n"] }]
|
|
226
226
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }]; }, propDecorators: { galleryData: [{
|
|
227
227
|
type: Input
|
|
228
228
|
}], showCount: [{
|
|
@@ -243,10 +243,10 @@ class SuccessMessageDialogComponent {
|
|
|
243
243
|
}
|
|
244
244
|
}
|
|
245
245
|
SuccessMessageDialogComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SuccessMessageDialogComponent, deps: [{ token: i1$2.MatDialogRef }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
246
|
-
SuccessMessageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SuccessMessageDialogComponent, selector: "success-message-dialog", ngImport: i0, template: "<div class=\"page\">\n <span mat-dialog-title class=\"dialog-header\" mat-button>\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\n </span>\n\n <mat-dialog-content class=\"mat-typography\">\n <div class=\"success-icon\">\n <fa-icon icon=\"calendar-check\"></fa-icon>\n </div>\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\n </mat-dialog-content>\n <div class=\"divider\"></div>\n <mat-dialog-actions class=\"dialog-footer\">\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\n another form</span>\n </h3>\n </mat-dialog-actions>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
246
|
+
SuccessMessageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SuccessMessageDialogComponent, selector: "success-message-dialog", ngImport: i0, template: "<div class=\"page\">\n <span mat-dialog-title class=\"dialog-header\" mat-button>\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\n </span>\n\n <mat-dialog-content class=\"mat-typography\">\n <div class=\"success-icon\">\n <fa-icon icon=\"calendar-check\"></fa-icon>\n </div>\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\n </mat-dialog-content>\n <div class=\"divider\"></div>\n <mat-dialog-actions class=\"dialog-footer\">\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\n another form</span>\n </h3>\n </mat-dialog-actions>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{text-align:center}.page .mat-typography{padding:0 6rem 2rem;display:grid}.page .dialog-header{text-align:right;font-size:3rem;color:#686868;font-weight:900;padding:0 2rem}.page .success-icon{font-size:7rem;color:#12957e;margin-bottom:2rem}.page .title{color:#36393f;font-size:2.8rem;font-weight:700}.page .subtitle{justify-self:center;width:85%;font-size:2.2rem;font-weight:500;color:#494949}.page .divider{width:95%;border:.1rem solid #D8D8D8;margin:auto}.page .dialog-footer{padding:3rem 0rem;display:grid;justify-content:center}.page .dialog-footer h3{color:#494949;align-self:center;font-size:2.2rem}.page .link-text{color:#155ed4;cursor:pointer}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i1$2.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$2.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$2.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }] });
|
|
247
247
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SuccessMessageDialogComponent, decorators: [{
|
|
248
248
|
type: Component,
|
|
249
|
-
args: [{ selector: 'success-message-dialog', template: "<div class=\"page\">\n <span mat-dialog-title class=\"dialog-header\" mat-button>\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\n </span>\n\n <mat-dialog-content class=\"mat-typography\">\n <div class=\"success-icon\">\n <fa-icon icon=\"calendar-check\"></fa-icon>\n </div>\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\n </mat-dialog-content>\n <div class=\"divider\"></div>\n <mat-dialog-actions class=\"dialog-footer\">\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\n another form</span>\n </h3>\n </mat-dialog-actions>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
249
|
+
args: [{ selector: 'success-message-dialog', template: "<div class=\"page\">\n <span mat-dialog-title class=\"dialog-header\" mat-button>\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\n </span>\n\n <mat-dialog-content class=\"mat-typography\">\n <div class=\"success-icon\">\n <fa-icon icon=\"calendar-check\"></fa-icon>\n </div>\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\n </mat-dialog-content>\n <div class=\"divider\"></div>\n <mat-dialog-actions class=\"dialog-footer\">\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\n another form</span>\n </h3>\n </mat-dialog-actions>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{text-align:center}.page .mat-typography{padding:0 6rem 2rem;display:grid}.page .dialog-header{text-align:right;font-size:3rem;color:#686868;font-weight:900;padding:0 2rem}.page .success-icon{font-size:7rem;color:#12957e;margin-bottom:2rem}.page .title{color:#36393f;font-size:2.8rem;font-weight:700}.page .subtitle{justify-self:center;width:85%;font-size:2.2rem;font-weight:500;color:#494949}.page .divider{width:95%;border:.1rem solid #D8D8D8;margin:auto}.page .dialog-footer{padding:3rem 0rem;display:grid;justify-content:center}.page .dialog-footer h3{color:#494949;align-self:center;font-size:2.2rem}.page .link-text{color:#155ed4;cursor:pointer}\n"] }]
|
|
250
250
|
}], ctorParameters: function () { return [{ type: i1$2.MatDialogRef }, { type: i1.Router }]; } });
|
|
251
251
|
|
|
252
252
|
var PageSectionStyleThirteen;
|
|
@@ -279,10 +279,10 @@ class PageSectionStyleThirteenComponent {
|
|
|
279
279
|
}
|
|
280
280
|
}
|
|
281
281
|
PageSectionStyleThirteenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThirteenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
282
|
-
PageSectionStyleThirteenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThirteenComponent, selector: "page-section-style-thirteen", inputs: { sectionTitle: "sectionTitle", items: "items", iconType: "iconType", isTwoImages: "isTwoImages" }, ngImport: i0, template: "<div class=\"why-choose-us\">\n <div class=\"left-side\">\n <div class=\"headline\">\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\n </div>\n <div class=\"items\">\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\n <div class=\"left-column\">\n\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\n <img [src]=\"item.iconImage\" alt=\"\">\n </div>\n </div>\n <div></div>\n </div>\n <div class=\"right-column\">\n <div class=\"item-title\">{{item.title}}</div>\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\n {{item.description}}</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\n <div class=\"image-container\">\n <img [src]=\"showedImage\" alt=\"\">\n </div>\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
282
|
+
PageSectionStyleThirteenComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThirteenComponent, selector: "page-section-style-thirteen", inputs: { sectionTitle: "sectionTitle", items: "items", iconType: "iconType", isTwoImages: "isTwoImages" }, ngImport: i0, template: "<div class=\"why-choose-us\">\n <div class=\"left-side\">\n <div class=\"headline\">\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\n </div>\n <div class=\"items\">\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\n <div class=\"left-column\">\n\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\n <img [src]=\"item.iconImage\" alt=\"\">\n </div>\n </div>\n <div></div>\n </div>\n <div class=\"right-column\">\n <div class=\"item-title\">{{item.title}}</div>\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\n {{item.description}}</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\n <div class=\"image-container\">\n <img [src]=\"showedImage\" alt=\"\">\n </div>\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.why-choose-us{display:grid;grid-template-columns:48% 48%;column-gap:4%;margin:auto;width:90%}@media only screen and (min-width: 1500px){.why-choose-us{width:150rem}}.why-choose-us .left-side,.why-choose-us .right-side{width:100%}.why-choose-us .items{display:grid;gap:2.5rem}.why-choose-us .hovered-item{background-color:#155ed4;box-shadow:.1rem .2rem .5rem .1rem #0000003d}.why-choose-us .hovered-item .left-column .square-row{background-color:#fff}.why-choose-us .hovered-item .left-column .square-row .square{background-color:#155ed4;border-radius:50%}.why-choose-us .hovered-item .shape-column{background-color:#32353b}.why-choose-us .hovered-item .right-column .item-title{color:#fff}.why-choose-us .hovered-item .right-column .item-description{color:#f1f1f1}.why-choose-us .item{gap:1.5rem;display:grid;grid-template-columns:auto calc(100% - 5.5rem);cursor:pointer;border-radius:1.5rem;padding:2rem;transition:all ease-in-out .2s}.why-choose-us .item:hover{box-shadow:.1rem .2rem .5rem .1rem #0000003d}.why-choose-us .left-column{display:grid;grid-template-rows:5rem auto}.why-choose-us .left-column .square-row{align-self:center;width:4rem;height:4rem;background-color:#155ed4;display:grid;place-content:center;border-radius:.5rem;font-size:3.4rem}.why-choose-us .left-column .square-row .square{width:3rem;height:3rem;background-color:#155ed4;border-radius:.5rem;transition:border-radius ease-in-out .2s}.why-choose-us .shape-column{width:5rem;height:5rem;background-color:#155ed4;display:grid;place-content:center;border-radius:.5rem;font-size:3.4rem}.why-choose-us .shape-column .shape{padding:1rem;display:grid}.why-choose-us .shape-column .shape img{width:100%}.why-choose-us .right-column{display:grid;grid-template-rows:5rem auto}.why-choose-us .right-column .item-title{color:#2f3136;font-weight:600;font-size:2.2rem}.why-choose-us .right-column .item-description{color:#848484;font-size:1.6rem;font-weight:500}.why-choose-us .left-side .headline{padding-bottom:3rem}.why-choose-us .right-side{display:grid;justify-content:right}.why-choose-us .right-side .image-container{width:100%;border-radius:1.5rem 0 0 1.5rem;object-fit:cover;overflow:hidden;height:80rem}.why-choose-us .right-side .image-container img{height:100%;transition:all ease-in-out .2s;object-fit:cover}.why-choose-us .two-images-preview{place-content:center;position:relative}.why-choose-us .two-images-preview .image-container{width:90%;height:65rem;border-radius:1.5rem}.why-choose-us .two-images-preview .image-container img{width:100%}.why-choose-us .two-images-preview .back-image{width:50%;height:20rem;position:absolute;display:grid;align-content:end;justify-content:right;top:0;right:0;z-index:-1}@media only screen and (max-width: 75em){.why-choose-us{width:90%;margin:auto;display:flex;flex-direction:column;flex-wrap:wrap;row-gap:2%}.why-choose-us .left-side{margin-bottom:3rem}.why-choose-us .left-side .hide-description{max-height:0;opacity:0;overflow:hidden}.why-choose-us .left-side .show-description{max-height:20rem;transition:all 1s;opacity:1;overflow:hidden}.why-choose-us .right-side{width:100%;justify-content:center}.why-choose-us .right-side .image-container{width:100%;border-radius:1.5rem;height:35rem}.why-choose-us .right-side .image-container img{width:100%}.why-choose-us .right-side .back-image{display:none}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
283
283
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThirteenComponent, decorators: [{
|
|
284
284
|
type: Component,
|
|
285
|
-
args: [{ selector: 'page-section-style-thirteen', template: "<div class=\"why-choose-us\">\n <div class=\"left-side\">\n <div class=\"headline\">\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\n </div>\n <div class=\"items\">\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\n <div class=\"left-column\">\n\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\n <img [src]=\"item.iconImage\" alt=\"\">\n </div>\n </div>\n <div></div>\n </div>\n <div class=\"right-column\">\n <div class=\"item-title\">{{item.title}}</div>\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\n {{item.description}}</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\n <div class=\"image-container\">\n <img [src]=\"showedImage\" alt=\"\">\n </div>\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
285
|
+
args: [{ selector: 'page-section-style-thirteen', template: "<div class=\"why-choose-us\">\n <div class=\"left-side\">\n <div class=\"headline\">\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\n </div>\n <div class=\"items\">\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\n <div class=\"left-column\">\n\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\n <img [src]=\"item.iconImage\" alt=\"\">\n </div>\n </div>\n <div></div>\n </div>\n <div class=\"right-column\">\n <div class=\"item-title\">{{item.title}}</div>\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\n {{item.description}}</div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\n <div class=\"image-container\">\n <img [src]=\"showedImage\" alt=\"\">\n </div>\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.why-choose-us{display:grid;grid-template-columns:48% 48%;column-gap:4%;margin:auto;width:90%}@media only screen and (min-width: 1500px){.why-choose-us{width:150rem}}.why-choose-us .left-side,.why-choose-us .right-side{width:100%}.why-choose-us .items{display:grid;gap:2.5rem}.why-choose-us .hovered-item{background-color:#155ed4;box-shadow:.1rem .2rem .5rem .1rem #0000003d}.why-choose-us .hovered-item .left-column .square-row{background-color:#fff}.why-choose-us .hovered-item .left-column .square-row .square{background-color:#155ed4;border-radius:50%}.why-choose-us .hovered-item .shape-column{background-color:#32353b}.why-choose-us .hovered-item .right-column .item-title{color:#fff}.why-choose-us .hovered-item .right-column .item-description{color:#f1f1f1}.why-choose-us .item{gap:1.5rem;display:grid;grid-template-columns:auto calc(100% - 5.5rem);cursor:pointer;border-radius:1.5rem;padding:2rem;transition:all ease-in-out .2s}.why-choose-us .item:hover{box-shadow:.1rem .2rem .5rem .1rem #0000003d}.why-choose-us .left-column{display:grid;grid-template-rows:5rem auto}.why-choose-us .left-column .square-row{align-self:center;width:4rem;height:4rem;background-color:#155ed4;display:grid;place-content:center;border-radius:.5rem;font-size:3.4rem}.why-choose-us .left-column .square-row .square{width:3rem;height:3rem;background-color:#155ed4;border-radius:.5rem;transition:border-radius ease-in-out .2s}.why-choose-us .shape-column{width:5rem;height:5rem;background-color:#155ed4;display:grid;place-content:center;border-radius:.5rem;font-size:3.4rem}.why-choose-us .shape-column .shape{padding:1rem;display:grid}.why-choose-us .shape-column .shape img{width:100%}.why-choose-us .right-column{display:grid;grid-template-rows:5rem auto}.why-choose-us .right-column .item-title{color:#2f3136;font-weight:600;font-size:2.2rem}.why-choose-us .right-column .item-description{color:#848484;font-size:1.6rem;font-weight:500}.why-choose-us .left-side .headline{padding-bottom:3rem}.why-choose-us .right-side{display:grid;justify-content:right}.why-choose-us .right-side .image-container{width:100%;border-radius:1.5rem 0 0 1.5rem;object-fit:cover;overflow:hidden;height:80rem}.why-choose-us .right-side .image-container img{height:100%;transition:all ease-in-out .2s;object-fit:cover}.why-choose-us .two-images-preview{place-content:center;position:relative}.why-choose-us .two-images-preview .image-container{width:90%;height:65rem;border-radius:1.5rem}.why-choose-us .two-images-preview .image-container img{width:100%}.why-choose-us .two-images-preview .back-image{width:50%;height:20rem;position:absolute;display:grid;align-content:end;justify-content:right;top:0;right:0;z-index:-1}@media only screen and (max-width: 75em){.why-choose-us{width:90%;margin:auto;display:flex;flex-direction:column;flex-wrap:wrap;row-gap:2%}.why-choose-us .left-side{margin-bottom:3rem}.why-choose-us .left-side .hide-description{max-height:0;opacity:0;overflow:hidden}.why-choose-us .left-side .show-description{max-height:20rem;transition:all 1s;opacity:1;overflow:hidden}.why-choose-us .right-side{width:100%;justify-content:center}.why-choose-us .right-side .image-container{width:100%;border-radius:1.5rem;height:35rem}.why-choose-us .right-side .image-container img{width:100%}.why-choose-us .right-side .back-image{display:none}}\n"] }]
|
|
286
286
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionTitle: [{
|
|
287
287
|
type: Input
|
|
288
288
|
}], items: [{
|
|
@@ -304,10 +304,10 @@ class CallToActionSectionComponent {
|
|
|
304
304
|
}
|
|
305
305
|
}
|
|
306
306
|
CallToActionSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
307
|
-
CallToActionSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CallToActionSectionComponent, selector: "call-to-action-section", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"cta-box\">\n <div class=\"left-side\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\" *ngIf=\"data.subtitle\">\n {{data.subtitle}}\n </div>\n </div>\n <div class=\"right-side\">\n <div class=\"box\">\n <!-- <img src=\"https://i.ibb.co/PQbR3nL/box-left-side-design.png\" class=\"left-bg\" alt=\"\"> -->\n <!-- <img src=\"https://i.ibb.co/PxyyVHS/top-right-corner-design.png\" class=\"right-bg\" alt=\"\"> -->\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"cta-box-small\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\">\n {{data.subtitle}}\n </div>\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
307
|
+
CallToActionSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CallToActionSectionComponent, selector: "call-to-action-section", inputs: { data: "data" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"cta-box\">\n <div class=\"left-side\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\" *ngIf=\"data.subtitle\">\n {{data.subtitle}}\n </div>\n </div>\n <div class=\"right-side\">\n <div class=\"box\">\n <!-- <img src=\"https://i.ibb.co/PQbR3nL/box-left-side-design.png\" class=\"left-bg\" alt=\"\"> -->\n <!-- <img src=\"https://i.ibb.co/PxyyVHS/top-right-corner-design.png\" class=\"right-bg\" alt=\"\"> -->\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"cta-box-small\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\">\n {{data.subtitle}}\n </div>\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{display:grid;margin:7rem auto;width:90%}@media only screen and (min-width: 1500px){.page{width:150rem}}.page .cta-box{justify-self:center;width:100%;display:grid;grid-template-columns:calc(60% - 2.5rem) calc(40% - 2.5rem);column-gap:5rem;align-items:center;border-radius:1.5rem;position:relative;box-shadow:.2rem .2rem .4rem #00000040;background:linear-gradient(90deg,#155ED4 3.16%,#0F2844 97.43%)}.page .cta-box .left-bg{width:2rem;position:absolute;top:10%;left:0}.page .cta-box .right-bg{width:15rem;top:0;right:0;position:absolute}.page .cta-box .left-side{height:30rem;padding-left:5rem;display:grid;color:#fff}.page .cta-box .left-side .title{font-weight:700;font-size:4rem;align-self:center}.page .cta-box .left-side .subtitle{font-size:1.4rem}.page .cta-box .right-side{display:grid;padding:1rem;height:100%;align-items:center}.page .cta-box .right-side .box{justify-self:center;align-self:center;width:80%;padding:1.5rem;border-radius:1rem;border:.1rem solid #ffffff;color:#fff}@media screen and (max-width: 1000px){.page .cta-box .right-side .box{width:90%}}.page .cta-box .right-side .box .description{font-weight:400;font-size:1.6rem;margin-bottom:1rem}.page .cta-box .right-side .box .button{margin-top:2rem}.page .cta-box .right-side .box .button button{padding:1rem;font-size:1.2rem;font-weight:400;color:#fff;background-color:transparent;border:#fff .1rem solid}.page .cta-box-small{display:none}@media only screen and (max-width: 56.25em){.page .cta-box{display:none}.page .cta-box-small{justify-self:center;width:90%;display:grid;align-items:center;border-radius:1.5rem;box-shadow:.2rem .2rem .4rem #00000040;padding:2rem;background:linear-gradient(90deg,#155ED4 3.16%,#0F2844 97.43%);color:#fff}.page .cta-box-small .title{font-size:2rem;font-weight:700;padding:1rem 0rem}.page .cta-box-small .subtitle{padding:2rem 0rem;font-size:1.6rem}.page .cta-box-small .description{padding:2rem 0rem;font-size:1.4rem}.page .cta-box-small .button{color:#fff;font-weight:500;background-color:transparent}.page .cta-box-small .button button{padding:1rem}}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
|
|
308
308
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionComponent, decorators: [{
|
|
309
309
|
type: Component,
|
|
310
|
-
args: [{ selector: 'call-to-action-section', template: "<div class=\"page\">\n <div class=\"cta-box\">\n <div class=\"left-side\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\" *ngIf=\"data.subtitle\">\n {{data.subtitle}}\n </div>\n </div>\n <div class=\"right-side\">\n <div class=\"box\">\n <!-- <img src=\"https://i.ibb.co/PQbR3nL/box-left-side-design.png\" class=\"left-bg\" alt=\"\"> -->\n <!-- <img src=\"https://i.ibb.co/PxyyVHS/top-right-corner-design.png\" class=\"right-bg\" alt=\"\"> -->\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"cta-box-small\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\">\n {{data.subtitle}}\n </div>\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
310
|
+
args: [{ selector: 'call-to-action-section', template: "<div class=\"page\">\n <div class=\"cta-box\">\n <div class=\"left-side\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\" *ngIf=\"data.subtitle\">\n {{data.subtitle}}\n </div>\n </div>\n <div class=\"right-side\">\n <div class=\"box\">\n <!-- <img src=\"https://i.ibb.co/PQbR3nL/box-left-side-design.png\" class=\"left-bg\" alt=\"\"> -->\n <!-- <img src=\"https://i.ibb.co/PxyyVHS/top-right-corner-design.png\" class=\"right-bg\" alt=\"\"> -->\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"cta-box-small\">\n <div class=\"title\">\n {{data.title}}\n </div>\n <div class=\"subtitle\">\n {{data.subtitle}}\n </div>\n <div class=\"description\">\n {{data.description}}\n </div>\n <div class=\"button\">\n <button type=\"button\" mat-raised-button\n (click)=\"onClickGetStarted(data.button.route)\">{{data.button.name}}</button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{display:grid;margin:7rem auto;width:90%}@media only screen and (min-width: 1500px){.page{width:150rem}}.page .cta-box{justify-self:center;width:100%;display:grid;grid-template-columns:calc(60% - 2.5rem) calc(40% - 2.5rem);column-gap:5rem;align-items:center;border-radius:1.5rem;position:relative;box-shadow:.2rem .2rem .4rem #00000040;background:linear-gradient(90deg,#155ED4 3.16%,#0F2844 97.43%)}.page .cta-box .left-bg{width:2rem;position:absolute;top:10%;left:0}.page .cta-box .right-bg{width:15rem;top:0;right:0;position:absolute}.page .cta-box .left-side{height:30rem;padding-left:5rem;display:grid;color:#fff}.page .cta-box .left-side .title{font-weight:700;font-size:4rem;align-self:center}.page .cta-box .left-side .subtitle{font-size:1.4rem}.page .cta-box .right-side{display:grid;padding:1rem;height:100%;align-items:center}.page .cta-box .right-side .box{justify-self:center;align-self:center;width:80%;padding:1.5rem;border-radius:1rem;border:.1rem solid #ffffff;color:#fff}@media screen and (max-width: 1000px){.page .cta-box .right-side .box{width:90%}}.page .cta-box .right-side .box .description{font-weight:400;font-size:1.6rem;margin-bottom:1rem}.page .cta-box .right-side .box .button{margin-top:2rem}.page .cta-box .right-side .box .button button{padding:1rem;font-size:1.2rem;font-weight:400;color:#fff;background-color:transparent;border:#fff .1rem solid}.page .cta-box-small{display:none}@media only screen and (max-width: 56.25em){.page .cta-box{display:none}.page .cta-box-small{justify-self:center;width:90%;display:grid;align-items:center;border-radius:1.5rem;box-shadow:.2rem .2rem .4rem #00000040;padding:2rem;background:linear-gradient(90deg,#155ED4 3.16%,#0F2844 97.43%);color:#fff}.page .cta-box-small .title{font-size:2rem;font-weight:700;padding:1rem 0rem}.page .cta-box-small .subtitle{padding:2rem 0rem;font-size:1.6rem}.page .cta-box-small .description{padding:2rem 0rem;font-size:1.4rem}.page .cta-box-small .button{color:#fff;font-weight:500;background-color:transparent}.page .cta-box-small .button button{padding:1rem}}\n"] }]
|
|
311
311
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { data: [{
|
|
312
312
|
type: Input
|
|
313
313
|
}] } });
|
|
@@ -348,10 +348,10 @@ class TeamComponent {
|
|
|
348
348
|
}
|
|
349
349
|
}
|
|
350
350
|
TeamComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TeamComponent, deps: [{ token: i1.Router }, { token: i1$1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
351
|
-
TeamComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TeamComponent, selector: "team", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\n <div class=\"image-container\">\n <img [src]=\"teamMember.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{teamMember.fullName}}\n </div>\n <div class=\"position\">\n {{teamMember.position}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-member pTemplate=\"item\">\n <div class=\"member-card\">\n <div class=\"image-container\">\n <img [src]=\"member.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{member.fullName}}\n </div>\n <div class=\"position\">\n {{member.position}}\n </div>\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n <div class=\"caption-text\">\n {{sectionContent.caption}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
351
|
+
TeamComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TeamComponent, selector: "team", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\n <div class=\"image-container\">\n <img [src]=\"teamMember.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{teamMember.fullName}}\n </div>\n <div class=\"position\">\n {{teamMember.position}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-member pTemplate=\"item\">\n <div class=\"member-card\">\n <div class=\"image-container\">\n <img [src]=\"member.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{member.fullName}}\n </div>\n <div class=\"position\">\n {{member.position}}\n </div>\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n <div class=\"caption-text\">\n {{sectionContent.caption}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{margin-top:3rem;padding:5%;display:grid;grid-template-rows:auto auto;row-gap:2rem;width:100%}.page .title{font-weight:700;font-size:3.2rem;width:80%;margin-left:4%}.page .cards{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.page .caption-text{font-weight:600;font-size:2rem;width:85%;text-align:center;margin:2rem auto;color:#155ed4}.page .member-card{place-self:center;height:27rem;width:22rem;padding:1rem;display:grid;transition:all .3s ease-in-out;border-radius:1rem}.page .member-card:hover{transition:all .2s ease-in-out}.page .member-card .image-container{display:grid;place-self:center;place-items:center;border-radius:1.5rem;overflow:hidden;width:100%;height:20rem}.page .member-card .image-container img{width:100%;height:100%;object-fit:cover}.page .member-card .member-information{justify-self:center;text-align:center}.page .member-card .member-information .name{font-weight:600;font-size:1.9rem;margin:auto;text-align:center}.page .member-card .member-information .position{font-weight:500;font-size:1.4rem}@media only screen and (max-width: 75em){.page{width:100%;display:block}.page .title{margin-bottom:1.8rem}.page .cards{display:block;width:100%}.page .member-card{width:22rem;margin:auto}.page .member-card .image-container{width:100%;height:20rem;overflow:hidden}.page .member-card .image-container img{width:100%;height:100%}}@media only screen and (max-width: 37.5em){.page .member-card{width:23rem}}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#155ed4;width:2.7rem;transition:all ease-in-out .1s}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\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$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
352
352
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TeamComponent, decorators: [{
|
|
353
353
|
type: Component,
|
|
354
|
-
args: [{ selector: 'team', template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\n <div class=\"image-container\">\n <img [src]=\"teamMember.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{teamMember.fullName}}\n </div>\n <div class=\"position\">\n {{teamMember.position}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-member pTemplate=\"item\">\n <div class=\"member-card\">\n <div class=\"image-container\">\n <img [src]=\"member.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{member.fullName}}\n </div>\n <div class=\"position\">\n {{member.position}}\n </div>\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n <div class=\"caption-text\">\n {{sectionContent.caption}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
354
|
+
args: [{ selector: 'team', template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\n <div class=\"image-container\">\n <img [src]=\"teamMember.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{teamMember.fullName}}\n </div>\n <div class=\"position\">\n {{teamMember.position}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-member pTemplate=\"item\">\n <div class=\"member-card\">\n <div class=\"image-container\">\n <img [src]=\"member.profilePicture\">\n </div>\n <div class=\"member-information\">\n <div class=\"name\">\n {{member.fullName}}\n </div>\n <div class=\"position\">\n {{member.position}}\n </div>\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n <div class=\"caption-text\">\n {{sectionContent.caption}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{margin-top:3rem;padding:5%;display:grid;grid-template-rows:auto auto;row-gap:2rem;width:100%}.page .title{font-weight:700;font-size:3.2rem;width:80%;margin-left:4%}.page .cards{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.page .caption-text{font-weight:600;font-size:2rem;width:85%;text-align:center;margin:2rem auto;color:#155ed4}.page .member-card{place-self:center;height:27rem;width:22rem;padding:1rem;display:grid;transition:all .3s ease-in-out;border-radius:1rem}.page .member-card:hover{transition:all .2s ease-in-out}.page .member-card .image-container{display:grid;place-self:center;place-items:center;border-radius:1.5rem;overflow:hidden;width:100%;height:20rem}.page .member-card .image-container img{width:100%;height:100%;object-fit:cover}.page .member-card .member-information{justify-self:center;text-align:center}.page .member-card .member-information .name{font-weight:600;font-size:1.9rem;margin:auto;text-align:center}.page .member-card .member-information .position{font-weight:500;font-size:1.4rem}@media only screen and (max-width: 75em){.page{width:100%;display:block}.page .title{margin-bottom:1.8rem}.page .cards{display:block;width:100%}.page .member-card{width:22rem;margin:auto}.page .member-card .image-container{width:100%;height:20rem;overflow:hidden}.page .member-card .image-container img{width:100%;height:100%}}@media only screen and (max-width: 37.5em){.page .member-card{width:23rem}}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#155ed4;width:2.7rem;transition:all ease-in-out .1s}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"] }]
|
|
355
355
|
}], ctorParameters: function () { return [{ type: i1.Router }, { type: i1$1.BreakpointObserver }]; }, propDecorators: { sectionContent: [{
|
|
356
356
|
type: Input
|
|
357
357
|
}] } });
|
|
@@ -375,10 +375,10 @@ class ValuesComponent {
|
|
|
375
375
|
}
|
|
376
376
|
}
|
|
377
377
|
ValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, deps: [{ token: i1$1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
378
|
-
ValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuesComponent, selector: "values", inputs: { sectionContent: "sectionContent", withBgImage: "withBgImage", isDarkBg: "isDarkBg" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of sectionContent.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
378
|
+
ValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuesComponent, selector: "values", inputs: { sectionContent: "sectionContent", withBgImage: "withBgImage", isDarkBg: "isDarkBg" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of sectionContent.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{display:grid;grid-template-rows:auto auto auto auto;margin-top:5rem;align-items:center;position:relative;row-gap:2rem}.page .background-image{width:100%;height:40%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1}.page .values-cards{grid-row:4;display:grid;grid-template-columns:49% 49%;grid-template-rows:auto auto;place-content:center;gap:3REM;z-index:2;margin:auto;width:60%}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:70%;width:90%;margin:2rem auto}}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { 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$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
379
379
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, decorators: [{
|
|
380
380
|
type: Component,
|
|
381
|
-
args: [{ selector: 'values', template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of sectionContent.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
381
|
+
args: [{ selector: 'values', template: "<div class=\"page\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of sectionContent.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"sectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.image\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{display:grid;grid-template-rows:auto auto auto auto;margin-top:5rem;align-items:center;position:relative;row-gap:2rem}.page .background-image{width:100%;height:40%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:-1}.page .values-cards{grid-row:4;display:grid;grid-template-columns:49% 49%;grid-template-rows:auto auto;place-content:center;gap:3REM;z-index:2;margin:auto;width:60%}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:70%;width:90%;margin:2rem auto}}\n"] }]
|
|
382
382
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }]; }, propDecorators: { sectionContent: [{
|
|
383
383
|
type: Input
|
|
384
384
|
}], withBgImage: [{
|
|
@@ -394,10 +394,10 @@ class OurClientListingComponent {
|
|
|
394
394
|
}
|
|
395
395
|
}
|
|
396
396
|
OurClientListingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientListingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
397
|
-
OurClientListingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OurClientListingComponent, selector: "our-client-listing", inputs: { account: "account" }, ngImport: i0, template: "<div class=\"client\">\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
397
|
+
OurClientListingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OurClientListingComponent, selector: "our-client-listing", inputs: { account: "account" }, ngImport: i0, template: "<div class=\"client\">\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.client{margin:2vh 0}.client .image{filter:grayscale(100%);text-align:center;box-shadow:#0000001f .1rem .3rem,#0000003d 0 .1rem .2rem;border-radius:.5rem}.client .image:hover{filter:none;cursor:pointer}@media only screen and (max-width: 112.5em){.image{width:70%}}@media only screen and (max-width: 75em){.image{width:70%}}@media only screen and (max-width: 56.25em){.image{width:70%}}@media only screen and (max-width: 37.5em){.image{width:85%}}@media only screen and (min-width: 112.5em){.image{width:70%}}\n"] });
|
|
398
398
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientListingComponent, decorators: [{
|
|
399
399
|
type: Component,
|
|
400
|
-
args: [{ selector: "our-client-listing", template: "<div class=\"client\">\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
400
|
+
args: [{ selector: "our-client-listing", template: "<div class=\"client\">\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.client{margin:2vh 0}.client .image{filter:grayscale(100%);text-align:center;box-shadow:#0000001f .1rem .3rem,#0000003d 0 .1rem .2rem;border-radius:.5rem}.client .image:hover{filter:none;cursor:pointer}@media only screen and (max-width: 112.5em){.image{width:70%}}@media only screen and (max-width: 75em){.image{width:70%}}@media only screen and (max-width: 56.25em){.image{width:70%}}@media only screen and (max-width: 37.5em){.image{width:85%}}@media only screen and (min-width: 112.5em){.image{width:70%}}\n"] }]
|
|
401
401
|
}], ctorParameters: function () { return []; }, propDecorators: { account: [{
|
|
402
402
|
type: Input
|
|
403
403
|
}] } });
|
|
@@ -442,10 +442,10 @@ class OurClientsComponent {
|
|
|
442
442
|
}
|
|
443
443
|
}
|
|
444
444
|
OurClientsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientsComponent, deps: [{ token: i1$1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
445
|
-
OurClientsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OurClientsComponent, selector: "our-clients", inputs: { accounts: "accounts" }, ngImport: i0, template: "<p-carousel class=\"custom\" [value]=\"accounts\" [numVisible]=\"clientsToShow\" [numScroll]=\"scrollClientNumber\" [page]=\"0\"\n orientation=\"horizantol\" [circular]=\"true\">\n <ng-template let-client pTemplate=\"item\">\n <div>\n <our-client-listing class=\"client\" [account]=\"client\">\n </our-client-listing>\n </div>\n </ng-template>\n</p-carousel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
445
|
+
OurClientsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: OurClientsComponent, selector: "our-clients", inputs: { accounts: "accounts" }, ngImport: i0, template: "<p-carousel class=\"custom\" [value]=\"accounts\" [numVisible]=\"clientsToShow\" [numScroll]=\"scrollClientNumber\" [page]=\"0\"\n orientation=\"horizantol\" [circular]=\"true\">\n <ng-template let-client pTemplate=\"item\">\n <div>\n <our-client-listing class=\"client\" [account]=\"client\">\n </our-client-listing>\n </div>\n </ng-template>\n</p-carousel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.custom{height:20vh}.client{height:20rem}.custom,.client{margin:auto;width:90%}@media only screen and (min-width: 1500px){.custom,.client{width:150rem}}\n"], dependencies: [{ kind: "directive", type: i4$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: OurClientListingComponent, selector: "our-client-listing", inputs: ["account"] }] });
|
|
446
446
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientsComponent, decorators: [{
|
|
447
447
|
type: Component,
|
|
448
|
-
args: [{ selector: "our-clients", template: "<p-carousel class=\"custom\" [value]=\"accounts\" [numVisible]=\"clientsToShow\" [numScroll]=\"scrollClientNumber\" [page]=\"0\"\n orientation=\"horizantol\" [circular]=\"true\">\n <ng-template let-client pTemplate=\"item\">\n <div>\n <our-client-listing class=\"client\" [account]=\"client\">\n </our-client-listing>\n </div>\n </ng-template>\n</p-carousel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
448
|
+
args: [{ selector: "our-clients", template: "<p-carousel class=\"custom\" [value]=\"accounts\" [numVisible]=\"clientsToShow\" [numScroll]=\"scrollClientNumber\" [page]=\"0\"\n orientation=\"horizantol\" [circular]=\"true\">\n <ng-template let-client pTemplate=\"item\">\n <div>\n <our-client-listing class=\"client\" [account]=\"client\">\n </our-client-listing>\n </div>\n </ng-template>\n</p-carousel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.custom{height:20vh}.client{height:20rem}.custom,.client{margin:auto;width:90%}@media only screen and (min-width: 1500px){.custom,.client{width:150rem}}\n"] }]
|
|
449
449
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }]; }, propDecorators: { accounts: [{
|
|
450
450
|
type: Input
|
|
451
451
|
}] } });
|
|
@@ -460,10 +460,10 @@ class PageSectionWithMultipleCardsComponent {
|
|
|
460
460
|
}
|
|
461
461
|
}
|
|
462
462
|
PageSectionWithMultipleCardsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionWithMultipleCardsComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
463
|
-
PageSectionWithMultipleCardsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionWithMultipleCardsComponent, selector: "page-section-with-multiple-cards", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"text-part\">\n <h2 class=\"tip-title\">\n {{sectionContent.tipTitle}}\n </h2>\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\n <div class=\"card-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\n <path\n d=\"M5.0312 58.8331C-9.18797 29.0705 16.1615 9.11602 41.3271 3.99601C66.4928 -1.12401 102.401 -5.60082 96.1642 40.2919C89.9278 86.1847 85.034 90.009 59.8684 95.129C34.7027 100.249 19.2504 88.5958 5.0312 58.8331Z\" />\n </svg>\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\n </div>\n <div class=\"card-title\">\n {{reason.title}}\n </div>\n <div class=\"card-description\">\n {{reason.description}}\n </div>\n </div>\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\n <div class=\"card-title\">\n {{sectionContent.allReasonsBox.ctaText}}\n </div>\n <div class=\"icon-circle\">\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\n </div>\n </button>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
463
|
+
PageSectionWithMultipleCardsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionWithMultipleCardsComponent, selector: "page-section-with-multiple-cards", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"text-part\">\n <h2 class=\"tip-title\">\n {{sectionContent.tipTitle}}\n </h2>\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\n <div class=\"card-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\n <path\n d=\"M5.0312 58.8331C-9.18797 29.0705 16.1615 9.11602 41.3271 3.99601C66.4928 -1.12401 102.401 -5.60082 96.1642 40.2919C89.9278 86.1847 85.034 90.009 59.8684 95.129C34.7027 100.249 19.2504 88.5958 5.0312 58.8331Z\" />\n </svg>\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\n </div>\n <div class=\"card-title\">\n {{reason.title}}\n </div>\n <div class=\"card-description\">\n {{reason.description}}\n </div>\n </div>\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\n <div class=\"card-title\">\n {{sectionContent.allReasonsBox.ctaText}}\n </div>\n <div class=\"icon-circle\">\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\n </div>\n </button>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{gap:1.5rem;display:flex;flex-wrap:wrap;width:90%;margin:2rem auto}@media only screen and (min-width: 1500px){.page{max-width:150rem}}.page .text-part{width:61.5rem;row-gap:.5rem;display:grid;grid-template-rows:2rem 13rem auto;min-width:52rem;margin-bottom:2rem}@media only screen and (max-width: 600px){.page .text-part{min-width:0;width:100%;grid-template-rows:2rem auto auto}.page .text-part .subtitle{font-size:3rem;font-weight:700}}.page .text-part .tip-title{color:#155ed4;font-size:1.6rem;font-weight:700}.page .text-part .subtitle{font-size:4rem;font-weight:800;color:#3d3d3d}.page .text-part .description{font-size:2rem;font-weight:500;color:#7e7e7e}.page .reason-card,.page .all-reason-card{row-gap:1rem;display:grid;border-radius:1.5rem;border:.1rem solid #D8D8D8;background:#FFF;box-shadow:.2rem .2rem .4rem #00000040;padding:2rem 1rem;margin:0rem auto}.page .reason-card{width:30rem;grid-template-rows:auto auto auto;text-align:center}.page .reason-card:nth-child(odd) svg{transform:rotate(90deg)}.page .reason-card .card-icon{place-self:center;position:relative}.page .reason-card .card-icon svg{width:9.5rem;height:9.5rem}.page .reason-card .card-icon fa-icon{position:absolute;font-size:3.8rem;top:calc(50% - 1.9rem);left:calc(50% - 1.9rem)}.page .reason-card .card-description{font-size:1.4rem;font-weight:500;color:#484848}.page .card-title{font-size:2.2rem;font-weight:800;color:#424345}.page .all-reason-card{place-content:center;cursor:pointer;transition:all .2s;width:30rem}@media (hover: hover){.page .all-reason-card:hover{background-color:#155ed4}.page .all-reason-card:hover .card-title{color:#fff}.page .all-reason-card:hover .icon-circle{color:#155ed4;background-color:#fff}.page .all-reason-card:active{background-color:#fff}.page .all-reason-card:active .card-title{color:#424345}.page .all-reason-card:active .icon-circle{color:#fff;background-color:#155ed4}}.page .all-reason-card .icon-circle{border-radius:50%;font-size:1.8rem;width:4rem;height:4rem;display:grid;place-content:center;background-color:#155ed4;color:#fff;justify-self:center}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
464
464
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionWithMultipleCardsComponent, decorators: [{
|
|
465
465
|
type: Component,
|
|
466
|
-
args: [{ selector: 'page-section-with-multiple-cards', template: "<div class=\"page\">\n <div class=\"text-part\">\n <h2 class=\"tip-title\">\n {{sectionContent.tipTitle}}\n </h2>\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\n <div class=\"card-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\n <path\n d=\"M5.0312 58.8331C-9.18797 29.0705 16.1615 9.11602 41.3271 3.99601C66.4928 -1.12401 102.401 -5.60082 96.1642 40.2919C89.9278 86.1847 85.034 90.009 59.8684 95.129C34.7027 100.249 19.2504 88.5958 5.0312 58.8331Z\" />\n </svg>\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\n </div>\n <div class=\"card-title\">\n {{reason.title}}\n </div>\n <div class=\"card-description\">\n {{reason.description}}\n </div>\n </div>\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\n <div class=\"card-title\">\n {{sectionContent.allReasonsBox.ctaText}}\n </div>\n <div class=\"icon-circle\">\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\n </div>\n </button>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
466
|
+
args: [{ selector: 'page-section-with-multiple-cards', template: "<div class=\"page\">\n <div class=\"text-part\">\n <h2 class=\"tip-title\">\n {{sectionContent.tipTitle}}\n </h2>\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\n <div class=\"card-icon\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\n <path\n d=\"M5.0312 58.8331C-9.18797 29.0705 16.1615 9.11602 41.3271 3.99601C66.4928 -1.12401 102.401 -5.60082 96.1642 40.2919C89.9278 86.1847 85.034 90.009 59.8684 95.129C34.7027 100.249 19.2504 88.5958 5.0312 58.8331Z\" />\n </svg>\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\n </div>\n <div class=\"card-title\">\n {{reason.title}}\n </div>\n <div class=\"card-description\">\n {{reason.description}}\n </div>\n </div>\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\n <div class=\"card-title\">\n {{sectionContent.allReasonsBox.ctaText}}\n </div>\n <div class=\"icon-circle\">\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\n </div>\n </button>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{gap:1.5rem;display:flex;flex-wrap:wrap;width:90%;margin:2rem auto}@media only screen and (min-width: 1500px){.page{max-width:150rem}}.page .text-part{width:61.5rem;row-gap:.5rem;display:grid;grid-template-rows:2rem 13rem auto;min-width:52rem;margin-bottom:2rem}@media only screen and (max-width: 600px){.page .text-part{min-width:0;width:100%;grid-template-rows:2rem auto auto}.page .text-part .subtitle{font-size:3rem;font-weight:700}}.page .text-part .tip-title{color:#155ed4;font-size:1.6rem;font-weight:700}.page .text-part .subtitle{font-size:4rem;font-weight:800;color:#3d3d3d}.page .text-part .description{font-size:2rem;font-weight:500;color:#7e7e7e}.page .reason-card,.page .all-reason-card{row-gap:1rem;display:grid;border-radius:1.5rem;border:.1rem solid #D8D8D8;background:#FFF;box-shadow:.2rem .2rem .4rem #00000040;padding:2rem 1rem;margin:0rem auto}.page .reason-card{width:30rem;grid-template-rows:auto auto auto;text-align:center}.page .reason-card:nth-child(odd) svg{transform:rotate(90deg)}.page .reason-card .card-icon{place-self:center;position:relative}.page .reason-card .card-icon svg{width:9.5rem;height:9.5rem}.page .reason-card .card-icon fa-icon{position:absolute;font-size:3.8rem;top:calc(50% - 1.9rem);left:calc(50% - 1.9rem)}.page .reason-card .card-description{font-size:1.4rem;font-weight:500;color:#484848}.page .card-title{font-size:2.2rem;font-weight:800;color:#424345}.page .all-reason-card{place-content:center;cursor:pointer;transition:all .2s;width:30rem}@media (hover: hover){.page .all-reason-card:hover{background-color:#155ed4}.page .all-reason-card:hover .card-title{color:#fff}.page .all-reason-card:hover .icon-circle{color:#155ed4;background-color:#fff}.page .all-reason-card:active{background-color:#fff}.page .all-reason-card:active .card-title{color:#424345}.page .all-reason-card:active .icon-circle{color:#fff;background-color:#155ed4}}.page .all-reason-card .icon-circle{border-radius:50%;font-size:1.8rem;width:4rem;height:4rem;display:grid;place-content:center;background-color:#155ed4;color:#fff;justify-self:center}\n"] }]
|
|
467
467
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
468
468
|
type: Input
|
|
469
469
|
}] } });
|
|
@@ -479,10 +479,10 @@ class CallToActionSectionTwoComponent {
|
|
|
479
479
|
}
|
|
480
480
|
}
|
|
481
481
|
CallToActionSectionTwoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionTwoComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
482
|
-
CallToActionSectionTwoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CallToActionSectionTwoComponent, selector: "call-to-action-section-two", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"cta-section\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 61 48\" fill=\"none\" class=\"svg-top-right\">\n <path\n d=\"M16.8568 30.4924C-18.2522 24.3036 10.5419 3.88207 25.167 1.30326C39.7921 -1.27554 56.828 7.35401 58.4986 18.7386C60.1692 30.1232 64.3083 44.7867 49.6832 47.3655C35.058 49.9443 32.3641 34.7521 16.8568 30.4924Z\"\n fill=\"#155ED4\" />\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 53 51\" fill=\"none\" class=\"svg-bottom-left\">\n <path\n d=\"M39.4766 22.6779C69.5603 35.0664 40.8217 50.4221 27.4676 50.4221C14.1135 50.4221 0.41333 38.7801 0.750387 27.0924C1.08744 15.4046 -0.237166 0 13.1169 0C26.471 0 26.4324 15.6787 39.4766 22.6779Z\"\n fill=\"#155ED4\" />\n </svg>\n <h1 class=\"cta-title\">{{sectionContent.title}}</h1>\n <p class=\"cta-description\">\n {{sectionContent.description}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkOne.route)\">\n {{sectionContent.linkOne.text}}\n </span>.\n {{sectionContent.textBetweenLinksOne}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkTwo.route)\">\n {{sectionContent.linkTwo.text}} \n </span>\n {{sectionContent.textBetweenLinksTwo}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkThree.route)\">\n {{sectionContent.linkThree.text}}\n </span>\n {{sectionContent.textAfterLinks}}\n </p>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
482
|
+
CallToActionSectionTwoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CallToActionSectionTwoComponent, selector: "call-to-action-section-two", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"cta-section\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 61 48\" fill=\"none\" class=\"svg-top-right\">\n <path\n d=\"M16.8568 30.4924C-18.2522 24.3036 10.5419 3.88207 25.167 1.30326C39.7921 -1.27554 56.828 7.35401 58.4986 18.7386C60.1692 30.1232 64.3083 44.7867 49.6832 47.3655C35.058 49.9443 32.3641 34.7521 16.8568 30.4924Z\"\n fill=\"#155ED4\" />\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 53 51\" fill=\"none\" class=\"svg-bottom-left\">\n <path\n d=\"M39.4766 22.6779C69.5603 35.0664 40.8217 50.4221 27.4676 50.4221C14.1135 50.4221 0.41333 38.7801 0.750387 27.0924C1.08744 15.4046 -0.237166 0 13.1169 0C26.471 0 26.4324 15.6787 39.4766 22.6779Z\"\n fill=\"#155ED4\" />\n </svg>\n <h1 class=\"cta-title\">{{sectionContent.title}}</h1>\n <p class=\"cta-description\">\n {{sectionContent.description}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkOne.route)\">\n {{sectionContent.linkOne.text}}\n </span>.\n {{sectionContent.textBetweenLinksOne}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkTwo.route)\">\n {{sectionContent.linkTwo.text}} \n </span>\n {{sectionContent.textBetweenLinksTwo}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkThree.route)\">\n {{sectionContent.linkThree.text}}\n </span>\n {{sectionContent.textAfterLinks}}\n </p>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.cta-section{background-color:#c2d0de;display:grid;position:relative;border-radius:1.5rem;padding:2rem 1.5rem;width:100%;margin:3rem auto}.cta-section .svg-top-right{height:4.8rem;width:6.1rem;position:absolute;top:-1rem;right:-1rem}.cta-section .svg-bottom-left{height:5.1rem;width:5.3rem;position:absolute;bottom:-2rem;left:-1.5rem}.cta-section .cta-title{font-size:3.4rem;font-weight:700;color:#000}.cta-section .cta-description{font-size:2rem;font-weight:500}.cta-section .link-text{text-decoration:underline;font-weight:700;cursor:pointer;transition:color linear .2s}@media (hover: hover){.cta-section .link-text:hover{color:#155ed4}}\n"] });
|
|
483
483
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionTwoComponent, decorators: [{
|
|
484
484
|
type: Component,
|
|
485
|
-
args: [{ selector: 'call-to-action-section-two', template: "<div class=\"cta-section\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 61 48\" fill=\"none\" class=\"svg-top-right\">\n <path\n d=\"M16.8568 30.4924C-18.2522 24.3036 10.5419 3.88207 25.167 1.30326C39.7921 -1.27554 56.828 7.35401 58.4986 18.7386C60.1692 30.1232 64.3083 44.7867 49.6832 47.3655C35.058 49.9443 32.3641 34.7521 16.8568 30.4924Z\"\n fill=\"#155ED4\" />\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 53 51\" fill=\"none\" class=\"svg-bottom-left\">\n <path\n d=\"M39.4766 22.6779C69.5603 35.0664 40.8217 50.4221 27.4676 50.4221C14.1135 50.4221 0.41333 38.7801 0.750387 27.0924C1.08744 15.4046 -0.237166 0 13.1169 0C26.471 0 26.4324 15.6787 39.4766 22.6779Z\"\n fill=\"#155ED4\" />\n </svg>\n <h1 class=\"cta-title\">{{sectionContent.title}}</h1>\n <p class=\"cta-description\">\n {{sectionContent.description}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkOne.route)\">\n {{sectionContent.linkOne.text}}\n </span>.\n {{sectionContent.textBetweenLinksOne}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkTwo.route)\">\n {{sectionContent.linkTwo.text}} \n </span>\n {{sectionContent.textBetweenLinksTwo}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkThree.route)\">\n {{sectionContent.linkThree.text}}\n </span>\n {{sectionContent.textAfterLinks}}\n </p>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
485
|
+
args: [{ selector: 'call-to-action-section-two', template: "<div class=\"cta-section\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 61 48\" fill=\"none\" class=\"svg-top-right\">\n <path\n d=\"M16.8568 30.4924C-18.2522 24.3036 10.5419 3.88207 25.167 1.30326C39.7921 -1.27554 56.828 7.35401 58.4986 18.7386C60.1692 30.1232 64.3083 44.7867 49.6832 47.3655C35.058 49.9443 32.3641 34.7521 16.8568 30.4924Z\"\n fill=\"#155ED4\" />\n </svg>\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 53 51\" fill=\"none\" class=\"svg-bottom-left\">\n <path\n d=\"M39.4766 22.6779C69.5603 35.0664 40.8217 50.4221 27.4676 50.4221C14.1135 50.4221 0.41333 38.7801 0.750387 27.0924C1.08744 15.4046 -0.237166 0 13.1169 0C26.471 0 26.4324 15.6787 39.4766 22.6779Z\"\n fill=\"#155ED4\" />\n </svg>\n <h1 class=\"cta-title\">{{sectionContent.title}}</h1>\n <p class=\"cta-description\">\n {{sectionContent.description}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkOne.route)\">\n {{sectionContent.linkOne.text}}\n </span>.\n {{sectionContent.textBetweenLinksOne}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkTwo.route)\">\n {{sectionContent.linkTwo.text}} \n </span>\n {{sectionContent.textBetweenLinksTwo}}\n <span class=\"link-text\" (click)=\"onClickLink(sectionContent.linkThree.route)\">\n {{sectionContent.linkThree.text}}\n </span>\n {{sectionContent.textAfterLinks}}\n </p>\n\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.cta-section{background-color:#c2d0de;display:grid;position:relative;border-radius:1.5rem;padding:2rem 1.5rem;width:100%;margin:3rem auto}.cta-section .svg-top-right{height:4.8rem;width:6.1rem;position:absolute;top:-1rem;right:-1rem}.cta-section .svg-bottom-left{height:5.1rem;width:5.3rem;position:absolute;bottom:-2rem;left:-1.5rem}.cta-section .cta-title{font-size:3.4rem;font-weight:700;color:#000}.cta-section .cta-description{font-size:2rem;font-weight:500}.cta-section .link-text{text-decoration:underline;font-weight:700;cursor:pointer;transition:color linear .2s}@media (hover: hover){.cta-section .link-text:hover{color:#155ed4}}\n"] }]
|
|
486
486
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
487
487
|
type: Input
|
|
488
488
|
}] } });
|
|
@@ -507,10 +507,10 @@ class ValuePropsSectionComponent {
|
|
|
507
507
|
}
|
|
508
508
|
}
|
|
509
509
|
ValuePropsSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
510
|
-
ValuePropsSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropsSectionComponent, selector: "value-props-section", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" [ngClass]=\"{'image-text-sort': sectionContent.paragraphProperties.onRightSide , 'text-image-sort': !sectionContent.paragraphProperties.onRightSide ,'paragraph-with-card':sectionContent.paragraphProperties.withCard }\">\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\n </section-title>\n <div class=\"value-prop-image\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n <p *ngFor=\"let paragraph of sectionContent.paragraphs; let j = index\" class=\"paragraph\" (click)=\"onChangeImage(paragraph.imagePath ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked, 'one-paragraph':sectionContent.paragraphs.length == 1}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span class=\"paragraph-text\">\n {{paragraph.text}}\n </span>\n </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
510
|
+
ValuePropsSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropsSectionComponent, selector: "value-props-section", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" [ngClass]=\"{'image-text-sort': sectionContent.paragraphProperties.onRightSide , 'text-image-sort': !sectionContent.paragraphProperties.onRightSide ,'paragraph-with-card':sectionContent.paragraphProperties.withCard }\">\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\n </section-title>\n <div class=\"value-prop-image\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n <p *ngFor=\"let paragraph of sectionContent.paragraphs; let j = index\" class=\"paragraph\" (click)=\"onChangeImage(paragraph.imagePath ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked, 'one-paragraph':sectionContent.paragraphs.length == 1}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span class=\"paragraph-text\">\n {{paragraph.text}}\n </span>\n </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;display:grid;grid-template-columns:5rem auto auto;margin:0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem;width:40rem;height:-moz-fit-content;height:fit-content}@media only screen and (max-width: 725px){.value-prop .text-side .paragraph{width:100%;height:auto;padding:2rem 1rem}}.value-prop .text-side .paragraph:hover .paragraph-text,.value-prop .text-side .paragraph:hover .value-prop-icon{color:#32353b}.value-prop .text-side .paragraph .paragraph-text{color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .one-paragraph{width:100%}.value-prop .text-side .selected-paragraph .paragraph-text{color:#32353b}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.value-prop .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:38%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(even){flex-direction:row}.value-prop:nth-child(even) .image-buttons-side{justify-self:center}.value-prop .text-side{width:100%;justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}.image-text-sort{flex-direction:row-reverse}@media only screen and (max-width: 56.25em){.image-text-sort:nth-child(even) .image-buttons-side{justify-self:center}}.text-image-sort{flex-direction:row}.paragraph-with-card .text-side .paragraph{padding:1rem;margin:1rem 0rem;border-radius:.7rem;border:.2rem solid rgba(50,53,59,.1);min-height:max-content;height:15rem}.paragraph-with-card .text-side .paragraph:hover{border:.2rem solid #32353b}.paragraph-with-card .text-side .paragraph .value-prop-icon{text-align:center}.paragraph-with-card .text-side .selected-paragraph{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph .paragraph-text{color:#32353b}.paragraph-with-card .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.paragraph-with-card .text-side .selected-paragraph:hover{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
511
511
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionComponent, decorators: [{
|
|
512
512
|
type: Component,
|
|
513
|
-
args: [{ selector: 'value-props-section', template: "<div class=\"value-prop\" [ngClass]=\"{'image-text-sort': sectionContent.paragraphProperties.onRightSide , 'text-image-sort': !sectionContent.paragraphProperties.onRightSide ,'paragraph-with-card':sectionContent.paragraphProperties.withCard }\">\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\n </section-title>\n <div class=\"value-prop-image\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n <p *ngFor=\"let paragraph of sectionContent.paragraphs; let j = index\" class=\"paragraph\" (click)=\"onChangeImage(paragraph.imagePath ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked, 'one-paragraph':sectionContent.paragraphs.length == 1}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span class=\"paragraph-text\">\n {{paragraph.text}}\n </span>\n </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
513
|
+
args: [{ selector: 'value-props-section', template: "<div class=\"value-prop\" [ngClass]=\"{'image-text-sort': sectionContent.paragraphProperties.onRightSide , 'text-image-sort': !sectionContent.paragraphProperties.onRightSide ,'paragraph-with-card':sectionContent.paragraphProperties.withCard }\">\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\n </section-title>\n <div class=\"value-prop-image\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n <p *ngFor=\"let paragraph of sectionContent.paragraphs; let j = index\" class=\"paragraph\" (click)=\"onChangeImage(paragraph.imagePath ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked, 'one-paragraph':sectionContent.paragraphs.length == 1}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span class=\"paragraph-text\">\n {{paragraph.text}}\n </span>\n </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;display:grid;grid-template-columns:5rem auto auto;margin:0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem;width:40rem;height:-moz-fit-content;height:fit-content}@media only screen and (max-width: 725px){.value-prop .text-side .paragraph{width:100%;height:auto;padding:2rem 1rem}}.value-prop .text-side .paragraph:hover .paragraph-text,.value-prop .text-side .paragraph:hover .value-prop-icon{color:#32353b}.value-prop .text-side .paragraph .paragraph-text{color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .one-paragraph{width:100%}.value-prop .text-side .selected-paragraph .paragraph-text{color:#32353b}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.value-prop .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:38%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(even){flex-direction:row}.value-prop:nth-child(even) .image-buttons-side{justify-self:center}.value-prop .text-side{width:100%;justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}.image-text-sort{flex-direction:row-reverse}@media only screen and (max-width: 56.25em){.image-text-sort:nth-child(even) .image-buttons-side{justify-self:center}}.text-image-sort{flex-direction:row}.paragraph-with-card .text-side .paragraph{padding:1rem;margin:1rem 0rem;border-radius:.7rem;border:.2rem solid rgba(50,53,59,.1);min-height:max-content;height:15rem}.paragraph-with-card .text-side .paragraph:hover{border:.2rem solid #32353b}.paragraph-with-card .text-side .paragraph .value-prop-icon{text-align:center}.paragraph-with-card .text-side .selected-paragraph{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph .paragraph-text{color:#32353b}.paragraph-with-card .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.paragraph-with-card .text-side .selected-paragraph:hover{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4}\n"] }]
|
|
514
514
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
515
515
|
type: Input
|
|
516
516
|
}] } });
|
|
@@ -547,7 +547,7 @@ ChooseCountryWithFlagComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
|
547
547
|
useExisting: forwardRef(() => ChooseCountryWithFlagComponent),
|
|
548
548
|
multi: true
|
|
549
549
|
}
|
|
550
|
-
], ngImport: i0, template: "<div class=\"home\">\n <ng-select (blur)=\"updateBlur()\" class=\"custom\" [items]=\"items\" (change)=\"onSelectionChanged($event)\"\n bindLabel=\"name\" bindValue=\"id\" [(ngModel)]=\"selectedItem\" placeholder=\"Choose Country\">\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n <div class=\"ng-value-label label-container\">\n <mat-icon [svgIcon]=\"item?.code2?.toLowerCase()\"></mat-icon>\n {{item.code2}}\n </div>\n <!-- <span class=\"ng-value-icon right\" (click)=\"clear(item)\" aria-hidden=\"true\">\n \u00D7\n </span> -->\n </ng-template>\n <ng-template ng-option-tmp let-item=\"item\" class=\"options-list\">\n <mat-icon [svgIcon]=\"item?.code2?.toLowerCase()\"></mat-icon>\n <span class=\"country-name\">\n {{(item.name.length>15) ? (item.name | slice:0:15) + '...': item.name}}\n </span>\n </ng-template>\n </ng-select>\n</div>", styles: [".home{width:100%}.home input{margin-right:0vh}.home ng-select{min-width:auto}.home ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input>input{caret-color:transparent}.home ::ng-deep .ng-dropdown-panel.ng-select-bottom{width:25rem}.home ::ng-deep .ng-clear-wrapper .ng-star-inserted{display:none}.home ::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{display:flex;column-gap:1rem;align-items:center!important}.home ::ng-deep .ng-select-container,.home ::ng-deep .ng-has-value{min-height:auto;height:4rem}.home ::ng-deep .ng-select-container .ng-value-container,.home ::ng-deep .ng-has-value .ng-value-container{padding-left:.4rem}.home ::ng-deep .ng-select-container .ng-value-container .ng-value,.home ::ng-deep .ng-select-container .ng-value-container .ng-star-inserted,.home ::ng-deep .ng-has-value .ng-value-container .ng-value,.home ::ng-deep .ng-has-value .ng-value-container .ng-star-inserted{display:inherit;column-gap:1rem;margin-left:.1rem;align-items:center}\n"], dependencies: [{ kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3$
|
|
550
|
+
], ngImport: i0, template: "<div class=\"home\">\n <ng-select (blur)=\"updateBlur()\" class=\"custom\" [items]=\"items\" (change)=\"onSelectionChanged($event)\"\n bindLabel=\"name\" bindValue=\"id\" [(ngModel)]=\"selectedItem\" placeholder=\"Choose Country\">\n <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\n <div class=\"ng-value-label label-container\">\n <mat-icon [svgIcon]=\"item?.code2?.toLowerCase()\"></mat-icon>\n {{item.code2}}\n </div>\n <!-- <span class=\"ng-value-icon right\" (click)=\"clear(item)\" aria-hidden=\"true\">\n \u00D7\n </span> -->\n </ng-template>\n <ng-template ng-option-tmp let-item=\"item\" class=\"options-list\">\n <mat-icon [svgIcon]=\"item?.code2?.toLowerCase()\"></mat-icon>\n <span class=\"country-name\">\n {{(item.name.length>15) ? (item.name | slice:0:15) + '...': item.name}}\n </span>\n </ng-template>\n </ng-select>\n</div>", styles: [".home{width:100%}.home input{margin-right:0vh}.home ng-select{min-width:auto}.home ::ng-deep .ng-select .ng-select-container .ng-value-container .ng-input>input{caret-color:transparent}.home ::ng-deep .ng-dropdown-panel.ng-select-bottom{width:25rem}.home ::ng-deep .ng-clear-wrapper .ng-star-inserted{display:none}.home ::ng-deep .ng-dropdown-panel .ng-dropdown-panel-items .ng-option{display:flex;column-gap:1rem;align-items:center!important}.home ::ng-deep .ng-select-container,.home ::ng-deep .ng-has-value{min-height:auto;height:4rem}.home ::ng-deep .ng-select-container .ng-value-container,.home ::ng-deep .ng-has-value .ng-value-container{padding-left:.4rem}.home ::ng-deep .ng-select-container .ng-value-container .ng-value,.home ::ng-deep .ng-select-container .ng-value-container .ng-star-inserted,.home ::ng-deep .ng-has-value .ng-value-container .ng-value,.home ::ng-deep .ng-has-value .ng-value-container .ng-star-inserted{display:inherit;column-gap:1rem;margin-left:.1rem;align-items:center}\n"], dependencies: [{ kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$4.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i3$4.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i3$4.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "pipe", type: i3.SlicePipe, name: "slice" }] });
|
|
551
551
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ChooseCountryWithFlagComponent, decorators: [{
|
|
552
552
|
type: Component,
|
|
553
553
|
args: [{ selector: 'choose-country-with-flag', providers: [
|
|
@@ -664,12 +664,12 @@ class ContactUsPageComponent {
|
|
|
664
664
|
this.selectedCode = $event.phone;
|
|
665
665
|
}
|
|
666
666
|
}
|
|
667
|
-
ContactUsPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ContactUsPageComponent, deps: [{ token: i1$2.MatDialog }, { token: i1$1.BreakpointObserver }, { token: i3$
|
|
668
|
-
ContactUsPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ContactUsPageComponent, selector: "contact-us-page", inputs: { subjects: "subjects", contactUsPageData: "contactUsPageData", apiPath: "apiPath", items: "items" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"contact-us\">\n <div class=\"left-side\">\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\n <div class=\"img-title\">\n {{contactUsPageData.imageTitle}}\n </div>\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\n </div>\n <div class=\"social-media-icons\">\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\n </div>\n </div>\n </div>\n <div class=\"right-side\">\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\n <div class=\"content\">\n <div class=\"message-box\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\n <div class=\"full-name-area\">\n <div class=\"first-name\">\n <span class=\"fields-labels\">First Name*</span>\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\n </div>\n <div class=\"last-name\">\n <span class=\"fields-labels\">Last Name*</span>\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\n </div>\n </div>\n <span class=\"fields-labels\">Company Name*</span>\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\n <span class=\"fields-labels\">Email*</span>\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\n <span class=\"fields-labels\">Phone Number</span>\n <div class=\"phone-number-section\">\n\n <div class=\"countries-list\">\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\n </div>\n <span class=\"code-section\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\n </span>\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\n </div>\n <div class=\"subject\">\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\n </ng-select>\n </div>\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\n\n\n </textarea>\n <div class=\"actions\">\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\n Submit\n </button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"our-locations-section\">\n <div class=\"locations-content\">\n <div class=\"headline\">\n {{contactUsPageData.locations.headline}}\n </div>\n <div class=\"title\">\n {{contactUsPageData.locations.title}}\n </div>\n <div class=\"lines-img\">\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{contactUsPageData.locations.subtitle}}\n </div>\n <div class=\"addresses\">\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\n [circular]=\"true\">\n <ng-template let-address pTemplate=\"item\">\n <div class=\"address\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n </div>\n </div> -->\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;height:100%;position:relative;padding:2rem}.page .contact-us{box-shadow:#0000001f .1rem .3rem,#0000003d 0 .1rem .2rem;border-radius:1.5rem;margin:auto;width:55%;height:100%;display:grid;grid-template-columns:50% 50%;box-sizing:border-box;margin:5rem auto 15rem}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .right-side{padding:2rem 4rem;display:grid;grid-template-rows:auto auto auto auto;row-gap:1rem}.page .contact-us .right-side .phone-number-section{position:relative;display:flex;gap:.5rem;margin:.5rem 0rem}.page .contact-us .right-side .phone-number-section .countries-list{width:30%}.page .contact-us .right-side .phone-number-section .code-section{width:15%;margin-right:0rem;align-self:center;color:#000;position:relative;display:flex}.page .contact-us .right-side .phone-number-section .code-section *{color:#838b91}.page .contact-us .right-side .phone-number-section .code{text-align:center;height:4rem;width:100%;padding-left:2rem;margin-right:0vh}.page .contact-us .right-side .phone-number-section .code::placeholder{padding-left:1rem}.page .contact-us .right-side .phone-number-section fa-icon{align-self:center;position:absolute;left:.5rem;z-index:2}.page .contact-us .right-side .phone-number-section .phone-num-input{width:55%;margin-right:0rem;height:4rem}.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-outer-spin-button,.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.page .contact-us .right-side .title{font-weight:800;color:#3d3d3d}.page .contact-us .right-side .subtitle{font-weight:500;font-size:1.9rem;color:#3d3d3d;padding:1rem 0rem}.page .contact-us .right-side .content{display:grid;grid-template-rows:auto auto auto auto}.page .contact-us .right-side .content .message-box{grid-row:1/span 2}.page .contact-us .right-side .content .message-box .text-area{height:15rem;resize:none;border-radius:.5rem;border:rgb(190,188,188) .1rem solid}.page .contact-us .right-side .content .message-box .text-area::placeholder{font-weight:500;color:#9e9e9e;font-size:1.2rem}.page .contact-us .right-side .content .message-box .text-area:focus-visible{outline:none}.page .contact-us .right-side .content .message-box .actions{margin:1rem 0rem}.page .contact-us .right-side .content .message-box .actions button{background-color:#155ed4;font-weight:500;font-size:1.4rem;border-radius:.3rem}.page .contact-us .right-side .content .message-box .input,.page .contact-us .right-side .content .message-box textarea{margin:1rem 0rem;width:100%;background-color:#fff}.page .contact-us .left-side{height:100%;position:relative;color:#fff}.page .contact-us .left-side .img-title{position:absolute;top:5%;left:calc(2% + 2rem);font-weight:700;font-size:3.6rem}.page .contact-us .left-side .bottom-img-side{position:absolute;top:75%;left:calc(2% + 2rem);margin:2rem 9rem 0rem 0rem}.page .contact-us .left-side .bottom-img-side .logo{width:20rem;height:4rem}.page .contact-us .left-side .bottom-img-side .logo img{width:10rem;height:4rem}.page .contact-us .left-side .bottom-img-side .img-description{margin-top:2rem}.page .contact-us .left-side .bg-image{width:100%;height:100%;border-radius:1.5rem 0rem 0rem 1.5rem}@media only screen and (max-width: 75em){.page .contact-us .left-side .bg-image{border-radius:1.5rem}}.page .carousel{display:none}.page .flexy{display:flex}.page .our-locations-section{width:100%;background-color:#26518b;padding:1.5rem;color:#fff}.page .our-locations-section .locations-content{width:95%;margin:auto}.page .our-locations-section .locations-content .headline{font-weight:500;font-size:2rem}.page .our-locations-section .locations-content .title{font-weight:700;padding:1rem 0rem;font-size:4rem}.page .our-locations-section .locations-content .subtitle{font-weight:500;padding:1rem 0rem}.page .our-locations-section .locations-content .lines-img{padding:1rem 0rem}.page .our-locations-section .locations-content .addresses{width:100%;display:flex;flex-direction:row;column-gap:2%}.page .our-locations-section .locations-content .addresses .address{flex-direction:column;row-gap:.7rem;width:22%;padding:1.5rem 0rem}.page .our-locations-section .locations-content .addresses .address .address-header{display:flex;flex-direction:column;row-gap:.7rem}.page .our-locations-section .locations-content .addresses .address .address-header img{width:3rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:1.9rem;font-weight:500}.page .our-locations-section .locations-content .addresses .address .location-area{width:95%}@media only screen and (min-width: 112.5em){.page .title{font-size:4.5rem}.page .contact-us{width:65%}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100%}}@media only screen and (max-width: 112.5em){.page .contact-us{width:75%;box-sizing:border-box}.page .contact-us .title{font-size:3.4rem}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100rem;border-radius:0rem 1.5rem 1.5rem 0rem}}@media only screen and (max-width: 112.5em) and (max-width: 1350px){.page .contact-us{width:80%}}@media only screen and (max-width: 112.5em) and (max-width: 1280px){.page .contact-us{width:86%}}@media only screen and (max-width: 1401px) and (min-width: 1201px){.page .our-locations-section .locations-content{width:auto}}@media only screen and (max-width: 75em){.page .contact-us{display:flex;flex-direction:column;top:3vh;width:100%;height:107rem;padding:5vh 2rem 10vh 2rem}.page .contact-us .right-side{padding:3rem 2rem;display:flex;flex-direction:column;height:80%}.page .contact-us .right-side .mat-mdc-card-content{display:block;padding:0 .2rem}.page .contact-us .left-side{height:25%}.page .contact-us .left-side .img-title{color:#fff}.page .contact-us .left-side img{height:100%;object-position:0rem -13rem;border-radius:1.5rem}.page .carousel{display:block;width:100%}.page .flexy{display:none}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{font-size:1.8rem;width:31rem;margin:auto;text-align:center;background-color:#fff;color:#26518b;height:27rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2rem;margin-bottom:1rem}.page .mat-mdc-card{box-shadow:none}}@media only screen and (max-width: 37.5em){.page .contact-us{height:auto;padding:5vh 2rem 0vh 2rem}.page .contact-us .full-name-area{display:block}.page .contact-us .first-name,.page .contact-us .last-name{width:100%}.page .contact-us .left-side{height:12rem}.page .contact-us .left-side .img-title{font-weight:600;font-size:3rem}.page .contact-us .left-side img{object-position:0rem -5rem}.page .contact-us .right-side .phone-number-section{flex-wrap:wrap}.page .contact-us .right-side .phone-number-section .countries-list{width:100%}.page .contact-us .right-side .phone-number-section .code-section{width:9rem}.page .contact-us .right-side .phone-number-section .phone-num-input{width:calc(100% - 9.5rem)}.page .our-locations-section .locations-content .addresses .address{width:27rem}}@media only screen and (max-width: 400px){.page .contact-us .left-side{height:10rem}.page .contact-us .left-side .img-title{font-weight:500;font-size:2.6rem}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{width:24.5rem;height:28rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2.2rem;margin-bottom:1rem;padding:0rem .4rem}.page .our-locations-section .locations-content .addresses .address .building,.page .our-locations-section .locations-content .addresses .address .location-area{padding:0rem .4rem}}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev:focus,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next:focus{outline:0 none;box-shadow:0 0 0 .2rem transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next{width:4rem;height:4rem;background-color:transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-icon{color:#fff;width:2rem;height:2rem}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#fff;width:2.7rem;transition:all ease-in-out .1s}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"], dependencies: [{ kind: "component", type: i2$1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }, { kind: "component", type: ChooseCountryWithFlagComponent, selector: "choose-country-with-flag", inputs: ["items"], outputs: ["change"] }] });
|
|
667
|
+
ContactUsPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ContactUsPageComponent, deps: [{ token: i1$2.MatDialog }, { token: i1$1.BreakpointObserver }, { token: i3$3.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
668
|
+
ContactUsPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ContactUsPageComponent, selector: "contact-us-page", inputs: { subjects: "subjects", contactUsPageData: "contactUsPageData", apiPath: "apiPath", items: "items" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"contact-us\">\n <div class=\"left-side\">\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\n <div class=\"img-title\">\n {{contactUsPageData.imageTitle}}\n </div>\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\n </div>\n <div class=\"social-media-icons\">\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\n </div>\n </div>\n </div>\n <div class=\"right-side\">\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\n <div class=\"content\">\n <div class=\"message-box\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\n <div class=\"full-name-area\">\n <div class=\"first-name\">\n <span class=\"fields-labels\">First Name*</span>\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\n </div>\n <div class=\"last-name\">\n <span class=\"fields-labels\">Last Name*</span>\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\n </div>\n </div>\n <span class=\"fields-labels\">Company Name*</span>\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\n <span class=\"fields-labels\">Email*</span>\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\n <span class=\"fields-labels\">Phone Number</span>\n <div class=\"phone-number-section\">\n\n <div class=\"countries-list\">\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\n </div>\n <span class=\"code-section\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\n </span>\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\n </div>\n <div class=\"subject\">\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\n </ng-select>\n </div>\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\n\n\n </textarea>\n <div class=\"actions\">\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\n Submit\n </button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"our-locations-section\">\n <div class=\"locations-content\">\n <div class=\"headline\">\n {{contactUsPageData.locations.headline}}\n </div>\n <div class=\"title\">\n {{contactUsPageData.locations.title}}\n </div>\n <div class=\"lines-img\">\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{contactUsPageData.locations.subtitle}}\n </div>\n <div class=\"addresses\">\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\n [circular]=\"true\">\n <ng-template let-address pTemplate=\"item\">\n <div class=\"address\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n </div>\n </div> -->\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;height:100%;position:relative;padding:2rem}.page .contact-us{box-shadow:#0000001f .1rem .3rem,#0000003d 0 .1rem .2rem;border-radius:1.5rem;margin:auto;width:55%;height:100%;display:grid;grid-template-columns:50% 50%;box-sizing:border-box;margin:5rem auto 15rem}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .right-side{padding:2rem 4rem;display:grid;grid-template-rows:auto auto auto auto;row-gap:1rem}.page .contact-us .right-side .phone-number-section{position:relative;display:flex;gap:.5rem;margin:.5rem 0rem}.page .contact-us .right-side .phone-number-section .countries-list{width:30%}.page .contact-us .right-side .phone-number-section .code-section{width:15%;margin-right:0rem;align-self:center;color:#000;position:relative;display:flex}.page .contact-us .right-side .phone-number-section .code-section *{color:#838b91}.page .contact-us .right-side .phone-number-section .code{text-align:center;height:4rem;width:100%;padding-left:2rem;margin-right:0vh}.page .contact-us .right-side .phone-number-section .code::placeholder{padding-left:1rem}.page .contact-us .right-side .phone-number-section fa-icon{align-self:center;position:absolute;left:.5rem;z-index:2}.page .contact-us .right-side .phone-number-section .phone-num-input{width:55%;margin-right:0rem;height:4rem}.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-outer-spin-button,.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.page .contact-us .right-side .title{font-weight:800;color:#3d3d3d}.page .contact-us .right-side .subtitle{font-weight:500;font-size:1.9rem;color:#3d3d3d;padding:1rem 0rem}.page .contact-us .right-side .content{display:grid;grid-template-rows:auto auto auto auto}.page .contact-us .right-side .content .message-box{grid-row:1/span 2}.page .contact-us .right-side .content .message-box .text-area{height:15rem;resize:none;border-radius:.5rem;border:rgb(190,188,188) .1rem solid}.page .contact-us .right-side .content .message-box .text-area::placeholder{font-weight:500;color:#9e9e9e;font-size:1.2rem}.page .contact-us .right-side .content .message-box .text-area:focus-visible{outline:none}.page .contact-us .right-side .content .message-box .actions{margin:1rem 0rem}.page .contact-us .right-side .content .message-box .actions button{background-color:#155ed4;font-weight:500;font-size:1.4rem;border-radius:.3rem}.page .contact-us .right-side .content .message-box .input,.page .contact-us .right-side .content .message-box textarea{margin:1rem 0rem;width:100%;background-color:#fff}.page .contact-us .left-side{height:100%;position:relative;color:#fff}.page .contact-us .left-side .img-title{position:absolute;top:5%;left:calc(2% + 2rem);font-weight:700;font-size:3.6rem}.page .contact-us .left-side .bottom-img-side{position:absolute;top:75%;left:calc(2% + 2rem);margin:2rem 9rem 0rem 0rem}.page .contact-us .left-side .bottom-img-side .logo{width:20rem;height:4rem}.page .contact-us .left-side .bottom-img-side .logo img{width:10rem;height:4rem}.page .contact-us .left-side .bottom-img-side .img-description{margin-top:2rem}.page .contact-us .left-side .bg-image{width:100%;height:100%;border-radius:1.5rem 0rem 0rem 1.5rem}@media only screen and (max-width: 75em){.page .contact-us .left-side .bg-image{border-radius:1.5rem}}.page .carousel{display:none}.page .flexy{display:flex}.page .our-locations-section{width:100%;background-color:#26518b;padding:1.5rem;color:#fff}.page .our-locations-section .locations-content{width:95%;margin:auto}.page .our-locations-section .locations-content .headline{font-weight:500;font-size:2rem}.page .our-locations-section .locations-content .title{font-weight:700;padding:1rem 0rem;font-size:4rem}.page .our-locations-section .locations-content .subtitle{font-weight:500;padding:1rem 0rem}.page .our-locations-section .locations-content .lines-img{padding:1rem 0rem}.page .our-locations-section .locations-content .addresses{width:100%;display:flex;flex-direction:row;column-gap:2%}.page .our-locations-section .locations-content .addresses .address{flex-direction:column;row-gap:.7rem;width:22%;padding:1.5rem 0rem}.page .our-locations-section .locations-content .addresses .address .address-header{display:flex;flex-direction:column;row-gap:.7rem}.page .our-locations-section .locations-content .addresses .address .address-header img{width:3rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:1.9rem;font-weight:500}.page .our-locations-section .locations-content .addresses .address .location-area{width:95%}@media only screen and (min-width: 112.5em){.page .title{font-size:4.5rem}.page .contact-us{width:65%}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100%}}@media only screen and (max-width: 112.5em){.page .contact-us{width:75%;box-sizing:border-box}.page .contact-us .title{font-size:3.4rem}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100rem;border-radius:0rem 1.5rem 1.5rem 0rem}}@media only screen and (max-width: 112.5em) and (max-width: 1350px){.page .contact-us{width:80%}}@media only screen and (max-width: 112.5em) and (max-width: 1280px){.page .contact-us{width:86%}}@media only screen and (max-width: 1401px) and (min-width: 1201px){.page .our-locations-section .locations-content{width:auto}}@media only screen and (max-width: 75em){.page .contact-us{display:flex;flex-direction:column;top:3vh;width:100%;height:107rem;padding:5vh 2rem 10vh 2rem}.page .contact-us .right-side{padding:3rem 2rem;display:flex;flex-direction:column;height:80%}.page .contact-us .right-side .mat-mdc-card-content{display:block;padding:0 .2rem}.page .contact-us .left-side{height:25%}.page .contact-us .left-side .img-title{color:#fff}.page .contact-us .left-side img{height:100%;object-position:0rem -13rem;border-radius:1.5rem}.page .carousel{display:block;width:100%}.page .flexy{display:none}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{font-size:1.8rem;width:31rem;margin:auto;text-align:center;background-color:#fff;color:#26518b;height:27rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2rem;margin-bottom:1rem}.page .mat-mdc-card{box-shadow:none}}@media only screen and (max-width: 37.5em){.page .contact-us{height:auto;padding:5vh 2rem 0vh 2rem}.page .contact-us .full-name-area{display:block}.page .contact-us .first-name,.page .contact-us .last-name{width:100%}.page .contact-us .left-side{height:12rem}.page .contact-us .left-side .img-title{font-weight:600;font-size:3rem}.page .contact-us .left-side img{object-position:0rem -5rem}.page .contact-us .right-side .phone-number-section{flex-wrap:wrap}.page .contact-us .right-side .phone-number-section .countries-list{width:100%}.page .contact-us .right-side .phone-number-section .code-section{width:9rem}.page .contact-us .right-side .phone-number-section .phone-num-input{width:calc(100% - 9.5rem)}.page .our-locations-section .locations-content .addresses .address{width:27rem}}@media only screen and (max-width: 400px){.page .contact-us .left-side{height:10rem}.page .contact-us .left-side .img-title{font-weight:500;font-size:2.6rem}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{width:24.5rem;height:28rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2.2rem;margin-bottom:1rem;padding:0rem .4rem}.page .our-locations-section .locations-content .addresses .address .building,.page .our-locations-section .locations-content .addresses .address .location-area{padding:0rem .4rem}}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev:focus,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next:focus{outline:0 none;box-shadow:0 0 0 .2rem transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next{width:4rem;height:4rem;background-color:transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-icon{color:#fff;width:2rem;height:2rem}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#fff;width:2.7rem;transition:all ease-in-out .1s}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$3.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: i3$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i3$4.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }, { kind: "component", type: ChooseCountryWithFlagComponent, selector: "choose-country-with-flag", inputs: ["items"], outputs: ["change"] }] });
|
|
669
669
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ContactUsPageComponent, decorators: [{
|
|
670
670
|
type: Component,
|
|
671
|
-
args: [{ selector: 'contact-us-page', template: "<div class=\"page\">\n <div class=\"contact-us\">\n <div class=\"left-side\">\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\n <div class=\"img-title\">\n {{contactUsPageData.imageTitle}}\n </div>\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\n </div>\n <div class=\"social-media-icons\">\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\n </div>\n </div>\n </div>\n <div class=\"right-side\">\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\n <div class=\"content\">\n <div class=\"message-box\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\n <div class=\"full-name-area\">\n <div class=\"first-name\">\n <span class=\"fields-labels\">First Name*</span>\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\n </div>\n <div class=\"last-name\">\n <span class=\"fields-labels\">Last Name*</span>\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\n </div>\n </div>\n <span class=\"fields-labels\">Company Name*</span>\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\n <span class=\"fields-labels\">Email*</span>\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\n <span class=\"fields-labels\">Phone Number</span>\n <div class=\"phone-number-section\">\n\n <div class=\"countries-list\">\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\n </div>\n <span class=\"code-section\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\n </span>\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\n </div>\n <div class=\"subject\">\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\n </ng-select>\n </div>\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\n\n\n </textarea>\n <div class=\"actions\">\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\n Submit\n </button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"our-locations-section\">\n <div class=\"locations-content\">\n <div class=\"headline\">\n {{contactUsPageData.locations.headline}}\n </div>\n <div class=\"title\">\n {{contactUsPageData.locations.title}}\n </div>\n <div class=\"lines-img\">\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{contactUsPageData.locations.subtitle}}\n </div>\n <div class=\"addresses\">\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\n [circular]=\"true\">\n <ng-template let-address pTemplate=\"item\">\n <div class=\"address\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n </div>\n </div> -->\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;height:100%;position:relative;padding:2rem}.page .contact-us{box-shadow:#0000001f .1rem .3rem,#0000003d 0 .1rem .2rem;border-radius:1.5rem;margin:auto;width:55%;height:100%;display:grid;grid-template-columns:50% 50%;box-sizing:border-box;margin:5rem auto 15rem}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .right-side{padding:2rem 4rem;display:grid;grid-template-rows:auto auto auto auto;row-gap:1rem}.page .contact-us .right-side .phone-number-section{position:relative;display:flex;gap:.5rem;margin:.5rem 0rem}.page .contact-us .right-side .phone-number-section .countries-list{width:30%}.page .contact-us .right-side .phone-number-section .code-section{width:15%;margin-right:0rem;align-self:center;color:#000;position:relative;display:flex}.page .contact-us .right-side .phone-number-section .code-section *{color:#838b91}.page .contact-us .right-side .phone-number-section .code{text-align:center;height:4rem;width:100%;padding-left:2rem;margin-right:0vh}.page .contact-us .right-side .phone-number-section .code::placeholder{padding-left:1rem}.page .contact-us .right-side .phone-number-section fa-icon{align-self:center;position:absolute;left:.5rem;z-index:2}.page .contact-us .right-side .phone-number-section .phone-num-input{width:55%;margin-right:0rem;height:4rem}.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-outer-spin-button,.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.page .contact-us .right-side .title{font-weight:800;color:#3d3d3d}.page .contact-us .right-side .subtitle{font-weight:500;font-size:1.9rem;color:#3d3d3d;padding:1rem 0rem}.page .contact-us .right-side .content{display:grid;grid-template-rows:auto auto auto auto}.page .contact-us .right-side .content .message-box{grid-row:1/span 2}.page .contact-us .right-side .content .message-box .text-area{height:15rem;resize:none;border-radius:.5rem;border:rgb(190,188,188) .1rem solid}.page .contact-us .right-side .content .message-box .text-area::placeholder{font-weight:500;color:#9e9e9e;font-size:1.2rem}.page .contact-us .right-side .content .message-box .text-area:focus-visible{outline:none}.page .contact-us .right-side .content .message-box .actions{margin:1rem 0rem}.page .contact-us .right-side .content .message-box .actions button{background-color:#155ed4;font-weight:500;font-size:1.4rem;border-radius:.3rem}.page .contact-us .right-side .content .message-box .input,.page .contact-us .right-side .content .message-box textarea{margin:1rem 0rem;width:100%;background-color:#fff}.page .contact-us .left-side{height:100%;position:relative;color:#fff}.page .contact-us .left-side .img-title{position:absolute;top:5%;left:calc(2% + 2rem);font-weight:700;font-size:3.6rem}.page .contact-us .left-side .bottom-img-side{position:absolute;top:75%;left:calc(2% + 2rem);margin:2rem 9rem 0rem 0rem}.page .contact-us .left-side .bottom-img-side .logo{width:20rem;height:4rem}.page .contact-us .left-side .bottom-img-side .logo img{width:10rem;height:4rem}.page .contact-us .left-side .bottom-img-side .img-description{margin-top:2rem}.page .contact-us .left-side .bg-image{width:100%;height:100%;border-radius:1.5rem 0rem 0rem 1.5rem}@media only screen and (max-width: 75em){.page .contact-us .left-side .bg-image{border-radius:1.5rem}}.page .carousel{display:none}.page .flexy{display:flex}.page .our-locations-section{width:100%;background-color:#26518b;padding:1.5rem;color:#fff}.page .our-locations-section .locations-content{width:95%;margin:auto}.page .our-locations-section .locations-content .headline{font-weight:500;font-size:2rem}.page .our-locations-section .locations-content .title{font-weight:700;padding:1rem 0rem;font-size:4rem}.page .our-locations-section .locations-content .subtitle{font-weight:500;padding:1rem 0rem}.page .our-locations-section .locations-content .lines-img{padding:1rem 0rem}.page .our-locations-section .locations-content .addresses{width:100%;display:flex;flex-direction:row;column-gap:2%}.page .our-locations-section .locations-content .addresses .address{flex-direction:column;row-gap:.7rem;width:22%;padding:1.5rem 0rem}.page .our-locations-section .locations-content .addresses .address .address-header{display:flex;flex-direction:column;row-gap:.7rem}.page .our-locations-section .locations-content .addresses .address .address-header img{width:3rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:1.9rem;font-weight:500}.page .our-locations-section .locations-content .addresses .address .location-area{width:95%}@media only screen and (min-width: 112.5em){.page .title{font-size:4.5rem}.page .contact-us{width:65%}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100%}}@media only screen and (max-width: 112.5em){.page .contact-us{width:75%;box-sizing:border-box}.page .contact-us .title{font-size:3.4rem}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100rem;border-radius:0rem 1.5rem 1.5rem 0rem}}@media only screen and (max-width: 112.5em) and (max-width: 1350px){.page .contact-us{width:80%}}@media only screen and (max-width: 112.5em) and (max-width: 1280px){.page .contact-us{width:86%}}@media only screen and (max-width: 1401px) and (min-width: 1201px){.page .our-locations-section .locations-content{width:auto}}@media only screen and (max-width: 75em){.page .contact-us{display:flex;flex-direction:column;top:3vh;width:100%;height:107rem;padding:5vh 2rem 10vh 2rem}.page .contact-us .right-side{padding:3rem 2rem;display:flex;flex-direction:column;height:80%}.page .contact-us .right-side .mat-mdc-card-content{display:block;padding:0 .2rem}.page .contact-us .left-side{height:25%}.page .contact-us .left-side .img-title{color:#fff}.page .contact-us .left-side img{height:100%;object-position:0rem -13rem;border-radius:1.5rem}.page .carousel{display:block;width:100%}.page .flexy{display:none}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{font-size:1.8rem;width:31rem;margin:auto;text-align:center;background-color:#fff;color:#26518b;height:27rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2rem;margin-bottom:1rem}.page .mat-mdc-card{box-shadow:none}}@media only screen and (max-width: 37.5em){.page .contact-us{height:auto;padding:5vh 2rem 0vh 2rem}.page .contact-us .full-name-area{display:block}.page .contact-us .first-name,.page .contact-us .last-name{width:100%}.page .contact-us .left-side{height:12rem}.page .contact-us .left-side .img-title{font-weight:600;font-size:3rem}.page .contact-us .left-side img{object-position:0rem -5rem}.page .contact-us .right-side .phone-number-section{flex-wrap:wrap}.page .contact-us .right-side .phone-number-section .countries-list{width:100%}.page .contact-us .right-side .phone-number-section .code-section{width:9rem}.page .contact-us .right-side .phone-number-section .phone-num-input{width:calc(100% - 9.5rem)}.page .our-locations-section .locations-content .addresses .address{width:27rem}}@media only screen and (max-width: 400px){.page .contact-us .left-side{height:10rem}.page .contact-us .left-side .img-title{font-weight:500;font-size:2.6rem}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{width:24.5rem;height:28rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2.2rem;margin-bottom:1rem;padding:0rem .4rem}.page .our-locations-section .locations-content .addresses .address .building,.page .our-locations-section .locations-content .addresses .address .location-area{padding:0rem .4rem}}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev:focus,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next:focus{outline:0 none;box-shadow:0 0 0 .2rem transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next{width:4rem;height:4rem;background-color:transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-icon{color:#fff;width:2rem;height:2rem}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#fff;width:2.7rem;transition:all ease-in-out .1s}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"] }]
|
|
672
|
-
}], ctorParameters: function () { return [{ type: i1$2.MatDialog }, { type: i1$1.BreakpointObserver }, { type: i3$
|
|
671
|
+
args: [{ selector: 'contact-us-page', template: "<div class=\"page\">\n <div class=\"contact-us\">\n <div class=\"left-side\">\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\n <div class=\"img-title\">\n {{contactUsPageData.imageTitle}}\n </div>\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\n </div>\n <div class=\"social-media-icons\">\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\n </div>\n </div>\n </div>\n <div class=\"right-side\">\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\n <div class=\"content\">\n <div class=\"message-box\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\n <div class=\"full-name-area\">\n <div class=\"first-name\">\n <span class=\"fields-labels\">First Name*</span>\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\n </div>\n <div class=\"last-name\">\n <span class=\"fields-labels\">Last Name*</span>\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\n </div>\n </div>\n <span class=\"fields-labels\">Company Name*</span>\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\n <span class=\"fields-labels\">Email*</span>\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\n <span class=\"fields-labels\">Phone Number</span>\n <div class=\"phone-number-section\">\n\n <div class=\"countries-list\">\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\n </div>\n <span class=\"code-section\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\n </span>\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\n </div>\n <div class=\"subject\">\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\n </ng-select>\n </div>\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\n\n\n </textarea>\n <div class=\"actions\">\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\n Submit\n </button>\n </div>\n </form>\n </div>\n </div>\n </div>\n </div>\n <!-- <div class=\"our-locations-section\">\n <div class=\"locations-content\">\n <div class=\"headline\">\n {{contactUsPageData.locations.headline}}\n </div>\n <div class=\"title\">\n {{contactUsPageData.locations.title}}\n </div>\n <div class=\"lines-img\">\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{contactUsPageData.locations.subtitle}}\n </div>\n <div class=\"addresses\">\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\n [circular]=\"true\">\n <ng-template let-address pTemplate=\"item\">\n <div class=\"address\">\n <div class=\"address-header\">\n <div class=\"icon\">\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\n </div>\n <div class=\"location-name\">\n {{address.name}}\n </div>\n </div>\n <div class=\"building\">\n {{address.building}}\n </div>\n <div class=\"location-area\">\n {{address.locationArea}}\n </div>\n <div class=\"hours\">\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\n {{address.hours}}\n </div>\n <div class=\"cellular-number\">\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\n {{address.phoneNumber}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n </div>\n </div> -->\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;height:100%;position:relative;padding:2rem}.page .contact-us{box-shadow:#0000001f .1rem .3rem,#0000003d 0 .1rem .2rem;border-radius:1.5rem;margin:auto;width:55%;height:100%;display:grid;grid-template-columns:50% 50%;box-sizing:border-box;margin:5rem auto 15rem}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .right-side{padding:2rem 4rem;display:grid;grid-template-rows:auto auto auto auto;row-gap:1rem}.page .contact-us .right-side .phone-number-section{position:relative;display:flex;gap:.5rem;margin:.5rem 0rem}.page .contact-us .right-side .phone-number-section .countries-list{width:30%}.page .contact-us .right-side .phone-number-section .code-section{width:15%;margin-right:0rem;align-self:center;color:#000;position:relative;display:flex}.page .contact-us .right-side .phone-number-section .code-section *{color:#838b91}.page .contact-us .right-side .phone-number-section .code{text-align:center;height:4rem;width:100%;padding-left:2rem;margin-right:0vh}.page .contact-us .right-side .phone-number-section .code::placeholder{padding-left:1rem}.page .contact-us .right-side .phone-number-section fa-icon{align-self:center;position:absolute;left:.5rem;z-index:2}.page .contact-us .right-side .phone-number-section .phone-num-input{width:55%;margin-right:0rem;height:4rem}.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-outer-spin-button,.page .contact-us .right-side .phone-number-section .phone-num-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.page .contact-us .right-side .title{font-weight:800;color:#3d3d3d}.page .contact-us .right-side .subtitle{font-weight:500;font-size:1.9rem;color:#3d3d3d;padding:1rem 0rem}.page .contact-us .right-side .content{display:grid;grid-template-rows:auto auto auto auto}.page .contact-us .right-side .content .message-box{grid-row:1/span 2}.page .contact-us .right-side .content .message-box .text-area{height:15rem;resize:none;border-radius:.5rem;border:rgb(190,188,188) .1rem solid}.page .contact-us .right-side .content .message-box .text-area::placeholder{font-weight:500;color:#9e9e9e;font-size:1.2rem}.page .contact-us .right-side .content .message-box .text-area:focus-visible{outline:none}.page .contact-us .right-side .content .message-box .actions{margin:1rem 0rem}.page .contact-us .right-side .content .message-box .actions button{background-color:#155ed4;font-weight:500;font-size:1.4rem;border-radius:.3rem}.page .contact-us .right-side .content .message-box .input,.page .contact-us .right-side .content .message-box textarea{margin:1rem 0rem;width:100%;background-color:#fff}.page .contact-us .left-side{height:100%;position:relative;color:#fff}.page .contact-us .left-side .img-title{position:absolute;top:5%;left:calc(2% + 2rem);font-weight:700;font-size:3.6rem}.page .contact-us .left-side .bottom-img-side{position:absolute;top:75%;left:calc(2% + 2rem);margin:2rem 9rem 0rem 0rem}.page .contact-us .left-side .bottom-img-side .logo{width:20rem;height:4rem}.page .contact-us .left-side .bottom-img-side .logo img{width:10rem;height:4rem}.page .contact-us .left-side .bottom-img-side .img-description{margin-top:2rem}.page .contact-us .left-side .bg-image{width:100%;height:100%;border-radius:1.5rem 0rem 0rem 1.5rem}@media only screen and (max-width: 75em){.page .contact-us .left-side .bg-image{border-radius:1.5rem}}.page .carousel{display:none}.page .flexy{display:flex}.page .our-locations-section{width:100%;background-color:#26518b;padding:1.5rem;color:#fff}.page .our-locations-section .locations-content{width:95%;margin:auto}.page .our-locations-section .locations-content .headline{font-weight:500;font-size:2rem}.page .our-locations-section .locations-content .title{font-weight:700;padding:1rem 0rem;font-size:4rem}.page .our-locations-section .locations-content .subtitle{font-weight:500;padding:1rem 0rem}.page .our-locations-section .locations-content .lines-img{padding:1rem 0rem}.page .our-locations-section .locations-content .addresses{width:100%;display:flex;flex-direction:row;column-gap:2%}.page .our-locations-section .locations-content .addresses .address{flex-direction:column;row-gap:.7rem;width:22%;padding:1.5rem 0rem}.page .our-locations-section .locations-content .addresses .address .address-header{display:flex;flex-direction:column;row-gap:.7rem}.page .our-locations-section .locations-content .addresses .address .address-header img{width:3rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:1.9rem;font-weight:500}.page .our-locations-section .locations-content .addresses .address .location-area{width:95%}@media only screen and (min-width: 112.5em){.page .title{font-size:4.5rem}.page .contact-us{width:65%}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100%}}@media only screen and (max-width: 112.5em){.page .contact-us{width:75%;box-sizing:border-box}.page .contact-us .title{font-size:3.4rem}.page .contact-us .full-name-area{display:flex;column-gap:5%}.page .contact-us .first-name,.page .contact-us .last-name{width:47.5%}.page .contact-us .left-side{height:100%}.page .contact-us .left-side img{object-fit:cover;box-sizing:border-box;width:100%;height:100rem;border-radius:0rem 1.5rem 1.5rem 0rem}}@media only screen and (max-width: 112.5em) and (max-width: 1350px){.page .contact-us{width:80%}}@media only screen and (max-width: 112.5em) and (max-width: 1280px){.page .contact-us{width:86%}}@media only screen and (max-width: 1401px) and (min-width: 1201px){.page .our-locations-section .locations-content{width:auto}}@media only screen and (max-width: 75em){.page .contact-us{display:flex;flex-direction:column;top:3vh;width:100%;height:107rem;padding:5vh 2rem 10vh 2rem}.page .contact-us .right-side{padding:3rem 2rem;display:flex;flex-direction:column;height:80%}.page .contact-us .right-side .mat-mdc-card-content{display:block;padding:0 .2rem}.page .contact-us .left-side{height:25%}.page .contact-us .left-side .img-title{color:#fff}.page .contact-us .left-side img{height:100%;object-position:0rem -13rem;border-radius:1.5rem}.page .carousel{display:block;width:100%}.page .flexy{display:none}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{font-size:1.8rem;width:31rem;margin:auto;text-align:center;background-color:#fff;color:#26518b;height:27rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2rem;margin-bottom:1rem}.page .mat-mdc-card{box-shadow:none}}@media only screen and (max-width: 37.5em){.page .contact-us{height:auto;padding:5vh 2rem 0vh 2rem}.page .contact-us .full-name-area{display:block}.page .contact-us .first-name,.page .contact-us .last-name{width:100%}.page .contact-us .left-side{height:12rem}.page .contact-us .left-side .img-title{font-weight:600;font-size:3rem}.page .contact-us .left-side img{object-position:0rem -5rem}.page .contact-us .right-side .phone-number-section{flex-wrap:wrap}.page .contact-us .right-side .phone-number-section .countries-list{width:100%}.page .contact-us .right-side .phone-number-section .code-section{width:9rem}.page .contact-us .right-side .phone-number-section .phone-num-input{width:calc(100% - 9.5rem)}.page .our-locations-section .locations-content .addresses .address{width:27rem}}@media only screen and (max-width: 400px){.page .contact-us .left-side{height:10rem}.page .contact-us .left-side .img-title{font-weight:500;font-size:2.6rem}.page .our-locations-section .locations-content .addresses{width:100%}.page .our-locations-section .locations-content .addresses .address{width:24.5rem;height:28rem;border-radius:1rem}.page .our-locations-section .locations-content .addresses .address .address-header .location-name{font-size:2.2rem;margin-bottom:1rem;padding:0rem .4rem}.page .our-locations-section .locations-content .addresses .address .building,.page .our-locations-section .locations-content .addresses .address .location-area{padding:0rem .4rem}}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev:focus,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next:focus{outline:0 none;box-shadow:0 0 0 .2rem transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-prev,.page ::ng-deep .p-carousel .p-carousel-content .p-carousel-next{width:4rem;height:4rem;background-color:transparent}.page ::ng-deep .p-carousel .p-carousel-content .p-icon{color:#fff;width:2rem;height:2rem}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#fff;width:2.7rem;transition:all ease-in-out .1s}.page ::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"] }]
|
|
672
|
+
}], ctorParameters: function () { return [{ type: i1$2.MatDialog }, { type: i1$1.BreakpointObserver }, { type: i3$3.FormBuilder }]; }, propDecorators: { subjects: [{
|
|
673
673
|
type: Input
|
|
674
674
|
}], contactUsPageData: [{
|
|
675
675
|
type: Input
|
|
@@ -690,10 +690,10 @@ class PageSectionStyleThreeComponent {
|
|
|
690
690
|
}
|
|
691
691
|
}
|
|
692
692
|
PageSectionStyleThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
693
|
-
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { pageSection: "pageSection" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"valueprop.sectionTitle\" >\n </section-title>\n <div class=\"optional-button\">\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.route\"\n (click)=\"onClickValuePropButton(valueprop.route)\">\n Click Me\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
693
|
+
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { pageSection: "pageSection" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"valueprop.sectionTitle\" >\n </section-title>\n <div class=\"optional-button\">\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.route\"\n (click)=\"onClickValuePropButton(valueprop.route)\">\n Click Me\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{row-gap:5rem;display:grid;justify-items:center;padding:0rem}.page .section{margin:0rem;padding:2rem 0;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;flex-direction:row;column-gap:4%;width:90%}@media only screen and (min-width: 1500px){.page .section{padding:5rem 0%}.page .section .section-container{max-width:150rem}}.page .section:nth-child(even){background-color:#f3f6f8}.page .section:nth-child(even) .section-container{flex-direction:row-reverse}.page .section .text-side{margin:auto;width:53%;padding:2rem 0rem;text-align:left}.page .section .text-side .title{font-size:3.2rem;font-weight:600;padding:1rem 0rem}.page .section .text-side .optional-button{margin-top:2rem}.page .section .text-side .optional-button button{padding:1rem;background-color:#155ed4;color:#fff}.page .section .image-side{border-radius:1.5rem;width:43%;height:35rem;box-shadow:0 .1rem .5rem #00000040}.page .section .image-side img{border-radius:1.5rem;width:100%;height:100%;object-fit:cover}@media only screen and (max-width: 75em){.page{row-gap:2rem}.page .section .section-container{flex-direction:column}.page .section .section-container .image-side{margin:1rem auto;width:40%}.page .section .section-container .image-side img,.page .section .section-container .text-side{width:100%}.page .section:nth-child(even) .section-container{flex-direction:column}}@media only screen and (max-width: 56.25em){.page{row-gap:2rem}.page .section .section-container .image-side{margin:1rem auto;width:50%}}@media only screen and (max-width: 37.5em){.page .section{margin:0;padding:0}.page .section .section-container{width:100%}.page .section .section-container .text-side{padding:0rem 4%}.page .section .section-container .text-side .title{font-size:2.4rem;font-weight:600;padding:1rem 0rem}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none;margin-bottom:2rem}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\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: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
694
694
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, decorators: [{
|
|
695
695
|
type: Component,
|
|
696
|
-
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"valueprop.sectionTitle\" >\n </section-title>\n <div class=\"optional-button\">\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.route\"\n (click)=\"onClickValuePropButton(valueprop.route)\">\n Click Me\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
696
|
+
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <section-title [sectionTitle]=\"valueprop.sectionTitle\" >\n </section-title>\n <div class=\"optional-button\">\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.route\"\n (click)=\"onClickValuePropButton(valueprop.route)\">\n Click Me\n </button>\n </div>\n </div>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{row-gap:5rem;display:grid;justify-items:center;padding:0rem}.page .section{margin:0rem;padding:2rem 0;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;flex-direction:row;column-gap:4%;width:90%}@media only screen and (min-width: 1500px){.page .section{padding:5rem 0%}.page .section .section-container{max-width:150rem}}.page .section:nth-child(even){background-color:#f3f6f8}.page .section:nth-child(even) .section-container{flex-direction:row-reverse}.page .section .text-side{margin:auto;width:53%;padding:2rem 0rem;text-align:left}.page .section .text-side .title{font-size:3.2rem;font-weight:600;padding:1rem 0rem}.page .section .text-side .optional-button{margin-top:2rem}.page .section .text-side .optional-button button{padding:1rem;background-color:#155ed4;color:#fff}.page .section .image-side{border-radius:1.5rem;width:43%;height:35rem;box-shadow:0 .1rem .5rem #00000040}.page .section .image-side img{border-radius:1.5rem;width:100%;height:100%;object-fit:cover}@media only screen and (max-width: 75em){.page{row-gap:2rem}.page .section .section-container{flex-direction:column}.page .section .section-container .image-side{margin:1rem auto;width:40%}.page .section .section-container .image-side img,.page .section .section-container .text-side{width:100%}.page .section:nth-child(even) .section-container{flex-direction:column}}@media only screen and (max-width: 56.25em){.page{row-gap:2rem}.page .section .section-container .image-side{margin:1rem auto;width:50%}}@media only screen and (max-width: 37.5em){.page .section{margin:0;padding:0}.page .section .section-container{width:100%}.page .section .section-container .text-side{padding:0rem 4%}.page .section .section-container .text-side .title{font-size:2.4rem;font-weight:600;padding:1rem 0rem}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none;margin-bottom:2rem}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"] }]
|
|
697
697
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { pageSection: [{
|
|
698
698
|
type: Input
|
|
699
699
|
}] } });
|
|
@@ -721,7 +721,7 @@ class SocialMediaIconsComponent {
|
|
|
721
721
|
}
|
|
722
722
|
}
|
|
723
723
|
SocialMediaIconsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SocialMediaIconsComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
724
|
-
SocialMediaIconsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SocialMediaIconsComponent, selector: "social-media-icons", inputs: { color: "color", areIconsInFooter: "areIconsInFooter", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<div [ngClass]=\"{'icons-white':areIconsInFooter, 'icons':!areIconsInFooter}\">\n <fa-icon [icon]=\"['fab', 'linkedin-in']\" class=\"icon linkedin\" (click)=\"onClickLinkedIn()\"></fa-icon>\n <fa-icon [icon]=\"['fab', 'instagram']\" class=\"icon instagram\" (click)=\"onClickInstagram()\"></fa-icon>\n <fa-icon [icon]=\"['fab', 'youtube']\" class=\"icon youtube\" (click)=\"onClickYoutube()\"></fa-icon>\n</div>", styles: [".icons,.icons-white{display:flex;gap:1.5rem}.icons .icon,.icons-white .icon{cursor:pointer;font-size:2rem}.icons-white{color:#fff}.icons-white .icon:hover{color:#e6e6e6}.icons{font-size:2rem}.icons .icon{color:#4d4d4d;cursor:pointer;transition:ease-in-out .2s}.icons .linkedin:hover{color:#0072b1}.icons .instagram:hover{color:#c92bb7}.icons .youtube:hover{color:red}\n"], dependencies: [{ kind: "component", type: i2
|
|
724
|
+
SocialMediaIconsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SocialMediaIconsComponent, selector: "social-media-icons", inputs: { color: "color", areIconsInFooter: "areIconsInFooter", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<div [ngClass]=\"{'icons-white':areIconsInFooter, 'icons':!areIconsInFooter}\">\n <fa-icon [icon]=\"['fab', 'linkedin-in']\" class=\"icon linkedin\" (click)=\"onClickLinkedIn()\"></fa-icon>\n <fa-icon [icon]=\"['fab', 'instagram']\" class=\"icon instagram\" (click)=\"onClickInstagram()\"></fa-icon>\n <fa-icon [icon]=\"['fab', 'youtube']\" class=\"icon youtube\" (click)=\"onClickYoutube()\"></fa-icon>\n</div>", styles: [".icons,.icons-white{display:flex;gap:1.5rem}.icons .icon,.icons-white .icon{cursor:pointer;font-size:2rem}.icons-white{color:#fff}.icons-white .icon:hover{color:#e6e6e6}.icons{font-size:2rem}.icons .icon{color:#4d4d4d;cursor:pointer;transition:ease-in-out .2s}.icons .linkedin:hover{color:#0072b1}.icons .instagram:hover{color:#c92bb7}.icons .youtube:hover{color:red}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
725
725
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SocialMediaIconsComponent, decorators: [{
|
|
726
726
|
type: Component,
|
|
727
727
|
args: [{ selector: 'social-media-icons', template: "<div [ngClass]=\"{'icons-white':areIconsInFooter, 'icons':!areIconsInFooter}\">\n <fa-icon [icon]=\"['fab', 'linkedin-in']\" class=\"icon linkedin\" (click)=\"onClickLinkedIn()\"></fa-icon>\n <fa-icon [icon]=\"['fab', 'instagram']\" class=\"icon instagram\" (click)=\"onClickInstagram()\"></fa-icon>\n <fa-icon [icon]=\"['fab', 'youtube']\" class=\"icon youtube\" (click)=\"onClickYoutube()\"></fa-icon>\n</div>", styles: [".icons,.icons-white{display:flex;gap:1.5rem}.icons .icon,.icons-white .icon{cursor:pointer;font-size:2rem}.icons-white{color:#fff}.icons-white .icon:hover{color:#e6e6e6}.icons{font-size:2rem}.icons .icon{color:#4d4d4d;cursor:pointer;transition:ease-in-out .2s}.icons .linkedin:hover{color:#0072b1}.icons .instagram:hover{color:#c92bb7}.icons .youtube:hover{color:red}\n"] }]
|
|
@@ -740,10 +740,10 @@ class ComingSoonComponent {
|
|
|
740
740
|
}
|
|
741
741
|
}
|
|
742
742
|
ComingSoonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComingSoonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
743
|
-
ComingSoonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ComingSoonComponent, selector: "coming-soon", inputs: { ctaText: "ctaText", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\"\n [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
743
|
+
ComingSoonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ComingSoonComponent, selector: "coming-soon", inputs: { ctaText: "ctaText", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\"\n [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;height:100vh}.page .coming-soon{background:url(https://i.ibb.co/crKpSTb/box-left-side-design.png) left center no-repeat,url(https://i.ibb.co/pKTGF8D/coming-soon-right-top-bg.png) right top no-repeat,url(https://i.ibb.co/ckht99W/coming-soon-right-bottom-bg.png) right bottom no-repeat;background-size:2rem,13rem,10rem;position:absolute;top:15%;left:50%;transform:translate(-50%);background-color:#fff;padding:6rem 4rem;width:40%;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060}.page .coming-soon .title{color:#4d4d4d;font-weight:500;font-size:4rem;margin-bottom:.8rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem;margin-bottom:.3rem}.page .coming-soon .registration-field{display:flex;margin-bottom:.8rem}.page .coming-soon .registration-field .email-field{margin-right:.8rem}.page .coming-soon .registration-field .submit{color:#fff;background-color:#32353b}.page .coming-soon .registration-field .submit:hover{background-color:#494e57}.page .coming-soon .social-media-icons{font-size:2rem}.page .coming-soon .social-media-icons fa-icon{color:#4d4d4d;margin-right:1rem;cursor:pointer;transition:ease-in-out .2s}.page .coming-soon .social-media-icons .linkedin:hover{color:#0072b1}.page .coming-soon .social-media-icons .instagram:hover{color:#c92bb7}.page .coming-soon .social-media-icons .youtube:hover{color:red}\n"], dependencies: [{ kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SocialMediaIconsComponent, selector: "social-media-icons", inputs: ["color", "areIconsInFooter", "socialMediaLinks"] }] });
|
|
744
744
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComingSoonComponent, decorators: [{
|
|
745
745
|
type: Component,
|
|
746
|
-
args: [{ selector: 'coming-soon', template: "<div class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\"\n [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
746
|
+
args: [{ selector: 'coming-soon', template: "<div class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\"\n [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;height:100vh}.page .coming-soon{background:url(https://i.ibb.co/crKpSTb/box-left-side-design.png) left center no-repeat,url(https://i.ibb.co/pKTGF8D/coming-soon-right-top-bg.png) right top no-repeat,url(https://i.ibb.co/ckht99W/coming-soon-right-bottom-bg.png) right bottom no-repeat;background-size:2rem,13rem,10rem;position:absolute;top:15%;left:50%;transform:translate(-50%);background-color:#fff;padding:6rem 4rem;width:40%;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060}.page .coming-soon .title{color:#4d4d4d;font-weight:500;font-size:4rem;margin-bottom:.8rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem;margin-bottom:.3rem}.page .coming-soon .registration-field{display:flex;margin-bottom:.8rem}.page .coming-soon .registration-field .email-field{margin-right:.8rem}.page .coming-soon .registration-field .submit{color:#fff;background-color:#32353b}.page .coming-soon .registration-field .submit:hover{background-color:#494e57}.page .coming-soon .social-media-icons{font-size:2rem}.page .coming-soon .social-media-icons fa-icon{color:#4d4d4d;margin-right:1rem;cursor:pointer;transition:ease-in-out .2s}.page .coming-soon .social-media-icons .linkedin:hover{color:#0072b1}.page .coming-soon .social-media-icons .instagram:hover{color:#c92bb7}.page .coming-soon .social-media-icons .youtube:hover{color:red}\n"] }]
|
|
747
747
|
}], propDecorators: { ctaText: [{
|
|
748
748
|
type: Input
|
|
749
749
|
}], socialMediaLinks: [{
|
|
@@ -760,10 +760,10 @@ class FaqCategoryListingComponent {
|
|
|
760
760
|
}
|
|
761
761
|
}
|
|
762
762
|
FaqCategoryListingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqCategoryListingComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
763
|
-
FaqCategoryListingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FaqCategoryListingComponent, selector: "faq-category-listing", inputs: { category: "category", isSelected: "isSelected" }, ngImport: i0, template: "<div [ngClass]=\"{'selected':isSelected}\" class=\"listing\">\n <div class=\"icon-container\">\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\n </div>\n <div class=\"title\">\n {{category.title}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
763
|
+
FaqCategoryListingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FaqCategoryListingComponent, selector: "faq-category-listing", inputs: { category: "category", isSelected: "isSelected" }, ngImport: i0, template: "<div [ngClass]=\"{'selected':isSelected}\" class=\"listing\">\n <div class=\"icon-container\">\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\n </div>\n <div class=\"title\">\n {{category.title}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.listing{display:grid;grid-template-rows:auto auto;align-items:center;background:#fff;padding:2rem;border-radius:1.5rem;grid-row-gap:1rem;width:100%;height:20rem;margin:auto;place-items:center;border:.2rem solid #32353b;transition:all ease-in-out .1s;color:#32353b}.listing:hover{cursor:pointer;color:#155ed4;box-sizing:border-box;border:.2rem solid #155ED4}.icon-container{grid-row:1/span 2;grid-column:1;font-size:5rem}.title{font-size:18px;font-weight:700}.selected{cursor:pointer;color:#155ed4;box-sizing:border-box;border:.2rem solid #155ED4}@media only screen and (max-width: 75em){.listing{width:30rem;margin:auto 1rem}}@media only screen and (max-width: 37.5em){.listing{width:15rem;height:12rem;padding:0}.listing .title{font-size:1.8rem}.listing .icon-container{font-size:4rem}}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
764
764
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqCategoryListingComponent, decorators: [{
|
|
765
765
|
type: Component,
|
|
766
|
-
args: [{ selector: 'faq-category-listing', template: "<div [ngClass]=\"{'selected':isSelected}\" class=\"listing\">\n <div class=\"icon-container\">\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\n </div>\n <div class=\"title\">\n {{category.title}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
766
|
+
args: [{ selector: 'faq-category-listing', template: "<div [ngClass]=\"{'selected':isSelected}\" class=\"listing\">\n <div class=\"icon-container\">\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\n </div>\n <div class=\"title\">\n {{category.title}}\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.listing{display:grid;grid-template-rows:auto auto;align-items:center;background:#fff;padding:2rem;border-radius:1.5rem;grid-row-gap:1rem;width:100%;height:20rem;margin:auto;place-items:center;border:.2rem solid #32353b;transition:all ease-in-out .1s;color:#32353b}.listing:hover{cursor:pointer;color:#155ed4;box-sizing:border-box;border:.2rem solid #155ED4}.icon-container{grid-row:1/span 2;grid-column:1;font-size:5rem}.title{font-size:18px;font-weight:700}.selected{cursor:pointer;color:#155ed4;box-sizing:border-box;border:.2rem solid #155ED4}@media only screen and (max-width: 75em){.listing{width:30rem;margin:auto 1rem}}@media only screen and (max-width: 37.5em){.listing{width:15rem;height:12rem;padding:0}.listing .title{font-size:1.8rem}.listing .icon-container{font-size:4rem}}\n"] }]
|
|
767
767
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { category: [{
|
|
768
768
|
type: Input
|
|
769
769
|
}], isSelected: [{
|
|
@@ -782,30 +782,41 @@ class FaqListingComponent {
|
|
|
782
782
|
}
|
|
783
783
|
}
|
|
784
784
|
FaqListingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqListingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
785
|
-
FaqListingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FaqListingComponent, selector: "faq-listing", inputs: { faq: "faq" }, ngImport: i0, template: "<mat-expansion-panel class=\"listing\" hideToggle [expanded]=\"isOpen\" (opened)=\"onOpened($event)\"\n (closed)=\"onClosed($event)\">\n <mat-expansion-panel-header class=\"panel-header\">\n <mat-panel-title class=\"title\">\n {{faq.question}}\n </mat-panel-title>\n <div class=\"icon\">\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\n </div>\n </mat-expansion-panel-header>\n <div class=\"content\">\n {{faq.response}}\n </div>\n</mat-expansion-panel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
785
|
+
FaqListingComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: FaqListingComponent, selector: "faq-listing", inputs: { faq: "faq" }, ngImport: i0, template: "<mat-expansion-panel class=\"listing\" hideToggle [expanded]=\"isOpen\" (opened)=\"onOpened($event)\"\n (closed)=\"onClosed($event)\">\n <mat-expansion-panel-header class=\"panel-header\">\n <mat-panel-title class=\"title\">\n {{faq.question}}\n </mat-panel-title>\n <div class=\"icon\">\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\n </div>\n </mat-expansion-panel-header>\n <div class=\"content\">\n {{faq.response}}\n </div>\n</mat-expansion-panel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.content{padding-left:1.5rem;border-left:.2rem solid #155ED4;margin-bottom:2rem}.panel-header{display:flex;flex-direction:row;column-gap:2%;align-items:center;padding:1rem}.title{font-size:1.6rem;font-weight:700}mat-icon{color:#155ed4;transition:ease .1s}mat-expansion-panel-header:hover:active mat-icon{transform:rotate(180deg)}.mat-expansion-panel-header{height:auto}.mat-expansion-panel-body{padding:1rem 1.5rem}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i3$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i3$1.MatExpansionPanelTitle, selector: "mat-panel-title" }] });
|
|
786
786
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqListingComponent, decorators: [{
|
|
787
787
|
type: Component,
|
|
788
|
-
args: [{ selector: 'faq-listing', template: "<mat-expansion-panel class=\"listing\" hideToggle [expanded]=\"isOpen\" (opened)=\"onOpened($event)\"\n (closed)=\"onClosed($event)\">\n <mat-expansion-panel-header class=\"panel-header\">\n <mat-panel-title class=\"title\">\n {{faq.question}}\n </mat-panel-title>\n <div class=\"icon\">\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\n </div>\n </mat-expansion-panel-header>\n <div class=\"content\">\n {{faq.response}}\n </div>\n</mat-expansion-panel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
788
|
+
args: [{ selector: 'faq-listing', template: "<mat-expansion-panel class=\"listing\" hideToggle [expanded]=\"isOpen\" (opened)=\"onOpened($event)\"\n (closed)=\"onClosed($event)\">\n <mat-expansion-panel-header class=\"panel-header\">\n <mat-panel-title class=\"title\">\n {{faq.question}}\n </mat-panel-title>\n <div class=\"icon\">\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\n </div>\n </mat-expansion-panel-header>\n <div class=\"content\">\n {{faq.response}}\n </div>\n</mat-expansion-panel>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.content{padding-left:1.5rem;border-left:.2rem solid #155ED4;margin-bottom:2rem}.panel-header{display:flex;flex-direction:row;column-gap:2%;align-items:center;padding:1rem}.title{font-size:1.6rem;font-weight:700}mat-icon{color:#155ed4;transition:ease .1s}mat-expansion-panel-header:hover:active mat-icon{transform:rotate(180deg)}.mat-expansion-panel-header{height:auto}.mat-expansion-panel-body{padding:1rem 1.5rem}\n"] }]
|
|
789
789
|
}], ctorParameters: function () { return []; }, propDecorators: { faq: [{
|
|
790
790
|
type: Input
|
|
791
791
|
}] } });
|
|
792
792
|
|
|
793
793
|
class CtaSectionStyleFourComponent {
|
|
794
|
-
constructor(_router) {
|
|
794
|
+
constructor(breakpointObserver, _router) {
|
|
795
|
+
this.breakpointObserver = breakpointObserver;
|
|
795
796
|
this._router = _router;
|
|
796
797
|
}
|
|
797
798
|
ngOnInit() {
|
|
799
|
+
this.breakpointObserver.observe([
|
|
800
|
+
"(max-width: 900px)"
|
|
801
|
+
]).subscribe((result) => {
|
|
802
|
+
if (result.matches) {
|
|
803
|
+
this.sectionContent.sectionTitle.alignLeft = false;
|
|
804
|
+
}
|
|
805
|
+
else {
|
|
806
|
+
this.sectionContent.sectionTitle.alignLeft = true;
|
|
807
|
+
}
|
|
808
|
+
});
|
|
798
809
|
}
|
|
799
810
|
onClickCtaButton(route) {
|
|
800
811
|
this._router.navigate([route]);
|
|
801
812
|
}
|
|
802
813
|
}
|
|
803
|
-
CtaSectionStyleFourComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CtaSectionStyleFourComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
804
|
-
CtaSectionStyleFourComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CtaSectionStyleFourComponent, selector: "cta-section-style-four", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
814
|
+
CtaSectionStyleFourComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CtaSectionStyleFourComponent, deps: [{ token: i1$1.BreakpointObserver }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
815
|
+
CtaSectionStyleFourComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CtaSectionStyleFourComponent, selector: "cta-section-style-four", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:10rem 1rem;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .flex-reverse{flex-direction:row-reverse}.main-card .text-side{display:flex;flex-direction:row;column-gap:2%;width:100%;place-items:center}.main-card .text-side .section-title{width:70%;margin:auto}.main-card .text-side .buttons-line{width:28%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600;color:#fff;background-color:#155ed4}.main-card .text-side .buttons-line button:nth-child(2){background-color:#fff;color:#155ed4}@media only screen and (max-width: 56.25em){.main-card .text-side{flex-direction:column;row-gap:4rem}.main-card .text-side .buttons-line{width:50%}}@media only screen and (max-width: 37.5em){.main-card .text-side{flex-direction:column;row-gap:4rem}.main-card .text-side .section-title,.main-card .text-side .buttons-line{width:90%}}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
805
816
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CtaSectionStyleFourComponent, decorators: [{
|
|
806
817
|
type: Component,
|
|
807
|
-
args: [{ selector: 'cta-section-style-four', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\"
|
|
808
|
-
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
818
|
+
args: [{ selector: 'cta-section-style-four', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:10rem 1rem;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .flex-reverse{flex-direction:row-reverse}.main-card .text-side{display:flex;flex-direction:row;column-gap:2%;width:100%;place-items:center}.main-card .text-side .section-title{width:70%;margin:auto}.main-card .text-side .buttons-line{width:28%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600;color:#fff;background-color:#155ed4}.main-card .text-side .buttons-line button:nth-child(2){background-color:#fff;color:#155ed4}@media only screen and (max-width: 56.25em){.main-card .text-side{flex-direction:column;row-gap:4rem}.main-card .text-side .buttons-line{width:50%}}@media only screen and (max-width: 37.5em){.main-card .text-side{flex-direction:column;row-gap:4rem}.main-card .text-side .section-title,.main-card .text-side .buttons-line{width:90%}}\n"] }]
|
|
819
|
+
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }, { type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
809
820
|
type: Input
|
|
810
821
|
}] } });
|
|
811
822
|
|
|
@@ -820,7 +831,7 @@ class CtaSectionStyleThreeComponent {
|
|
|
820
831
|
}
|
|
821
832
|
}
|
|
822
833
|
CtaSectionStyleThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CtaSectionStyleThreeComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
823
|
-
CtaSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CtaSectionStyleThreeComponent, selector: "cta-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage\">\n <img [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\n </div>\n <div class=\"text-side\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton(button.route)\" [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:4rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"], dependencies: [{ kind: "directive", type:
|
|
834
|
+
CtaSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CtaSectionStyleThreeComponent, selector: "cta-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage\">\n <img [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\n </div>\n <div class=\"text-side\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton(button.route)\" [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:4rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\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: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle"] }] });
|
|
824
835
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CtaSectionStyleThreeComponent, decorators: [{
|
|
825
836
|
type: Component,
|
|
826
837
|
args: [{ selector: 'cta-section-style-three', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage\">\n <img [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\n </div>\n <div class=\"text-side\">\n <div class=\"section-title\">\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\n </div>\n <div class=\"buttons-line\">\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton(button.route)\" [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\n {{button.label}}\n </button>\n </div>\n </div>\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:4rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"] }]
|