@jooler/jooler-websites-shared 0.0.175 → 0.0.177
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 +2 -2
- package/esm2020/lib/custom-tooltip/custom-tooltip.component.mjs +2 -2
- 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/header-section-one/header-section-one.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-prop-card/value-prop-card.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/esm2020/lib/vertical-side-tabs/vertical-side-tabs.component.mjs +2 -2
- package/esm2020/public-api.mjs +2 -1
- package/fesm2015/jooler-websites-shared.mjs +53 -53
- package/fesm2015/jooler-websites-shared.mjs.map +1 -1
- package/fesm2020/jooler-websites-shared.mjs +53 -53
- package/fesm2020/jooler-websites-shared.mjs.map +1 -1
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
|
@@ -39,10 +39,10 @@ class SectionTitleComponent {
|
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
41
|
SectionTitleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SectionTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
-
SectionTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SectionTitleComponent, selector: "section-title", inputs: { sectionTitle: "sectionTitle", withoutTitleCase: "withoutTitleCase" }, 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,\r\n'small-font': sectionTitle.fontSizeEnum == sectionTitleSizes.SMALL,\r\n'medium-font': sectionTitle.fontSizeEnum == sectionTitleSizes.MEDIUM || (!sectionTitle.fontSizeEnum),\r\n'large-font': (sectionTitle.fontSizeEnum == sectionTitleSizes.LARGE) }\">\r\n <div class=\"title-container\">\r\n <div class=\"title\" *ngIf=\"sectionTitle.title\">\r\n {{withoutTitleCase? sectionTitle.title : (sectionTitle.title | titlecase)}}\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\r\n </div>\r\n </div>\r\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\r\n {{sectionTitle.subtitle}}\r\n </div>\r\n</div>", styles: ["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-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:700;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}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500}.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}.large-font .title{font-size:5rem}.large-font .description{font-size:1.8rem}.medium-font .title{font-size:4rem}.medium-font .description{font-size:1.8rem}.small-font .title{font-size:3rem}.small-font .description{font-size:1.6rem}@media only screen and (max-width: 37.5em){.large-font .title,.align-left .title,.align-center .title{font-size:3rem}.large-font .description,.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"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }] });
|
|
42
|
+
SectionTitleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SectionTitleComponent, selector: "section-title", inputs: { sectionTitle: "sectionTitle", withoutTitleCase: "withoutTitleCase" }, 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,\r\n'small-font': sectionTitle.fontSizeEnum == sectionTitleSizes.SMALL,\r\n'medium-font': sectionTitle.fontSizeEnum == sectionTitleSizes.MEDIUM || (!sectionTitle.fontSizeEnum),\r\n'large-font': (sectionTitle.fontSizeEnum == sectionTitleSizes.LARGE) }\">\r\n <div class=\"title-container\">\r\n <div class=\"title\" *ngIf=\"sectionTitle.title\">\r\n {{withoutTitleCase? sectionTitle.title : (sectionTitle.title | titlecase)}}\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\r\n </div>\r\n </div>\r\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\r\n {{sectionTitle.subtitle}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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:700;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}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500}.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}.large-font .title{font-size:5rem}.large-font .description{font-size:1.8rem}.medium-font .title{font-size:4rem}.medium-font .description{font-size:1.8rem}.small-font .title{font-size:3rem}.small-font .description{font-size:1.6rem}@media only screen and (max-width: 37.5em){.large-font .title,.align-left .title,.align-center .title{font-size:3rem}.large-font .description,.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"] }, { kind: "pipe", type: i3.TitleCasePipe, name: "titlecase" }] });
|
|
43
43
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SectionTitleComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
45
|
-
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,\r\n'small-font': sectionTitle.fontSizeEnum == sectionTitleSizes.SMALL,\r\n'medium-font': sectionTitle.fontSizeEnum == sectionTitleSizes.MEDIUM || (!sectionTitle.fontSizeEnum),\r\n'large-font': (sectionTitle.fontSizeEnum == sectionTitleSizes.LARGE) }\">\r\n <div class=\"title-container\">\r\n <div class=\"title\" *ngIf=\"sectionTitle.title\">\r\n {{withoutTitleCase? sectionTitle.title : (sectionTitle.title | titlecase)}}\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\r\n </div>\r\n </div>\r\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\r\n {{sectionTitle.subtitle}}\r\n </div>\r\n</div>", styles: ["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-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:700;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}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500}.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}.large-font .title{font-size:5rem}.large-font .description{font-size:1.8rem}.medium-font .title{font-size:4rem}.medium-font .description{font-size:1.8rem}.small-font .title{font-size:3rem}.small-font .description{font-size:1.6rem}@media only screen and (max-width: 37.5em){.large-font .title,.align-left .title,.align-center .title{font-size:3rem}.large-font .description,.align-left .description,.align-center .description{width:85%;font-size:1.8rem}}\n"] }]
|
|
45
|
+
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,\r\n'small-font': sectionTitle.fontSizeEnum == sectionTitleSizes.SMALL,\r\n'medium-font': sectionTitle.fontSizeEnum == sectionTitleSizes.MEDIUM || (!sectionTitle.fontSizeEnum),\r\n'large-font': (sectionTitle.fontSizeEnum == sectionTitleSizes.LARGE) }\">\r\n <div class=\"title-container\">\r\n <div class=\"title\" *ngIf=\"sectionTitle.title\">\r\n {{withoutTitleCase? sectionTitle.title : (sectionTitle.title | titlecase)}}\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\r\n </div>\r\n </div>\r\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\">\r\n {{sectionTitle.subtitle}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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:700;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}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500}.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}.large-font .title{font-size:5rem}.large-font .description{font-size:1.8rem}.medium-font .title{font-size:4rem}.medium-font .description{font-size:1.8rem}.small-font .title{font-size:3rem}.small-font .description{font-size:1.6rem}@media only screen and (max-width: 37.5em){.large-font .title,.align-left .title,.align-center .title{font-size:3rem}.large-font .description,.align-left .description,.align-center .description{width:85%;font-size:1.8rem}}\n"] }]
|
|
46
46
|
}], propDecorators: { sectionTitle: [{
|
|
47
47
|
type: Input
|
|
48
48
|
}], withoutTitleCase: [{
|
|
@@ -63,10 +63,10 @@ class PageSectionStyleTenComponent {
|
|
|
63
63
|
}
|
|
64
64
|
}
|
|
65
65
|
PageSectionStyleTenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleTenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
66
|
-
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\">\r\n <mat-expansion-panel class=\"expansion-panel\" (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\r\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\r\n <mat-expansion-panel-header>\r\n <div class=\"panel-headline\">\r\n <mat-panel-title>\r\n <fa-icon [icon]=\"iconName\">\r\n </fa-icon>\r\n {{item.question}}\r\n </mat-panel-title>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <div class=\"panel-content\">\r\n <ul>\r\n <li>\r\n {{item.answer}}\r\n </li>\r\n </ul>\r\n </div>\r\n </mat-expansion-panel>\r\n</mat-accordion>", styles: ["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-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}.expansion-panel{background:#FAFAFA}.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){.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" }] });
|
|
66
|
+
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\">\r\n <mat-expansion-panel class=\"expansion-panel\" (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\r\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\r\n <mat-expansion-panel-header>\r\n <div class=\"panel-headline\">\r\n <mat-panel-title>\r\n <fa-icon [icon]=\"iconName\">\r\n </fa-icon>\r\n {{item.question}}\r\n </mat-panel-title>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <div class=\"panel-content\">\r\n <ul>\r\n <li>\r\n {{item.answer}}\r\n </li>\r\n </ul>\r\n </div>\r\n </mat-expansion-panel>\r\n</mat-accordion>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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}.expansion-panel{background:#FAFAFA}.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){.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" }] });
|
|
67
67
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleTenComponent, decorators: [{
|
|
68
68
|
type: Component,
|
|
69
|
-
args: [{ selector: 'page-section-style-ten', template: "<mat-accordion class=\"mat-mdc-form-field\">\r\n <mat-expansion-panel class=\"expansion-panel\" (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\r\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\r\n <mat-expansion-panel-header>\r\n <div class=\"panel-headline\">\r\n <mat-panel-title>\r\n <fa-icon [icon]=\"iconName\">\r\n </fa-icon>\r\n {{item.question}}\r\n </mat-panel-title>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <div class=\"panel-content\">\r\n <ul>\r\n <li>\r\n {{item.answer}}\r\n </li>\r\n </ul>\r\n </div>\r\n </mat-expansion-panel>\r\n</mat-accordion>", styles: ["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-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}.expansion-panel{background:#FAFAFA}.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){.expansion-panel{margin:0rem 1rem}}\n"] }]
|
|
69
|
+
args: [{ selector: 'page-section-style-ten', template: "<mat-accordion class=\"mat-mdc-form-field\">\r\n <mat-expansion-panel class=\"expansion-panel\" (opened)=\"panelOpenState = true\" (closed)=\"panelOpenState = false\"\r\n *ngFor=\"let item of data; let i = index\" (click)=\"onClickPanel(i)\">\r\n <mat-expansion-panel-header>\r\n <div class=\"panel-headline\">\r\n <mat-panel-title>\r\n <fa-icon [icon]=\"iconName\">\r\n </fa-icon>\r\n {{item.question}}\r\n </mat-panel-title>\r\n </div>\r\n </mat-expansion-panel-header>\r\n\r\n <div class=\"panel-content\">\r\n <ul>\r\n <li>\r\n {{item.answer}}\r\n </li>\r\n </ul>\r\n </div>\r\n </mat-expansion-panel>\r\n</mat-accordion>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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}.expansion-panel{background:#FAFAFA}.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){.expansion-panel{margin:0rem 1rem}}\n"] }]
|
|
70
70
|
}], ctorParameters: function () { return []; }, propDecorators: { data: [{
|
|
71
71
|
type: Input
|
|
72
72
|
}], iconName: [{
|
|
@@ -87,10 +87,10 @@ class GetStartedCTAComponent {
|
|
|
87
87
|
}
|
|
88
88
|
}
|
|
89
89
|
GetStartedCTAComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetStartedCTAComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
90
|
-
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\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\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\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <button mat-raised-button class=\"sign-up-btn\"\r\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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: i4.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"] }] });
|
|
90
|
+
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\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\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\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <button mat-raised-button class=\"sign-up-btn\"\r\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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: i4.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"] }] });
|
|
91
91
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: GetStartedCTAComponent, decorators: [{
|
|
92
92
|
type: Component,
|
|
93
|
-
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\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\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <button mat-raised-button class=\"sign-up-btn\"\r\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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"] }]
|
|
93
|
+
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\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\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\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\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <img [src]=\"ctaCardData.logo.path\" alt=\"\" (click)=\"onClickLink(ctaCardData.logo.route)\" class=\"logo-img\">\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <button mat-raised-button class=\"sign-up-btn\"\r\n (click)=\"onClickLink(ctaCardData.callToActionButton.route)\">{{ctaCardData.callToActionButton.ctaText}}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
94
94
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { ctaCardData: [{
|
|
95
95
|
type: Input
|
|
96
96
|
}] } });
|
|
@@ -100,10 +100,10 @@ class AchievementsComponent {
|
|
|
100
100
|
ngOnInit() { }
|
|
101
101
|
}
|
|
102
102
|
AchievementsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AchievementsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
103
|
-
AchievementsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AchievementsComponent, selector: "achievements", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': sectionContent.sectionTitle.isDarkBg}\">\r\n <div class=\"content\">\r\n <div>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"achievements-cards\">\r\n <div class=\"achievement-card\" *ngFor=\"let achievement of sectionContent.achievements\">\r\n <div class=\"number\">\r\n {{achievement.number}}\r\n </div>\r\n <div class=\"subtitle\">\r\n {{achievement.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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", "withoutTitleCase"] }] });
|
|
103
|
+
AchievementsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: AchievementsComponent, selector: "achievements", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': sectionContent.sectionTitle.isDarkBg}\">\r\n <div class=\"content\">\r\n <div>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"achievements-cards\">\r\n <div class=\"achievement-card\" *ngFor=\"let achievement of sectionContent.achievements\">\r\n <div class=\"number\">\r\n {{achievement.number}}\r\n </div>\r\n <div class=\"subtitle\">\r\n {{achievement.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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", "withoutTitleCase"] }] });
|
|
104
104
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AchievementsComponent, decorators: [{
|
|
105
105
|
type: Component,
|
|
106
|
-
args: [{ selector: 'achievements', template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': sectionContent.sectionTitle.isDarkBg}\">\r\n <div class=\"content\">\r\n <div>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"achievements-cards\">\r\n <div class=\"achievement-card\" *ngFor=\"let achievement of sectionContent.achievements\">\r\n <div class=\"number\">\r\n {{achievement.number}}\r\n </div>\r\n <div class=\"subtitle\">\r\n {{achievement.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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"] }]
|
|
106
|
+
args: [{ selector: 'achievements', template: "<div class=\"achievements\" [ngClass]=\"{'blue-background': sectionContent.sectionTitle.isDarkBg}\">\r\n <div class=\"content\">\r\n <div>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"achievements-cards\">\r\n <div class=\"achievement-card\" *ngFor=\"let achievement of sectionContent.achievements\">\r\n <div class=\"number\">\r\n {{achievement.number}}\r\n </div>\r\n <div class=\"subtitle\">\r\n {{achievement.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
107
107
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
108
108
|
type: Input
|
|
109
109
|
}] } });
|
|
@@ -129,10 +129,10 @@ class PricingPlansComponent {
|
|
|
129
129
|
}
|
|
130
130
|
}
|
|
131
131
|
PricingPlansComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PricingPlansComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
132
|
-
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\">\r\n <div class=\"title-price-desc\">\r\n <h1 class=\"plan-title\">\r\n {{servicePlan.name}}\r\n </h1>\r\n <div class=\"price\" *ngIf=\"servicePlan.price\">\r\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\r\n <span>/{{servicePlan.frequency}}</span>\r\n </div>\r\n <div class=\"description\">\r\n {{servicePlan.description}}\r\n </div>\r\n <div class=\"divider\"></div>\r\n </div>\r\n <div class=\"perks\">\r\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\r\n <span class=\"check-icon\">\r\n <fa-icon icon=\"check\"></fa-icon>\r\n </span>\r\n <div class=\"service-description\">\r\n <div class=\"service-perk\">\r\n {{perk.perk}}\r\n </div>\r\n <span class=\"exclamation-mark\">\r\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\" icon=\"circle-exclamation\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"registration-button\">\r\n <button mat-raised-button (click)=\"onClickCtaButton()\" class=\"button\">\r\n Choose Plan\r\n </button>\r\n </div>\r\n</div>", styles: ["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-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: i4.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: i5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
|
|
132
|
+
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\">\r\n <div class=\"title-price-desc\">\r\n <h1 class=\"plan-title\">\r\n {{servicePlan.name}}\r\n </h1>\r\n <div class=\"price\" *ngIf=\"servicePlan.price\">\r\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\r\n <span>/{{servicePlan.frequency}}</span>\r\n </div>\r\n <div class=\"description\">\r\n {{servicePlan.description}}\r\n </div>\r\n <div class=\"divider\"></div>\r\n </div>\r\n <div class=\"perks\">\r\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\r\n <span class=\"check-icon\">\r\n <fa-icon icon=\"check\"></fa-icon>\r\n </span>\r\n <div class=\"service-description\">\r\n <div class=\"service-perk\">\r\n {{perk.perk}}\r\n </div>\r\n <span class=\"exclamation-mark\">\r\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\" icon=\"circle-exclamation\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"registration-button\">\r\n <button mat-raised-button (click)=\"onClickCtaButton()\" class=\"button\">\r\n Choose Plan\r\n </button>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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: i4.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: i5.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] });
|
|
133
133
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PricingPlansComponent, decorators: [{
|
|
134
134
|
type: Component,
|
|
135
|
-
args: [{ selector: 'pricing-plans', template: "<div class=\"plan-content\">\r\n <div class=\"title-price-desc\">\r\n <h1 class=\"plan-title\">\r\n {{servicePlan.name}}\r\n </h1>\r\n <div class=\"price\" *ngIf=\"servicePlan.price\">\r\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\r\n <span>/{{servicePlan.frequency}}</span>\r\n </div>\r\n <div class=\"description\">\r\n {{servicePlan.description}}\r\n </div>\r\n <div class=\"divider\"></div>\r\n </div>\r\n <div class=\"perks\">\r\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\r\n <span class=\"check-icon\">\r\n <fa-icon icon=\"check\"></fa-icon>\r\n </span>\r\n <div class=\"service-description\">\r\n <div class=\"service-perk\">\r\n {{perk.perk}}\r\n </div>\r\n <span class=\"exclamation-mark\">\r\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\" icon=\"circle-exclamation\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"registration-button\">\r\n <button mat-raised-button (click)=\"onClickCtaButton()\" class=\"button\">\r\n Choose Plan\r\n </button>\r\n </div>\r\n</div>", styles: ["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-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"] }]
|
|
135
|
+
args: [{ selector: 'pricing-plans', template: "<div class=\"plan-content\">\r\n <div class=\"title-price-desc\">\r\n <h1 class=\"plan-title\">\r\n {{servicePlan.name}}\r\n </h1>\r\n <div class=\"price\" *ngIf=\"servicePlan.price\">\r\n <span class=\"service-price\">$ {{servicePlan.price}}</span>\r\n <span>/{{servicePlan.frequency}}</span>\r\n </div>\r\n <div class=\"description\">\r\n {{servicePlan.description}}\r\n </div>\r\n <div class=\"divider\"></div>\r\n </div>\r\n <div class=\"perks\">\r\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\r\n <span class=\"check-icon\">\r\n <fa-icon icon=\"check\"></fa-icon>\r\n </span>\r\n <div class=\"service-description\">\r\n <div class=\"service-perk\">\r\n {{perk.perk}}\r\n </div>\r\n <span class=\"exclamation-mark\">\r\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\" icon=\"circle-exclamation\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"registration-button\">\r\n <button mat-raised-button (click)=\"onClickCtaButton()\" class=\"button\">\r\n Choose Plan\r\n </button>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
136
136
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { servicePlan: [{
|
|
137
137
|
type: Input
|
|
138
138
|
}] } });
|
|
@@ -214,7 +214,7 @@ class ImageGalleryModal {
|
|
|
214
214
|
}
|
|
215
215
|
}
|
|
216
216
|
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 });
|
|
217
|
-
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=\"section\">\r\n\r\n <div class=\"gallery-image-gallery-modal-container\">\r\n <div class=\"gallery\">\r\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\r\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.file\" [alt]=\"image.name\">\r\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\r\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\r\n <div *ngIf=\"showCount\" class=\"count\">\r\n {{currentIndex + 1}}/{{totalImageCount}}\r\n </div>\r\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\r\n <fa-icon icon=\"times\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\r\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\r\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\r\n </button>\r\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\" class=\"image-gallery-modal-img\">\r\n <img [src]=\"currentImageGalleryModal.file\" [alt]=\"currentImageGalleryModal.name\">\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <p-galleria [value]=\"galleryData\" class=\"gallery-custom\" [responsiveOptions]=\"responsiveOptions\" [containerStyle]=\"{ 'max-width': '900px' }\">\r\n <ng-template pTemplate=\"item\" let-item>\r\n <div class=\"img\">\r\n <img class=\"big-img\" [src]=\"item.file\" />\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"thumbnail\" let-item>\r\n <div class=\"grid grid-nogutter justify-content-center\">\r\n <img [src]=\"item.file\" class=\"small-img\" />\r\n </div>\r\n </ng-template>\r\n </p-galleria>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{width:100%}.gallery-custom{display:none}.gallery-image-gallery-modal-container{position:relative;display:block;padding:2.5rem;margin:auto;width:90%}@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}.gallery-image-gallery-modal-container .gallery .gallery-image:hover{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 .hide-overflow{overflow:hidden}.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 .image-gallery-modal .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 .image-gallery-modal .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 .image-gallery-modal .close-btn fa-icon{font-size:2.5rem}.gallery-image-gallery-modal-container .image-gallery-modal .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 .image-gallery-modal .btn-prev{left:0}.gallery-image-gallery-modal-container .image-gallery-modal .btn-next{right:0}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel{color:#fff;opacity:.5;transition:all .15s ease}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:hover{opacity:.9}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:active{opacity:.5}.gallery-image-gallery-modal-container .image-gallery-modal .icon-prev,.gallery-image-gallery-modal-container .image-gallery-modal .icon-next{font-size:3rem}.gallery-image-gallery-modal-container .image-gallery-modal .image-gallery-modal-img img{width:100%;max-height:90vh;border-radius:1rem}@media only screen and (max-width: 75em){.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%}}@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;width:100%;max-width:8rem;height:12rem}.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: [
|
|
217
|
+
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=\"section\">\r\n\r\n <div class=\"gallery-image-gallery-modal-container\">\r\n <div class=\"gallery\">\r\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\r\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.file\" [alt]=\"image.name\">\r\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\r\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\r\n <div *ngIf=\"showCount\" class=\"count\">\r\n {{currentIndex + 1}}/{{totalImageCount}}\r\n </div>\r\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\r\n <fa-icon icon=\"times\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\r\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\r\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\r\n </button>\r\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\" class=\"image-gallery-modal-img\">\r\n <img [src]=\"currentImageGalleryModal.file\" [alt]=\"currentImageGalleryModal.name\">\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <p-galleria [value]=\"galleryData\" class=\"gallery-custom\" [responsiveOptions]=\"responsiveOptions\" [containerStyle]=\"{ 'max-width': '900px' }\">\r\n <ng-template pTemplate=\"item\" let-item>\r\n <div class=\"img\">\r\n <img class=\"big-img\" [src]=\"item.file\" />\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"thumbnail\" let-item>\r\n <div class=\"grid grid-nogutter justify-content-center\">\r\n <img [src]=\"item.file\" class=\"small-img\" />\r\n </div>\r\n </ng-template>\r\n </p-galleria>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{width:100%}.gallery-custom{display:none}.gallery-image-gallery-modal-container{position:relative;display:block;padding:2.5rem;margin:auto;width:90%}@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}.gallery-image-gallery-modal-container .gallery .gallery-image:hover{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 .hide-overflow{overflow:hidden}.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 .image-gallery-modal .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 .image-gallery-modal .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 .image-gallery-modal .close-btn fa-icon{font-size:2.5rem}.gallery-image-gallery-modal-container .image-gallery-modal .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 .image-gallery-modal .btn-prev{left:0}.gallery-image-gallery-modal-container .image-gallery-modal .btn-next{right:0}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel{color:#fff;opacity:.5;transition:all .15s ease}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:hover{opacity:.9}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:active{opacity:.5}.gallery-image-gallery-modal-container .image-gallery-modal .icon-prev,.gallery-image-gallery-modal-container .image-gallery-modal .icon-next{font-size:3rem}.gallery-image-gallery-modal-container .image-gallery-modal .image-gallery-modal-img img{width:100%;max-height:90vh;border-radius:1rem}@media only screen and (max-width: 75em){.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%}}@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;width:100%;max-width:8rem;height:12rem}.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: [
|
|
218
218
|
trigger('animation', [
|
|
219
219
|
transition('void => visible', [
|
|
220
220
|
style({ transform: 'scale(0.5)' }),
|
|
@@ -251,7 +251,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
251
251
|
animate('50ms', style({ opacity: 0.8 }))
|
|
252
252
|
])
|
|
253
253
|
])
|
|
254
|
-
], template: "<div class=\"section\">\r\n\r\n <div class=\"gallery-image-gallery-modal-container\">\r\n <div class=\"gallery\">\r\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\r\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.file\" [alt]=\"image.name\">\r\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\r\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\r\n <div *ngIf=\"showCount\" class=\"count\">\r\n {{currentIndex + 1}}/{{totalImageCount}}\r\n </div>\r\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\r\n <fa-icon icon=\"times\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\r\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\r\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\r\n </button>\r\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\" class=\"image-gallery-modal-img\">\r\n <img [src]=\"currentImageGalleryModal.file\" [alt]=\"currentImageGalleryModal.name\">\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <p-galleria [value]=\"galleryData\" class=\"gallery-custom\" [responsiveOptions]=\"responsiveOptions\" [containerStyle]=\"{ 'max-width': '900px' }\">\r\n <ng-template pTemplate=\"item\" let-item>\r\n <div class=\"img\">\r\n <img class=\"big-img\" [src]=\"item.file\" />\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"thumbnail\" let-item>\r\n <div class=\"grid grid-nogutter justify-content-center\">\r\n <img [src]=\"item.file\" class=\"small-img\" />\r\n </div>\r\n </ng-template>\r\n </p-galleria>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{width:100%}.gallery-custom{display:none}.gallery-image-gallery-modal-container{position:relative;display:block;padding:2.5rem;margin:auto;width:90%}@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}.gallery-image-gallery-modal-container .gallery .gallery-image:hover{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 .hide-overflow{overflow:hidden}.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 .image-gallery-modal .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 .image-gallery-modal .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 .image-gallery-modal .close-btn fa-icon{font-size:2.5rem}.gallery-image-gallery-modal-container .image-gallery-modal .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 .image-gallery-modal .btn-prev{left:0}.gallery-image-gallery-modal-container .image-gallery-modal .btn-next{right:0}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel{color:#fff;opacity:.5;transition:all .15s ease}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:hover{opacity:.9}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:active{opacity:.5}.gallery-image-gallery-modal-container .image-gallery-modal .icon-prev,.gallery-image-gallery-modal-container .image-gallery-modal .icon-next{font-size:3rem}.gallery-image-gallery-modal-container .image-gallery-modal .image-gallery-modal-img img{width:100%;max-height:90vh;border-radius:1rem}@media only screen and (max-width: 75em){.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%}}@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;width:100%;max-width:8rem;height:12rem}.gallery-image-gallery-modal-container{display:none}}\n"] }]
|
|
254
|
+
], template: "<div class=\"section\">\r\n\r\n <div class=\"gallery-image-gallery-modal-container\">\r\n <div class=\"gallery\">\r\n <div *ngFor=\"let image of galleryData; let i = index\" class=\"gallery-image\">\r\n <img (click)=\"onPreviewImage(i)\" [src]=\"image.file\" [alt]=\"image.name\">\r\n <div class=\"image-cta\" (click)=\"onPreviewImage(i)\">\r\n Click to preview <fa-icon icon=\"magnifying-glass-plus\"></fa-icon>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"showMask\" [ngClass]=\"{'hide-overflow' : showMask}\" class=\"image-gallery-modal\" @animation2>\r\n <div *ngIf=\"showCount\" class=\"count\">\r\n {{currentIndex + 1}}/{{totalImageCount}}\r\n </div>\r\n <button (click)=\"onClosePreview()\" *ngIf=\"previewImage\" class=\"close-btn\">\r\n <fa-icon icon=\"times\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-prev\" (click)=\"onclickPrev()\">\r\n <fa-icon icon=\"arrow-circle-left\" class=\"icon-image-gallery-modal-carousel icon-prev\"></fa-icon>\r\n </button>\r\n <button *ngIf=\"controls\" class=\"btn-image-gallery-modal-carousel btn-next\" (click)=\"onclickNext()\">\r\n <fa-icon icon=\"arrow-circle-right\" class=\"icon-image-gallery-modal-carousel icon-next\"></fa-icon>\r\n </button>\r\n <div *ngIf=\"previewImage\" [@animation]=\"{value : 'visible'}\" (@animation.done)=\"onAnimationEnd($event)\" class=\"image-gallery-modal-img\">\r\n <img [src]=\"currentImageGalleryModal.file\" [alt]=\"currentImageGalleryModal.name\">\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <p-galleria [value]=\"galleryData\" class=\"gallery-custom\" [responsiveOptions]=\"responsiveOptions\" [containerStyle]=\"{ 'max-width': '900px' }\">\r\n <ng-template pTemplate=\"item\" let-item>\r\n <div class=\"img\">\r\n <img class=\"big-img\" [src]=\"item.file\" />\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"thumbnail\" let-item>\r\n <div class=\"grid grid-nogutter justify-content-center\">\r\n <img [src]=\"item.file\" class=\"small-img\" />\r\n </div>\r\n </ng-template>\r\n </p-galleria>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{width:100%}.gallery-custom{display:none}.gallery-image-gallery-modal-container{position:relative;display:block;padding:2.5rem;margin:auto;width:90%}@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}.gallery-image-gallery-modal-container .gallery .gallery-image:hover{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 .hide-overflow{overflow:hidden}.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 .image-gallery-modal .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 .image-gallery-modal .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 .image-gallery-modal .close-btn fa-icon{font-size:2.5rem}.gallery-image-gallery-modal-container .image-gallery-modal .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 .image-gallery-modal .btn-prev{left:0}.gallery-image-gallery-modal-container .image-gallery-modal .btn-next{right:0}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel{color:#fff;opacity:.5;transition:all .15s ease}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:hover{opacity:.9}.gallery-image-gallery-modal-container .image-gallery-modal .icon-image-gallery-modal-carousel:active{opacity:.5}.gallery-image-gallery-modal-container .image-gallery-modal .icon-prev,.gallery-image-gallery-modal-container .image-gallery-modal .icon-next{font-size:3rem}.gallery-image-gallery-modal-container .image-gallery-modal .image-gallery-modal-img img{width:100%;max-height:90vh;border-radius:1rem}@media only screen and (max-width: 75em){.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%}}@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;width:100%;max-width:8rem;height:12rem}.gallery-image-gallery-modal-container{display:none}}\n"] }]
|
|
255
255
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }]; }, propDecorators: { galleryData: [{
|
|
256
256
|
type: Input
|
|
257
257
|
}], showCount: [{
|
|
@@ -272,10 +272,10 @@ class SuccessMessageDialogComponent {
|
|
|
272
272
|
}
|
|
273
273
|
}
|
|
274
274
|
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 });
|
|
275
|
-
SuccessMessageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SuccessMessageDialogComponent, selector: "success-message-dialog", ngImport: i0, template: "<div class=\"page\">\r\n <span mat-dialog-title class=\"dialog-header\" mat-button>\r\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\r\n </span>\r\n\r\n <mat-dialog-content class=\"mat-typography\">\r\n <div class=\"success-icon\">\r\n <fa-icon icon=\"calendar-check\"></fa-icon>\r\n </div>\r\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\r\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\r\n </mat-dialog-content>\r\n <div class=\"divider\"></div>\r\n <mat-dialog-actions class=\"dialog-footer\">\r\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\r\n another form</span>\r\n </h3>\r\n </mat-dialog-actions>\r\n</div>", styles: ["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-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"] }] });
|
|
275
|
+
SuccessMessageDialogComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: SuccessMessageDialogComponent, selector: "success-message-dialog", ngImport: i0, template: "<div class=\"page\">\r\n <span mat-dialog-title class=\"dialog-header\" mat-button>\r\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\r\n </span>\r\n\r\n <mat-dialog-content class=\"mat-typography\">\r\n <div class=\"success-icon\">\r\n <fa-icon icon=\"calendar-check\"></fa-icon>\r\n </div>\r\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\r\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\r\n </mat-dialog-content>\r\n <div class=\"divider\"></div>\r\n <mat-dialog-actions class=\"dialog-footer\">\r\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\r\n another form</span>\r\n </h3>\r\n </mat-dialog-actions>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }] });
|
|
276
276
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SuccessMessageDialogComponent, decorators: [{
|
|
277
277
|
type: Component,
|
|
278
|
-
args: [{ selector: 'success-message-dialog', template: "<div class=\"page\">\r\n <span mat-dialog-title class=\"dialog-header\" mat-button>\r\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\r\n </span>\r\n\r\n <mat-dialog-content class=\"mat-typography\">\r\n <div class=\"success-icon\">\r\n <fa-icon icon=\"calendar-check\"></fa-icon>\r\n </div>\r\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\r\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\r\n </mat-dialog-content>\r\n <div class=\"divider\"></div>\r\n <mat-dialog-actions class=\"dialog-footer\">\r\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\r\n another form</span>\r\n </h3>\r\n </mat-dialog-actions>\r\n</div>", styles: ["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-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"] }]
|
|
278
|
+
args: [{ selector: 'success-message-dialog', template: "<div class=\"page\">\r\n <span mat-dialog-title class=\"dialog-header\" mat-button>\r\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\r\n </span>\r\n\r\n <mat-dialog-content class=\"mat-typography\">\r\n <div class=\"success-icon\">\r\n <fa-icon icon=\"calendar-check\"></fa-icon>\r\n </div>\r\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\r\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\r\n </mat-dialog-content>\r\n <div class=\"divider\"></div>\r\n <mat-dialog-actions class=\"dialog-footer\">\r\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\r\n another form</span>\r\n </h3>\r\n </mat-dialog-actions>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
279
279
|
}], ctorParameters: function () { return [{ type: i1$2.MatDialogRef }, { type: i1.Router }]; } });
|
|
280
280
|
|
|
281
281
|
var PageSectionStyleThirteen;
|
|
@@ -308,10 +308,10 @@ class PageSectionStyleThirteenComponent {
|
|
|
308
308
|
}
|
|
309
309
|
}
|
|
310
310
|
PageSectionStyleThirteenComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThirteenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
311
|
-
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\">\r\n <div class=\"left-side\">\r\n <div class=\"headline\">\r\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"items\">\r\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\r\n <div class=\"left-column\">\r\n\r\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\r\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\r\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\r\n <img [src]=\"item.iconImage\" alt=\"\">\r\n </div>\r\n </div>\r\n <div></div>\r\n </div>\r\n <div class=\"right-column\">\r\n <div class=\"item-title\">{{item.title}}</div>\r\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\r\n {{item.description}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\r\n <div class=\"image-container\">\r\n <img [src]=\"showedImage\" alt=\"\">\r\n </div>\r\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\r\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.why-choose-us{display:flex;flex-direction:row;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:48%}.why-choose-us .items{display:grid;gap:2.5rem;width:100%}.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}@media only screen and (max-width: 37.5em){.why-choose-us .item{max-width:90vw}}.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;row-gap:2%}.why-choose-us .left-side,.why-choose-us .right-side{width:100%}.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 .5s;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", "withoutTitleCase"] }] });
|
|
311
|
+
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\">\r\n <div class=\"left-side\">\r\n <div class=\"headline\">\r\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"items\">\r\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\r\n <div class=\"left-column\">\r\n\r\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\r\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\r\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\r\n <img [src]=\"item.iconImage\" alt=\"\">\r\n </div>\r\n </div>\r\n <div></div>\r\n </div>\r\n <div class=\"right-column\">\r\n <div class=\"item-title\">{{item.title}}</div>\r\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\r\n {{item.description}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\r\n <div class=\"image-container\">\r\n <img [src]=\"showedImage\" alt=\"\">\r\n </div>\r\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\r\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.why-choose-us{display:flex;flex-direction:row;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:48%}.why-choose-us .items{display:grid;gap:2.5rem;width:100%}.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}@media only screen and (max-width: 37.5em){.why-choose-us .item{max-width:90vw}}.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;row-gap:2%}.why-choose-us .left-side,.why-choose-us .right-side{width:100%}.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 .5s;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", "withoutTitleCase"] }] });
|
|
312
312
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThirteenComponent, decorators: [{
|
|
313
313
|
type: Component,
|
|
314
|
-
args: [{ selector: 'page-section-style-thirteen', template: "<div class=\"why-choose-us\">\r\n <div class=\"left-side\">\r\n <div class=\"headline\">\r\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"items\">\r\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\r\n <div class=\"left-column\">\r\n\r\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\r\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\r\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\r\n <img [src]=\"item.iconImage\" alt=\"\">\r\n </div>\r\n </div>\r\n <div></div>\r\n </div>\r\n <div class=\"right-column\">\r\n <div class=\"item-title\">{{item.title}}</div>\r\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\r\n {{item.description}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\r\n <div class=\"image-container\">\r\n <img [src]=\"showedImage\" alt=\"\">\r\n </div>\r\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\r\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.why-choose-us{display:flex;flex-direction:row;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:48%}.why-choose-us .items{display:grid;gap:2.5rem;width:100%}.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}@media only screen and (max-width: 37.5em){.why-choose-us .item{max-width:90vw}}.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;row-gap:2%}.why-choose-us .left-side,.why-choose-us .right-side{width:100%}.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 .5s;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"] }]
|
|
314
|
+
args: [{ selector: 'page-section-style-thirteen', template: "<div class=\"why-choose-us\">\r\n <div class=\"left-side\">\r\n <div class=\"headline\">\r\n <section-title [sectionTitle]=\"sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"items\">\r\n <div class=\"item\" *ngFor=\"let item of items; let i=index\" [ngClass]=\"{'hovered-item': isItemHovered[i]}\" (click)=\"onClickChangeImage(item.image, i)\">\r\n <div class=\"left-column\">\r\n\r\n <div class=\"square-row\" [ngSwitch]=\"iconType\" [ngClass]=\"{'square-row':iconType == pageSectionStyleThirteen.SHAPE_ICON,'shape-column':iconType == pageSectionStyleThirteen.IMAGE_ICON}\">\r\n <div class=\"square\" *ngSwitchCase=\"pageSectionStyleThirteen.SHAPE_ICON\"></div>\r\n <div class=\"shape\" *ngSwitchCase=\"pageSectionStyleThirteen.IMAGE_ICON\">\r\n <img [src]=\"item.iconImage\" alt=\"\">\r\n </div>\r\n </div>\r\n <div></div>\r\n </div>\r\n <div class=\"right-column\">\r\n <div class=\"item-title\">{{item.title}}</div>\r\n <div class=\"item-description\" [ngClass]=\"{'hide-description':!isItemHovered[i] , 'show-description':isItemHovered[i] }\">\r\n {{item.description}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\" [ngClass]=\"{'two-images-preview':isTwoImages}\">\r\n <div class=\"image-container\">\r\n <img [src]=\"showedImage\" alt=\"\">\r\n </div>\r\n <div class=\"back-image\" *ngIf=\"isTwoImages\">\r\n <img src=\"https://i.ibb.co/mqtpD50/blue-points-section.png\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.why-choose-us{display:flex;flex-direction:row;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:48%}.why-choose-us .items{display:grid;gap:2.5rem;width:100%}.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}@media only screen and (max-width: 37.5em){.why-choose-us .item{max-width:90vw}}.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;row-gap:2%}.why-choose-us .left-side,.why-choose-us .right-side{width:100%}.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 .5s;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"] }]
|
|
315
315
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionTitle: [{
|
|
316
316
|
type: Input
|
|
317
317
|
}], items: [{
|
|
@@ -334,10 +334,10 @@ class CallToActionSectionComponent {
|
|
|
334
334
|
}
|
|
335
335
|
}
|
|
336
336
|
CallToActionSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
337
|
-
CallToActionSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CallToActionSectionComponent, selector: "call-to-action-section", inputs: { sectionContent: "sectionContent", titleOnRightSide: "titleOnRightSide", imageBg: "imageBg", isBoxWithCard: "isBoxWithCard" }, ngImport: i0, template: "<div class=\"page\">\r\n <div class=\"cta-box\" [ngClass]=\"{'title-right-side':titleOnRightSide,'title-left-side':!titleOnRightSide,\r\n 'colored-bg':!imageBg,\r\n 'image-bg':imageBg\r\n}\" [ngStyle]=\"{'background-image': 'url(' + sectionContent.bgImage + ')', 'background-color': sectionContent.bgColor}\">\r\n <div class=\"heading-side\">\r\n <div class=\"title\">{{sectionContent.title}}</div>\r\n <div class=\"subtitle\">{{sectionContent.subtitle}}</div>\r\n <div class=\"buttons\">\r\n <span class=\"cta-link\" *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickButton(button.route)\">\r\n {{button.name}}\r\n <fa-icon icon=\"chevron-right\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"cta-side\" [ngClass]=\"{'only-an-item':sectionContent.ctaCards.length == 1 }\">\r\n <div class=\"box\" *ngFor=\"let card of sectionContent.ctaCards\" [ngClass]=\"{'box-card':isBoxWithCard, 'box-non-card':!isBoxWithCard}\">\r\n <img [src]=\"card.image\" alt=\"\" class=\"image\" *ngIf=\"card.image\">\r\n <div class=\"box-title\">\r\n {{card.title}}\r\n </div>\r\n <div class=\"box-description\" *ngIf=\"card.description \">\r\n {{card.description}}\r\n </div>\r\n <div class=\"button\">\r\n <button type=\"button\" mat-raised-button (click)=\"onClickButton(card.button.route)\">\r\n {{card.button.name}}\r\n </button>\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!isBoxWithCard && sectionContent.ctaCards.length > 1 \">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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 .title-right-side{flex-direction:row-reverse}.page .title-left-side{flex-direction:row}.page .image-bg{background-position:center;background-size:cover}.page .colored-bg{background-color:#f7f8f9}.page .colored-bg .bg-image{display:none}.page .cta-box{width:100%;display:flex;column-gap:2%;border-radius:1.5rem;position:relative;box-shadow:.2rem .2rem .4rem #00000040;padding:3rem}.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 .heading-side{display:flex;flex-direction:column;row-gap:1.5rem;width:40%}.page .cta-box .heading-side .title{color:#155ed4;font-size:3rem;font-weight:700}.page .cta-box .heading-side .subtitle{font-size:2rem;color:#32353b}.page .cta-box .heading-side .buttons{display:flex;flex-direction:row;column-gap:2rem}.page .cta-box .heading-side .buttons .cta-link{padding:.5 rem;color:#155ed4;font-size:1.6rem;cursor:pointer;transition:all ease-in-out .2s;border-bottom:.2rem solid transparent;display:flex;flex-direction:row;column-gap:1.5rem}.page .cta-box .heading-side .buttons .cta-link:hover{border-bottom:.2rem solid #155ED4}.page .cta-box .heading-side .buttons .cta-link:nth-child(even){color:#32353b}.page .cta-box .heading-side .buttons .cta-link:nth-child(even):hover{border-bottom:.2rem solid #32353B}.page .cta-box .only-an-item{justify-content:right}.page .cta-box .cta-side{display:flex;flex-direction:row;column-gap:2%;padding:1rem;height:100%;width:58%;align-items:center;padding:2rem 0}.page .cta-box .cta-side .box-card{background:#32353B;border-radius:1rem;color:#fff;box-shadow:#32325d40 0 1.3rem 2.7rem -.5rem,#0000004d 0 .8rem 1.6rem -.8rem;border:.2rem solid #ffffff;padding:1.5rem}.page .cta-box .cta-side .box-card .button button{color:#155ed4;background-color:#f7f8f9}.page .cta-box .cta-side .box-non-card{color:#32353b;height:100%}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button{padding-left:1rem;border-left:.3rem transparent solid}.page .cta-box .cta-side .box-non-card .image{margin-left:1.3rem}.page .cta-box .cta-side .box-non-card .box-title{border-left:.3rem #155ED4 solid}.page .cta-box .cta-side .box-non-card .button button{color:#fff;background-color:#32353b}.page .cta-box .cta-side .box{align-self:center;width:49%;display:flex;flex-direction:column;row-gap:1.5rem}.page .cta-box .cta-side .box .image{width:5rem;height:5rem;object-fit:cover;border-radius:.7rem;box-shadow:#0000003d 0 .3rem .8rem}.page .cta-box .cta-side .box .box-title{font-size:2.2rem;font-weight:700}.page .cta-box .cta-side .box .box-description{font-weight:400;font-size:1.8rem;margin-bottom:1rem;width:80%}.page .cta-box .cta-side .box .button button{padding:1rem;font-size:1.4rem;font-weight:600;font-family:inherit}.page .cta-box .divider{display:none}@media only screen and (max-width: 75em){.page .cta-box{flex-direction:column;row-gap:2rem}.page .cta-box .only-an-item{justify-content:center;width:50%;text-align:center}.page .cta-box .only-an-item .box{margin:auto;text-align:center}.page .cta-box .only-an-item .box .box-title,.page .cta-box .only-an-item .box .box-description,.page .cta-box .only-an-item .box .button,.page .cta-box .only-an-item .box .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .only-an-item .box .box-title{border-left:none}.page .cta-box .cta-side,.page .cta-box .heading-side{width:100%}}@media only screen and (max-width: 37.5em){.page .cta-box .cta-side{flex-direction:column;row-gap:4rem}.page .cta-box .cta-side .box-non-card{margin:auto;text-align:center}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button,.page .cta-box .cta-side .box-non-card .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .cta-side .box-non-card .box-title{border-left:none}.page .cta-box .cta-side .box-non-card:first-child .divider{display:grid;width:40%;border:.2rem solid #155ED4;margin:2.5rem auto 0}.page .cta-box .cta-side .box{width:100%}.page .cta-box .cta-side .box .box-title{font-size:2rem}.page .cta-box .cta-side .box .box-description{font-size:1.6rem}.page .cta-box .heading-side{text-align:center}.page .cta-box .heading-side .buttons{justify-content: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.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: i4.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"] }] });
|
|
337
|
+
CallToActionSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CallToActionSectionComponent, selector: "call-to-action-section", inputs: { sectionContent: "sectionContent", titleOnRightSide: "titleOnRightSide", imageBg: "imageBg", isBoxWithCard: "isBoxWithCard" }, ngImport: i0, template: "<div class=\"page\">\r\n <div class=\"cta-box\" [ngClass]=\"{'title-right-side':titleOnRightSide,'title-left-side':!titleOnRightSide,\r\n 'colored-bg':!imageBg,\r\n 'image-bg':imageBg\r\n}\" [ngStyle]=\"{'background-image': 'url(' + sectionContent.bgImage + ')', 'background-color': sectionContent.bgColor}\">\r\n <div class=\"heading-side\">\r\n <div class=\"title\">{{sectionContent.title}}</div>\r\n <div class=\"subtitle\">{{sectionContent.subtitle}}</div>\r\n <div class=\"buttons\">\r\n <span class=\"cta-link\" *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickButton(button.route)\">\r\n {{button.name}}\r\n <fa-icon icon=\"chevron-right\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"cta-side\" [ngClass]=\"{'only-an-item':sectionContent.ctaCards.length == 1 }\">\r\n <div class=\"box\" *ngFor=\"let card of sectionContent.ctaCards\" [ngClass]=\"{'box-card':isBoxWithCard, 'box-non-card':!isBoxWithCard}\">\r\n <img [src]=\"card.image\" alt=\"\" class=\"image\" *ngIf=\"card.image\">\r\n <div class=\"box-title\">\r\n {{card.title}}\r\n </div>\r\n <div class=\"box-description\" *ngIf=\"card.description \">\r\n {{card.description}}\r\n </div>\r\n <div class=\"button\">\r\n <button type=\"button\" mat-raised-button (click)=\"onClickButton(card.button.route)\">\r\n {{card.button.name}}\r\n </button>\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!isBoxWithCard && sectionContent.ctaCards.length > 1 \">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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 .title-right-side{flex-direction:row-reverse}.page .title-left-side{flex-direction:row}.page .image-bg{background-position:center;background-size:cover}.page .colored-bg{background-color:#f7f8f9}.page .colored-bg .bg-image{display:none}.page .cta-box{width:100%;display:flex;column-gap:2%;border-radius:1.5rem;position:relative;box-shadow:.2rem .2rem .4rem #00000040;padding:3rem}.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 .heading-side{display:flex;flex-direction:column;row-gap:1.5rem;width:40%}.page .cta-box .heading-side .title{color:#155ed4;font-size:3rem;font-weight:700}.page .cta-box .heading-side .subtitle{font-size:2rem;color:#32353b}.page .cta-box .heading-side .buttons{display:flex;flex-direction:row;column-gap:2rem}.page .cta-box .heading-side .buttons .cta-link{padding:.5 rem;color:#155ed4;font-size:1.6rem;cursor:pointer;transition:all ease-in-out .2s;border-bottom:.2rem solid transparent;display:flex;flex-direction:row;column-gap:1.5rem}.page .cta-box .heading-side .buttons .cta-link:hover{border-bottom:.2rem solid #155ED4}.page .cta-box .heading-side .buttons .cta-link:nth-child(even){color:#32353b}.page .cta-box .heading-side .buttons .cta-link:nth-child(even):hover{border-bottom:.2rem solid #32353B}.page .cta-box .only-an-item{justify-content:right}.page .cta-box .cta-side{display:flex;flex-direction:row;column-gap:2%;padding:1rem;height:100%;width:58%;align-items:center;padding:2rem 0}.page .cta-box .cta-side .box-card{background:#32353B;border-radius:1rem;color:#fff;box-shadow:#32325d40 0 1.3rem 2.7rem -.5rem,#0000004d 0 .8rem 1.6rem -.8rem;border:.2rem solid #ffffff;padding:1.5rem}.page .cta-box .cta-side .box-card .button button{color:#155ed4;background-color:#f7f8f9}.page .cta-box .cta-side .box-non-card{color:#32353b;height:100%}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button{padding-left:1rem;border-left:.3rem transparent solid}.page .cta-box .cta-side .box-non-card .image{margin-left:1.3rem}.page .cta-box .cta-side .box-non-card .box-title{border-left:.3rem #155ED4 solid}.page .cta-box .cta-side .box-non-card .button button{color:#fff;background-color:#32353b}.page .cta-box .cta-side .box{align-self:center;width:49%;display:flex;flex-direction:column;row-gap:1.5rem}.page .cta-box .cta-side .box .image{width:5rem;height:5rem;object-fit:cover;border-radius:.7rem;box-shadow:#0000003d 0 .3rem .8rem}.page .cta-box .cta-side .box .box-title{font-size:2.2rem;font-weight:700}.page .cta-box .cta-side .box .box-description{font-weight:400;font-size:1.8rem;margin-bottom:1rem;width:80%}.page .cta-box .cta-side .box .button button{padding:1rem;font-size:1.4rem;font-weight:600;font-family:inherit}.page .cta-box .divider{display:none}@media only screen and (max-width: 75em){.page .cta-box{flex-direction:column;row-gap:2rem}.page .cta-box .only-an-item{justify-content:center;width:50%;text-align:center}.page .cta-box .only-an-item .box{margin:auto;text-align:center}.page .cta-box .only-an-item .box .box-title,.page .cta-box .only-an-item .box .box-description,.page .cta-box .only-an-item .box .button,.page .cta-box .only-an-item .box .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .only-an-item .box .box-title{border-left:none}.page .cta-box .cta-side,.page .cta-box .heading-side{width:100%}}@media only screen and (max-width: 37.5em){.page .cta-box .cta-side{flex-direction:column;row-gap:4rem}.page .cta-box .cta-side .box-non-card{margin:auto;text-align:center}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button,.page .cta-box .cta-side .box-non-card .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .cta-side .box-non-card .box-title{border-left:none}.page .cta-box .cta-side .box-non-card:first-child .divider{display:grid;width:40%;border:.2rem solid #155ED4;margin:2.5rem auto 0}.page .cta-box .cta-side .box{width:100%}.page .cta-box .cta-side .box .box-title{font-size:2rem}.page .cta-box .cta-side .box .box-description{font-size:1.6rem}.page .cta-box .heading-side{text-align:center}.page .cta-box .heading-side .buttons{justify-content: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.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: i4.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"] }] });
|
|
338
338
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionComponent, decorators: [{
|
|
339
339
|
type: Component,
|
|
340
|
-
args: [{ selector: 'call-to-action-section', template: "<div class=\"page\">\r\n <div class=\"cta-box\" [ngClass]=\"{'title-right-side':titleOnRightSide,'title-left-side':!titleOnRightSide,\r\n 'colored-bg':!imageBg,\r\n 'image-bg':imageBg\r\n}\" [ngStyle]=\"{'background-image': 'url(' + sectionContent.bgImage + ')', 'background-color': sectionContent.bgColor}\">\r\n <div class=\"heading-side\">\r\n <div class=\"title\">{{sectionContent.title}}</div>\r\n <div class=\"subtitle\">{{sectionContent.subtitle}}</div>\r\n <div class=\"buttons\">\r\n <span class=\"cta-link\" *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickButton(button.route)\">\r\n {{button.name}}\r\n <fa-icon icon=\"chevron-right\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"cta-side\" [ngClass]=\"{'only-an-item':sectionContent.ctaCards.length == 1 }\">\r\n <div class=\"box\" *ngFor=\"let card of sectionContent.ctaCards\" [ngClass]=\"{'box-card':isBoxWithCard, 'box-non-card':!isBoxWithCard}\">\r\n <img [src]=\"card.image\" alt=\"\" class=\"image\" *ngIf=\"card.image\">\r\n <div class=\"box-title\">\r\n {{card.title}}\r\n </div>\r\n <div class=\"box-description\" *ngIf=\"card.description \">\r\n {{card.description}}\r\n </div>\r\n <div class=\"button\">\r\n <button type=\"button\" mat-raised-button (click)=\"onClickButton(card.button.route)\">\r\n {{card.button.name}}\r\n </button>\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!isBoxWithCard && sectionContent.ctaCards.length > 1 \">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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 .title-right-side{flex-direction:row-reverse}.page .title-left-side{flex-direction:row}.page .image-bg{background-position:center;background-size:cover}.page .colored-bg{background-color:#f7f8f9}.page .colored-bg .bg-image{display:none}.page .cta-box{width:100%;display:flex;column-gap:2%;border-radius:1.5rem;position:relative;box-shadow:.2rem .2rem .4rem #00000040;padding:3rem}.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 .heading-side{display:flex;flex-direction:column;row-gap:1.5rem;width:40%}.page .cta-box .heading-side .title{color:#155ed4;font-size:3rem;font-weight:700}.page .cta-box .heading-side .subtitle{font-size:2rem;color:#32353b}.page .cta-box .heading-side .buttons{display:flex;flex-direction:row;column-gap:2rem}.page .cta-box .heading-side .buttons .cta-link{padding:.5 rem;color:#155ed4;font-size:1.6rem;cursor:pointer;transition:all ease-in-out .2s;border-bottom:.2rem solid transparent;display:flex;flex-direction:row;column-gap:1.5rem}.page .cta-box .heading-side .buttons .cta-link:hover{border-bottom:.2rem solid #155ED4}.page .cta-box .heading-side .buttons .cta-link:nth-child(even){color:#32353b}.page .cta-box .heading-side .buttons .cta-link:nth-child(even):hover{border-bottom:.2rem solid #32353B}.page .cta-box .only-an-item{justify-content:right}.page .cta-box .cta-side{display:flex;flex-direction:row;column-gap:2%;padding:1rem;height:100%;width:58%;align-items:center;padding:2rem 0}.page .cta-box .cta-side .box-card{background:#32353B;border-radius:1rem;color:#fff;box-shadow:#32325d40 0 1.3rem 2.7rem -.5rem,#0000004d 0 .8rem 1.6rem -.8rem;border:.2rem solid #ffffff;padding:1.5rem}.page .cta-box .cta-side .box-card .button button{color:#155ed4;background-color:#f7f8f9}.page .cta-box .cta-side .box-non-card{color:#32353b;height:100%}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button{padding-left:1rem;border-left:.3rem transparent solid}.page .cta-box .cta-side .box-non-card .image{margin-left:1.3rem}.page .cta-box .cta-side .box-non-card .box-title{border-left:.3rem #155ED4 solid}.page .cta-box .cta-side .box-non-card .button button{color:#fff;background-color:#32353b}.page .cta-box .cta-side .box{align-self:center;width:49%;display:flex;flex-direction:column;row-gap:1.5rem}.page .cta-box .cta-side .box .image{width:5rem;height:5rem;object-fit:cover;border-radius:.7rem;box-shadow:#0000003d 0 .3rem .8rem}.page .cta-box .cta-side .box .box-title{font-size:2.2rem;font-weight:700}.page .cta-box .cta-side .box .box-description{font-weight:400;font-size:1.8rem;margin-bottom:1rem;width:80%}.page .cta-box .cta-side .box .button button{padding:1rem;font-size:1.4rem;font-weight:600;font-family:inherit}.page .cta-box .divider{display:none}@media only screen and (max-width: 75em){.page .cta-box{flex-direction:column;row-gap:2rem}.page .cta-box .only-an-item{justify-content:center;width:50%;text-align:center}.page .cta-box .only-an-item .box{margin:auto;text-align:center}.page .cta-box .only-an-item .box .box-title,.page .cta-box .only-an-item .box .box-description,.page .cta-box .only-an-item .box .button,.page .cta-box .only-an-item .box .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .only-an-item .box .box-title{border-left:none}.page .cta-box .cta-side,.page .cta-box .heading-side{width:100%}}@media only screen and (max-width: 37.5em){.page .cta-box .cta-side{flex-direction:column;row-gap:4rem}.page .cta-box .cta-side .box-non-card{margin:auto;text-align:center}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button,.page .cta-box .cta-side .box-non-card .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .cta-side .box-non-card .box-title{border-left:none}.page .cta-box .cta-side .box-non-card:first-child .divider{display:grid;width:40%;border:.2rem solid #155ED4;margin:2.5rem auto 0}.page .cta-box .cta-side .box{width:100%}.page .cta-box .cta-side .box .box-title{font-size:2rem}.page .cta-box .cta-side .box .box-description{font-size:1.6rem}.page .cta-box .heading-side{text-align:center}.page .cta-box .heading-side .buttons{justify-content:center}}\n"] }]
|
|
340
|
+
args: [{ selector: 'call-to-action-section', template: "<div class=\"page\">\r\n <div class=\"cta-box\" [ngClass]=\"{'title-right-side':titleOnRightSide,'title-left-side':!titleOnRightSide,\r\n 'colored-bg':!imageBg,\r\n 'image-bg':imageBg\r\n}\" [ngStyle]=\"{'background-image': 'url(' + sectionContent.bgImage + ')', 'background-color': sectionContent.bgColor}\">\r\n <div class=\"heading-side\">\r\n <div class=\"title\">{{sectionContent.title}}</div>\r\n <div class=\"subtitle\">{{sectionContent.subtitle}}</div>\r\n <div class=\"buttons\">\r\n <span class=\"cta-link\" *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickButton(button.route)\">\r\n {{button.name}}\r\n <fa-icon icon=\"chevron-right\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n <div class=\"cta-side\" [ngClass]=\"{'only-an-item':sectionContent.ctaCards.length == 1 }\">\r\n <div class=\"box\" *ngFor=\"let card of sectionContent.ctaCards\" [ngClass]=\"{'box-card':isBoxWithCard, 'box-non-card':!isBoxWithCard}\">\r\n <img [src]=\"card.image\" alt=\"\" class=\"image\" *ngIf=\"card.image\">\r\n <div class=\"box-title\">\r\n {{card.title}}\r\n </div>\r\n <div class=\"box-description\" *ngIf=\"card.description \">\r\n {{card.description}}\r\n </div>\r\n <div class=\"button\">\r\n <button type=\"button\" mat-raised-button (click)=\"onClickButton(card.button.route)\">\r\n {{card.button.name}}\r\n </button>\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!isBoxWithCard && sectionContent.ctaCards.length > 1 \">\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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 .title-right-side{flex-direction:row-reverse}.page .title-left-side{flex-direction:row}.page .image-bg{background-position:center;background-size:cover}.page .colored-bg{background-color:#f7f8f9}.page .colored-bg .bg-image{display:none}.page .cta-box{width:100%;display:flex;column-gap:2%;border-radius:1.5rem;position:relative;box-shadow:.2rem .2rem .4rem #00000040;padding:3rem}.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 .heading-side{display:flex;flex-direction:column;row-gap:1.5rem;width:40%}.page .cta-box .heading-side .title{color:#155ed4;font-size:3rem;font-weight:700}.page .cta-box .heading-side .subtitle{font-size:2rem;color:#32353b}.page .cta-box .heading-side .buttons{display:flex;flex-direction:row;column-gap:2rem}.page .cta-box .heading-side .buttons .cta-link{padding:.5 rem;color:#155ed4;font-size:1.6rem;cursor:pointer;transition:all ease-in-out .2s;border-bottom:.2rem solid transparent;display:flex;flex-direction:row;column-gap:1.5rem}.page .cta-box .heading-side .buttons .cta-link:hover{border-bottom:.2rem solid #155ED4}.page .cta-box .heading-side .buttons .cta-link:nth-child(even){color:#32353b}.page .cta-box .heading-side .buttons .cta-link:nth-child(even):hover{border-bottom:.2rem solid #32353B}.page .cta-box .only-an-item{justify-content:right}.page .cta-box .cta-side{display:flex;flex-direction:row;column-gap:2%;padding:1rem;height:100%;width:58%;align-items:center;padding:2rem 0}.page .cta-box .cta-side .box-card{background:#32353B;border-radius:1rem;color:#fff;box-shadow:#32325d40 0 1.3rem 2.7rem -.5rem,#0000004d 0 .8rem 1.6rem -.8rem;border:.2rem solid #ffffff;padding:1.5rem}.page .cta-box .cta-side .box-card .button button{color:#155ed4;background-color:#f7f8f9}.page .cta-box .cta-side .box-non-card{color:#32353b;height:100%}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button{padding-left:1rem;border-left:.3rem transparent solid}.page .cta-box .cta-side .box-non-card .image{margin-left:1.3rem}.page .cta-box .cta-side .box-non-card .box-title{border-left:.3rem #155ED4 solid}.page .cta-box .cta-side .box-non-card .button button{color:#fff;background-color:#32353b}.page .cta-box .cta-side .box{align-self:center;width:49%;display:flex;flex-direction:column;row-gap:1.5rem}.page .cta-box .cta-side .box .image{width:5rem;height:5rem;object-fit:cover;border-radius:.7rem;box-shadow:#0000003d 0 .3rem .8rem}.page .cta-box .cta-side .box .box-title{font-size:2.2rem;font-weight:700}.page .cta-box .cta-side .box .box-description{font-weight:400;font-size:1.8rem;margin-bottom:1rem;width:80%}.page .cta-box .cta-side .box .button button{padding:1rem;font-size:1.4rem;font-weight:600;font-family:inherit}.page .cta-box .divider{display:none}@media only screen and (max-width: 75em){.page .cta-box{flex-direction:column;row-gap:2rem}.page .cta-box .only-an-item{justify-content:center;width:50%;text-align:center}.page .cta-box .only-an-item .box{margin:auto;text-align:center}.page .cta-box .only-an-item .box .box-title,.page .cta-box .only-an-item .box .box-description,.page .cta-box .only-an-item .box .button,.page .cta-box .only-an-item .box .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .only-an-item .box .box-title{border-left:none}.page .cta-box .cta-side,.page .cta-box .heading-side{width:100%}}@media only screen and (max-width: 37.5em){.page .cta-box .cta-side{flex-direction:column;row-gap:4rem}.page .cta-box .cta-side .box-non-card{margin:auto;text-align:center}.page .cta-box .cta-side .box-non-card .box-title,.page .cta-box .cta-side .box-non-card .box-description,.page .cta-box .cta-side .box-non-card .button,.page .cta-box .cta-side .box-non-card .image{padding-left:0;border-left:none;margin:auto}.page .cta-box .cta-side .box-non-card .box-title{border-left:none}.page .cta-box .cta-side .box-non-card:first-child .divider{display:grid;width:40%;border:.2rem solid #155ED4;margin:2.5rem auto 0}.page .cta-box .cta-side .box{width:100%}.page .cta-box .cta-side .box .box-title{font-size:2rem}.page .cta-box .cta-side .box .box-description{font-size:1.6rem}.page .cta-box .heading-side{text-align:center}.page .cta-box .heading-side .buttons{justify-content:center}}\n"] }]
|
|
341
341
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
342
342
|
type: Input
|
|
343
343
|
}], titleOnRightSide: [{
|
|
@@ -384,10 +384,10 @@ class TeamComponent {
|
|
|
384
384
|
}
|
|
385
385
|
}
|
|
386
386
|
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 });
|
|
387
|
-
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\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\r\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\r\n <div class=\"image-container\">\r\n <img [src]=\"teamMember.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{teamMember.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{teamMember.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\r\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-member pTemplate=\"item\">\r\n <div class=\"member-card\">\r\n <div class=\"image-container\">\r\n <img [src]=\"member.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{member.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{member.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n <div class=\"caption-text\">\r\n {{sectionContent.caption}}\r\n </div>\r\n</div>", styles: ["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-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:100%;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$1.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", "withoutTitleCase"] }] });
|
|
387
|
+
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\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\r\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\r\n <div class=\"image-container\">\r\n <img [src]=\"teamMember.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{teamMember.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{teamMember.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\r\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-member pTemplate=\"item\">\r\n <div class=\"member-card\">\r\n <div class=\"image-container\">\r\n <img [src]=\"member.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{member.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{member.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n <div class=\"caption-text\">\r\n {{sectionContent.caption}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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:100%;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$1.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", "withoutTitleCase"] }] });
|
|
388
388
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TeamComponent, decorators: [{
|
|
389
389
|
type: Component,
|
|
390
|
-
args: [{ selector: 'team', template: "<div class=\"page\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\r\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\r\n <div class=\"image-container\">\r\n <img [src]=\"teamMember.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{teamMember.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{teamMember.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\r\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-member pTemplate=\"item\">\r\n <div class=\"member-card\">\r\n <div class=\"image-container\">\r\n <img [src]=\"member.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{member.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{member.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n <div class=\"caption-text\">\r\n {{sectionContent.caption}}\r\n </div>\r\n</div>", styles: ["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-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:100%;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"] }]
|
|
390
|
+
args: [{ selector: 'team', template: "<div class=\"page\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\r\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\r\n <div class=\"image-container\">\r\n <img [src]=\"teamMember.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{teamMember.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{teamMember.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\r\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-member pTemplate=\"item\">\r\n <div class=\"member-card\">\r\n <div class=\"image-container\">\r\n <img [src]=\"member.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{member.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{member.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n <div class=\"caption-text\">\r\n {{sectionContent.caption}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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:100%;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"] }]
|
|
391
391
|
}], ctorParameters: function () { return [{ type: i1.Router }, { type: i1$1.BreakpointObserver }]; }, propDecorators: { sectionContent: [{
|
|
392
392
|
type: Input
|
|
393
393
|
}] } });
|
|
@@ -415,10 +415,10 @@ class ValuesComponent {
|
|
|
415
415
|
}
|
|
416
416
|
}
|
|
417
417
|
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 });
|
|
418
|
-
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\">\r\n <section-title [sectionTitle]=\"newSectionContent.sectionTitle\"></section-title>\r\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"card\" *ngFor=\"let card of newSectionContent.cards\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"newSectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-card pTemplate=\"item\">\r\n <div class=\"card\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n</div>", styles: ["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-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 .image img{width:4rem;height:4rem;aspect-ratio:3/2;object-fit:contain}.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$1.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", "withoutTitleCase"] }] });
|
|
418
|
+
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\">\r\n <section-title [sectionTitle]=\"newSectionContent.sectionTitle\"></section-title>\r\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"card\" *ngFor=\"let card of newSectionContent.cards\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"newSectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-card pTemplate=\"item\">\r\n <div class=\"card\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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 .image img{width:4rem;height:4rem;aspect-ratio:3/2;object-fit:contain}.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$1.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", "withoutTitleCase"] }] });
|
|
419
419
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, decorators: [{
|
|
420
420
|
type: Component,
|
|
421
|
-
args: [{ selector: 'values', template: "<div class=\"page\">\r\n <section-title [sectionTitle]=\"newSectionContent.sectionTitle\"></section-title>\r\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"card\" *ngFor=\"let card of newSectionContent.cards\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"newSectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-card pTemplate=\"item\">\r\n <div class=\"card\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n</div>", styles: ["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-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 .image img{width:4rem;height:4rem;aspect-ratio:3/2;object-fit:contain}.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"] }]
|
|
421
|
+
args: [{ selector: 'values', template: "<div class=\"page\">\r\n <section-title [sectionTitle]=\"newSectionContent.sectionTitle\"></section-title>\r\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"card\" *ngFor=\"let card of newSectionContent.cards\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"newSectionContent.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-card pTemplate=\"item\">\r\n <div class=\"card\">\r\n <div class=\"card-headline\">\r\n <div class=\"icon\" *ngIf=\"card.icon\">\r\n <fa-icon [icon]=\"card.icon\"></fa-icon>\r\n </div>\r\n <div class=\"image\" *ngIf=\"!card.icon\">\r\n <img [src]=\"card.image\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{card.title}}\r\n </div>\r\n </div>\r\n <div class=\"value-description\">\r\n {{card.subtitle}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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 .image img{width:4rem;height:4rem;aspect-ratio:3/2;object-fit:contain}.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"] }]
|
|
422
422
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }]; }, propDecorators: { sectionContent: [{
|
|
423
423
|
type: Input
|
|
424
424
|
}], withBgImage: [{
|
|
@@ -434,10 +434,10 @@ class OurClientListingComponent {
|
|
|
434
434
|
}
|
|
435
435
|
}
|
|
436
436
|
OurClientListingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientListingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
437
|
-
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\">\r\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\r\n</div>", styles: ["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-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"] });
|
|
437
|
+
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\">\r\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] });
|
|
438
438
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientListingComponent, decorators: [{
|
|
439
439
|
type: Component,
|
|
440
|
-
args: [{ selector: "our-client-listing", template: "<div class=\"client\">\r\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\r\n</div>", styles: ["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-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"] }]
|
|
440
|
+
args: [{ selector: "our-client-listing", template: "<div class=\"client\">\r\n <img class=\"image\" [src]=\"account.profilePicture\" alt=\"\" />\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
441
441
|
}], ctorParameters: function () { return []; }, propDecorators: { account: [{
|
|
442
442
|
type: Input
|
|
443
443
|
}] } });
|
|
@@ -482,10 +482,10 @@ class OurClientsComponent {
|
|
|
482
482
|
}
|
|
483
483
|
}
|
|
484
484
|
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 });
|
|
485
|
-
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\"\r\n orientation=\"horizantol\" [circular]=\"true\">\r\n <ng-template let-client pTemplate=\"item\">\r\n <div>\r\n <our-client-listing class=\"client\" [account]=\"client\">\r\n </our-client-listing>\r\n </div>\r\n </ng-template>\r\n</p-carousel>", styles: ["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-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$1.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"] }] });
|
|
485
|
+
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\"\r\n orientation=\"horizantol\" [circular]=\"true\">\r\n <ng-template let-client pTemplate=\"item\">\r\n <div>\r\n <our-client-listing class=\"client\" [account]=\"client\">\r\n </our-client-listing>\r\n </div>\r\n </ng-template>\r\n</p-carousel>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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$1.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"] }] });
|
|
486
486
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: OurClientsComponent, decorators: [{
|
|
487
487
|
type: Component,
|
|
488
|
-
args: [{ selector: "our-clients", template: "<p-carousel class=\"custom\" [value]=\"accounts\" [numVisible]=\"clientsToShow\" [numScroll]=\"scrollClientNumber\" [page]=\"0\"\r\n orientation=\"horizantol\" [circular]=\"true\">\r\n <ng-template let-client pTemplate=\"item\">\r\n <div>\r\n <our-client-listing class=\"client\" [account]=\"client\">\r\n </our-client-listing>\r\n </div>\r\n </ng-template>\r\n</p-carousel>", styles: ["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-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"] }]
|
|
488
|
+
args: [{ selector: "our-clients", template: "<p-carousel class=\"custom\" [value]=\"accounts\" [numVisible]=\"clientsToShow\" [numScroll]=\"scrollClientNumber\" [page]=\"0\"\r\n orientation=\"horizantol\" [circular]=\"true\">\r\n <ng-template let-client pTemplate=\"item\">\r\n <div>\r\n <our-client-listing class=\"client\" [account]=\"client\">\r\n </our-client-listing>\r\n </div>\r\n </ng-template>\r\n</p-carousel>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
489
489
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }]; }, propDecorators: { accounts: [{
|
|
490
490
|
type: Input
|
|
491
491
|
}] } });
|
|
@@ -500,10 +500,10 @@ class PageSectionWithMultipleCardsComponent {
|
|
|
500
500
|
}
|
|
501
501
|
}
|
|
502
502
|
PageSectionWithMultipleCardsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionWithMultipleCardsComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
503
|
-
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\">\r\n <div class=\"text-part\">\r\n <h2 class=\"tip-title\">\r\n {{sectionContent.tipTitle}}\r\n </h2>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\r\n <div class=\"card-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\r\n <path\r\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\" />\r\n </svg>\r\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"card-title\">\r\n {{reason.title}}\r\n </div>\r\n <div class=\"card-description\">\r\n {{reason.description}}\r\n </div>\r\n </div>\r\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\r\n <div class=\"card-title\">\r\n {{sectionContent.allReasonsBox.ctaText}}\r\n </div>\r\n <div class=\"icon-circle\">\r\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\r\n </div>\r\n </button>\r\n\r\n</div>", styles: ["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-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", "withoutTitleCase"] }] });
|
|
503
|
+
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\">\r\n <div class=\"text-part\">\r\n <h2 class=\"tip-title\">\r\n {{sectionContent.tipTitle}}\r\n </h2>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\r\n <div class=\"card-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\r\n <path\r\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\" />\r\n </svg>\r\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"card-title\">\r\n {{reason.title}}\r\n </div>\r\n <div class=\"card-description\">\r\n {{reason.description}}\r\n </div>\r\n </div>\r\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\r\n <div class=\"card-title\">\r\n {{sectionContent.allReasonsBox.ctaText}}\r\n </div>\r\n <div class=\"icon-circle\">\r\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\r\n </div>\r\n </button>\r\n\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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", "withoutTitleCase"] }] });
|
|
504
504
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionWithMultipleCardsComponent, decorators: [{
|
|
505
505
|
type: Component,
|
|
506
|
-
args: [{ selector: 'page-section-with-multiple-cards', template: "<div class=\"page\">\r\n <div class=\"text-part\">\r\n <h2 class=\"tip-title\">\r\n {{sectionContent.tipTitle}}\r\n </h2>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\r\n <div class=\"card-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\r\n <path\r\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\" />\r\n </svg>\r\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"card-title\">\r\n {{reason.title}}\r\n </div>\r\n <div class=\"card-description\">\r\n {{reason.description}}\r\n </div>\r\n </div>\r\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\r\n <div class=\"card-title\">\r\n {{sectionContent.allReasonsBox.ctaText}}\r\n </div>\r\n <div class=\"icon-circle\">\r\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\r\n </div>\r\n </button>\r\n\r\n</div>", styles: ["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-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"] }]
|
|
506
|
+
args: [{ selector: 'page-section-with-multiple-cards', template: "<div class=\"page\">\r\n <div class=\"text-part\">\r\n <h2 class=\"tip-title\">\r\n {{sectionContent.tipTitle}}\r\n </h2>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\r\n <div class=\"card-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\r\n <path\r\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\" />\r\n </svg>\r\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"card-title\">\r\n {{reason.title}}\r\n </div>\r\n <div class=\"card-description\">\r\n {{reason.description}}\r\n </div>\r\n </div>\r\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\r\n <div class=\"card-title\">\r\n {{sectionContent.allReasonsBox.ctaText}}\r\n </div>\r\n <div class=\"icon-circle\">\r\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\r\n </div>\r\n </button>\r\n\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
507
507
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
508
508
|
type: Input
|
|
509
509
|
}] } });
|
|
@@ -519,10 +519,10 @@ class CallToActionSectionTwoComponent {
|
|
|
519
519
|
}
|
|
520
520
|
}
|
|
521
521
|
CallToActionSectionTwoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionTwoComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
522
|
-
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: "<section class=\"section\">\r\n <header class=\"logo-container\" *ngIf=\"sectionContent.withImage\">\r\n <img class=\"logo\" [src]=\"sectionContent.imagePath\" alt=\"Logo\">\r\n </header>\r\n <h1 class=\"title\">\r\n {{sectionContent.title}}\r\n </h1>\r\n <h3 class=\"subtitle\">\r\n {{sectionContent.subtitle}}<ng-content></ng-content>\r\n </h3>\r\n</section>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{background-color:#f7f8f9;display:flex;flex-direction:column;row-gap:1.5rem;border-radius:1.5rem;padding:2rem;width:100%;justify-content:center;text-align:center}.section .logo-container{width:8rem;margin:auto}.section .logo-container .logo{width:100%}.section .title{font-size:3.4rem;font-weight:700;color:#155ed4}.section .description,.section .subtitle{color:#32353b;font-size:2rem;font-weight:500}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
522
|
+
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: "<section class=\"section\">\r\n <header class=\"logo-container\" *ngIf=\"sectionContent.withImage\">\r\n <img class=\"logo\" [src]=\"sectionContent.imagePath\" alt=\"Logo\">\r\n </header>\r\n <h1 class=\"title\">\r\n {{sectionContent.title}}\r\n </h1>\r\n <h3 class=\"subtitle\">\r\n {{sectionContent.subtitle}}<ng-content></ng-content>\r\n </h3>\r\n</section>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{background-color:#f7f8f9;display:flex;flex-direction:column;row-gap:1.5rem;border-radius:1.5rem;padding:2rem;width:100%;justify-content:center;text-align:center}.section .logo-container{width:8rem;margin:auto}.section .logo-container .logo{width:100%}.section .title{font-size:3.4rem;font-weight:700;color:#155ed4}.section .description,.section .subtitle{color:#32353b;font-size:2rem;font-weight:500}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
523
523
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CallToActionSectionTwoComponent, decorators: [{
|
|
524
524
|
type: Component,
|
|
525
|
-
args: [{ selector: 'call-to-action-section-two', template: "<section class=\"section\">\r\n <header class=\"logo-container\" *ngIf=\"sectionContent.withImage\">\r\n <img class=\"logo\" [src]=\"sectionContent.imagePath\" alt=\"Logo\">\r\n </header>\r\n <h1 class=\"title\">\r\n {{sectionContent.title}}\r\n </h1>\r\n <h3 class=\"subtitle\">\r\n {{sectionContent.subtitle}}<ng-content></ng-content>\r\n </h3>\r\n</section>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{background-color:#f7f8f9;display:flex;flex-direction:column;row-gap:1.5rem;border-radius:1.5rem;padding:2rem;width:100%;justify-content:center;text-align:center}.section .logo-container{width:8rem;margin:auto}.section .logo-container .logo{width:100%}.section .title{font-size:3.4rem;font-weight:700;color:#155ed4}.section .description,.section .subtitle{color:#32353b;font-size:2rem;font-weight:500}\n"] }]
|
|
525
|
+
args: [{ selector: 'call-to-action-section-two', template: "<section class=\"section\">\r\n <header class=\"logo-container\" *ngIf=\"sectionContent.withImage\">\r\n <img class=\"logo\" [src]=\"sectionContent.imagePath\" alt=\"Logo\">\r\n </header>\r\n <h1 class=\"title\">\r\n {{sectionContent.title}}\r\n </h1>\r\n <h3 class=\"subtitle\">\r\n {{sectionContent.subtitle}}<ng-content></ng-content>\r\n </h3>\r\n</section>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.section{background-color:#f7f8f9;display:flex;flex-direction:column;row-gap:1.5rem;border-radius:1.5rem;padding:2rem;width:100%;justify-content:center;text-align:center}.section .logo-container{width:8rem;margin:auto}.section .logo-container .logo{width:100%}.section .title{font-size:3.4rem;font-weight:700;color:#155ed4}.section .description,.section .subtitle{color:#32353b;font-size:2rem;font-weight:500}\n"] }]
|
|
526
526
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
527
527
|
type: Input
|
|
528
528
|
}] } });
|
|
@@ -547,10 +547,10 @@ class ValuePropsSectionComponent {
|
|
|
547
547
|
}
|
|
548
548
|
}
|
|
549
549
|
ValuePropsSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
550
|
-
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 }\">\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\r\n </section-title>\r\n <div class=\"value-prop-image\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n <div class=\"paragraph-items\">\r\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}\">\r\n <span class=\"value-prop-icon\">\r\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\r\n <span class=\"paragraph-text\">\r\n {{paragraph.text}}\r\n </span>\r\n </p>\r\n </div>\r\n </div>\r\n <div class=\"image-buttons-side\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;justify-content:space-between;column-gap:2%;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:58%;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:40%;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{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 .image-buttons-side,.paragraph-with-card .text-side{width:49%}.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", "withoutTitleCase"] }] });
|
|
550
|
+
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 }\">\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\r\n </section-title>\r\n <div class=\"value-prop-image\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n <div class=\"paragraph-items\">\r\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}\">\r\n <span class=\"value-prop-icon\">\r\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\r\n <span class=\"paragraph-text\">\r\n {{paragraph.text}}\r\n </span>\r\n </p>\r\n </div>\r\n </div>\r\n <div class=\"image-buttons-side\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;justify-content:space-between;column-gap:2%;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:58%;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:40%;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{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 .image-buttons-side,.paragraph-with-card .text-side{width:49%}.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", "withoutTitleCase"] }] });
|
|
551
551
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionComponent, decorators: [{
|
|
552
552
|
type: Component,
|
|
553
|
-
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 }\">\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\r\n </section-title>\r\n <div class=\"value-prop-image\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n <div class=\"paragraph-items\">\r\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}\">\r\n <span class=\"value-prop-icon\">\r\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\r\n <span class=\"paragraph-text\">\r\n {{paragraph.text}}\r\n </span>\r\n </p>\r\n </div>\r\n </div>\r\n <div class=\"image-buttons-side\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;justify-content:space-between;column-gap:2%;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:58%;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:40%;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{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 .image-buttons-side,.paragraph-with-card .text-side{width:49%}.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"] }]
|
|
553
|
+
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 }\">\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\r\n </section-title>\r\n <div class=\"value-prop-image\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n <div class=\"paragraph-items\">\r\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}\">\r\n <span class=\"value-prop-icon\">\r\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\r\n <span class=\"paragraph-text\">\r\n {{paragraph.text}}\r\n </span>\r\n </p>\r\n </div>\r\n </div>\r\n <div class=\"image-buttons-side\">\r\n <img [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;justify-content:space-between;column-gap:2%;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:58%;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:40%;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{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 .image-buttons-side,.paragraph-with-card .text-side{width:49%}.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"] }]
|
|
554
554
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
555
555
|
type: Input
|
|
556
556
|
}] } });
|
|
@@ -705,10 +705,10 @@ class ContactUsPageComponent {
|
|
|
705
705
|
}
|
|
706
706
|
}
|
|
707
707
|
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$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
708
|
-
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\">\r\n <div class=\"contact-us\">\r\n <div class=\"left-side\">\r\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\r\n <div class=\"img-title\">\r\n {{contactUsPageData.imageTitle}}\r\n </div>\r\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\r\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\r\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\r\n </div>\r\n <div class=\"social-media-icons\">\r\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\">\r\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\r\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\r\n <div class=\"content\">\r\n <div class=\"message-box\">\r\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\r\n <div class=\"full-name-area\">\r\n <div class=\"first-name\">\r\n <span class=\"fields-labels\">First Name*</span>\r\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\r\n </div>\r\n <div class=\"last-name\">\r\n <span class=\"fields-labels\">Last Name*</span>\r\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\r\n </div>\r\n </div>\r\n <span class=\"fields-labels\">Company Name*</span>\r\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\r\n <span class=\"fields-labels\">Email*</span>\r\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\r\n <span class=\"fields-labels\">Phone Number</span>\r\n <div class=\"phone-number-section\">\r\n\r\n <div class=\"countries-list\">\r\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\r\n </div>\r\n <span class=\"code-section\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\r\n </span>\r\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\r\n </div>\r\n <div class=\"subject\">\r\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\r\n </ng-select>\r\n </div>\r\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\r\n\r\n\r\n </textarea>\r\n <div class=\"actions\">\r\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"our-locations-section\">\r\n <div class=\"locations-content\">\r\n <div class=\"headline\">\r\n {{contactUsPageData.locations.headline}}\r\n </div>\r\n <div class=\"title\">\r\n {{contactUsPageData.locations.title}}\r\n </div>\r\n <div class=\"lines-img\">\r\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{contactUsPageData.locations.subtitle}}\r\n </div>\r\n <div class=\"addresses\">\r\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\r\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\r\n [circular]=\"true\">\r\n <ng-template let-address pTemplate=\"item\">\r\n <div class=\"address\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: ["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-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: i4.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", "withoutTitleCase"] }, { kind: "component", type: ChooseCountryWithFlagComponent, selector: "choose-country-with-flag", inputs: ["items"], outputs: ["change"] }] });
|
|
708
|
+
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\">\r\n <div class=\"contact-us\">\r\n <div class=\"left-side\">\r\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\r\n <div class=\"img-title\">\r\n {{contactUsPageData.imageTitle}}\r\n </div>\r\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\r\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\r\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\r\n </div>\r\n <div class=\"social-media-icons\">\r\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\">\r\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\r\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\r\n <div class=\"content\">\r\n <div class=\"message-box\">\r\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\r\n <div class=\"full-name-area\">\r\n <div class=\"first-name\">\r\n <span class=\"fields-labels\">First Name*</span>\r\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\r\n </div>\r\n <div class=\"last-name\">\r\n <span class=\"fields-labels\">Last Name*</span>\r\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\r\n </div>\r\n </div>\r\n <span class=\"fields-labels\">Company Name*</span>\r\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\r\n <span class=\"fields-labels\">Email*</span>\r\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\r\n <span class=\"fields-labels\">Phone Number</span>\r\n <div class=\"phone-number-section\">\r\n\r\n <div class=\"countries-list\">\r\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\r\n </div>\r\n <span class=\"code-section\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\r\n </span>\r\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\r\n </div>\r\n <div class=\"subject\">\r\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\r\n </ng-select>\r\n </div>\r\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\r\n\r\n\r\n </textarea>\r\n <div class=\"actions\">\r\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"our-locations-section\">\r\n <div class=\"locations-content\">\r\n <div class=\"headline\">\r\n {{contactUsPageData.locations.headline}}\r\n </div>\r\n <div class=\"title\">\r\n {{contactUsPageData.locations.title}}\r\n </div>\r\n <div class=\"lines-img\">\r\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{contactUsPageData.locations.subtitle}}\r\n </div>\r\n <div class=\"addresses\">\r\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\r\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\r\n [circular]=\"true\">\r\n <ng-template let-address pTemplate=\"item\">\r\n <div class=\"address\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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: i4.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", "withoutTitleCase"] }, { kind: "component", type: ChooseCountryWithFlagComponent, selector: "choose-country-with-flag", inputs: ["items"], outputs: ["change"] }] });
|
|
709
709
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ContactUsPageComponent, decorators: [{
|
|
710
710
|
type: Component,
|
|
711
|
-
args: [{ selector: 'contact-us-page', template: "<div class=\"page\">\r\n <div class=\"contact-us\">\r\n <div class=\"left-side\">\r\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\r\n <div class=\"img-title\">\r\n {{contactUsPageData.imageTitle}}\r\n </div>\r\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\r\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\r\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\r\n </div>\r\n <div class=\"social-media-icons\">\r\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\">\r\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\r\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\r\n <div class=\"content\">\r\n <div class=\"message-box\">\r\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\r\n <div class=\"full-name-area\">\r\n <div class=\"first-name\">\r\n <span class=\"fields-labels\">First Name*</span>\r\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\r\n </div>\r\n <div class=\"last-name\">\r\n <span class=\"fields-labels\">Last Name*</span>\r\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\r\n </div>\r\n </div>\r\n <span class=\"fields-labels\">Company Name*</span>\r\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\r\n <span class=\"fields-labels\">Email*</span>\r\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\r\n <span class=\"fields-labels\">Phone Number</span>\r\n <div class=\"phone-number-section\">\r\n\r\n <div class=\"countries-list\">\r\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\r\n </div>\r\n <span class=\"code-section\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\r\n </span>\r\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\r\n </div>\r\n <div class=\"subject\">\r\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\r\n </ng-select>\r\n </div>\r\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\r\n\r\n\r\n </textarea>\r\n <div class=\"actions\">\r\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"our-locations-section\">\r\n <div class=\"locations-content\">\r\n <div class=\"headline\">\r\n {{contactUsPageData.locations.headline}}\r\n </div>\r\n <div class=\"title\">\r\n {{contactUsPageData.locations.title}}\r\n </div>\r\n <div class=\"lines-img\">\r\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{contactUsPageData.locations.subtitle}}\r\n </div>\r\n <div class=\"addresses\">\r\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\r\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\r\n [circular]=\"true\">\r\n <ng-template let-address pTemplate=\"item\">\r\n <div class=\"address\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: ["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-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"] }]
|
|
711
|
+
args: [{ selector: 'contact-us-page', template: "<div class=\"page\">\r\n <div class=\"contact-us\">\r\n <div class=\"left-side\">\r\n <img [src]=\"contactUsPageData.backgroundImage\" alt=\"\" class=\"bg-image\">\r\n <div class=\"img-title\">\r\n {{contactUsPageData.imageTitle}}\r\n </div>\r\n <div class=\"bottom-img-side\" *ngIf=\"!isUnderTabRange\">\r\n <div class=\"logo\"><img [src]=\"contactUsPageData.ourLogo\" alt=\"JOOLER\"></div>\r\n <div class=\"img-description\">{{contactUsPageData.imageDescription}}\r\n </div>\r\n <div class=\"social-media-icons\">\r\n <!-- <social-media-icons class=\"social-media\" [color]=\"'#fff'\" [areIconsInFooter]=\"false\"></social-media-icons> -->\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"right-side\">\r\n <section-title [sectionTitle]=\"contactUsPageData.sectionTitle\"></section-title>\r\n <!-- <section-title title=\"Get In Touch\" [alignLeft]=\"true\"></section-title> -->\r\n <div class=\"content\">\r\n <div class=\"message-box\">\r\n <form [formGroup]=\"form\" (ngSubmit)=\"onClickSubmit()\">\r\n <div class=\"full-name-area\">\r\n <div class=\"first-name\">\r\n <span class=\"fields-labels\">First Name*</span>\r\n <input type=\"text\" formControlName=\"firstName\" class=\"input\" placeholder=\"First Name\" />\r\n </div>\r\n <div class=\"last-name\">\r\n <span class=\"fields-labels\">Last Name*</span>\r\n <input type=\"text\" formControlName=\"lastName\" class=\"input\" placeholder=\"Last Name\" />\r\n </div>\r\n </div>\r\n <span class=\"fields-labels\">Company Name*</span>\r\n <input type=\"text\" formControlName=\"companyName\" class=\"input\" placeholder=\"Your company name\" />\r\n <span class=\"fields-labels\">Email*</span>\r\n <input type=\"text\" formControlName=\"email\" class=\"input\" placeholder=\"name@example.com\" />\r\n <span class=\"fields-labels\">Phone Number</span>\r\n <div class=\"phone-number-section\">\r\n\r\n <div class=\"countries-list\">\r\n <choose-country-with-flag formControlName=\"country\" (change)=\"getSelectedOptionValue($event)\" [items]=\"items\"></choose-country-with-flag>\r\n </div>\r\n <span class=\"code-section\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n <input class=\"code\" [value]=\"selectedCode? selectedCode: null\" placeholder=\"--\" [readOnly]=\"true\" />\r\n </span>\r\n <input formControlName=\"phoneNumber\" type=\"number\" class=\"phone-num-input\" placeholder=\"Phone Number\" />\r\n </div>\r\n <div class=\"subject\">\r\n <ng-select formControlName=\"subject\" [items]=\"subjects\" bindLabel=\"label\" placeholder=\"Subject\" bindValue=\"label\">\r\n </ng-select>\r\n </div>\r\n <textarea type=\"text\" formControlName=\"message\" placeholder=\"Message\" class=\"text-area\">\r\n\r\n\r\n </textarea>\r\n <div class=\"actions\">\r\n <button class=\"submit\" type=\"submit\" mat-raised-button=\"mat-raised-button\" color=\"primary\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"our-locations-section\">\r\n <div class=\"locations-content\">\r\n <div class=\"headline\">\r\n {{contactUsPageData.locations.headline}}\r\n </div>\r\n <div class=\"title\">\r\n {{contactUsPageData.locations.title}}\r\n </div>\r\n <div class=\"lines-img\">\r\n <img src=\"../../../assets/images/lines-contact-us.png\" alt=\"\">\r\n </div>\r\n <div class=\"subtitle\">\r\n {{contactUsPageData.locations.subtitle}}\r\n </div>\r\n <div class=\"addresses\">\r\n <div class=\"address flexy\" *ngFor=\"let address of contactUsPageData.locations.addresses\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconWhite\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n <p-carousel *ngIf=\"isUnderTabRange\" class=\"carousel\" [value]=\"contactUsPageData.locations.addresses\"\r\n [numVisible]='membersToShow' [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizantol\"\r\n [circular]=\"true\">\r\n <ng-template let-address pTemplate=\"item\">\r\n <div class=\"address\">\r\n <div class=\"address-header\">\r\n <div class=\"icon\">\r\n <img [src]=\"contactUsPageData.locations.pinIconBlue\" alt=\"\">\r\n </div>\r\n <div class=\"location-name\">\r\n {{address.name}}\r\n </div>\r\n </div>\r\n <div class=\"building\">\r\n {{address.building}}\r\n </div>\r\n <div class=\"location-area\">\r\n {{address.locationArea}}\r\n </div>\r\n <div class=\"hours\">\r\n <fa-icon [icon]=\"['fas','clock']\"></fa-icon>\r\n {{address.hours}}\r\n </div>\r\n <div class=\"cellular-number\">\r\n <fa-icon [icon]=\"['fas','phone']\"></fa-icon>\r\n {{address.phoneNumber}}\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
712
712
|
}], ctorParameters: function () { return [{ type: i1$2.MatDialog }, { type: i1$1.BreakpointObserver }, { type: i3$2.FormBuilder }]; }, propDecorators: { subjects: [{
|
|
713
713
|
type: Input
|
|
714
714
|
}], contactUsPageData: [{
|
|
@@ -730,10 +730,10 @@ class PageSectionStyleThreeComponent {
|
|
|
730
730
|
}
|
|
731
731
|
}
|
|
732
732
|
PageSectionStyleThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
733
|
-
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\r\n <div class=\"section\" *ngFor=\"let valueprop of sectionContent\">\r\n <div class=\"section-container\">\r\n <div class=\"image-side\">\r\n <img [src]=\"valueprop.image\">\r\n </div>\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"valueprop.sectionTitle\">\r\n </section-title>\r\n <div class=\"optional-button\">\r\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.button\" (click)=\"onClickValuePropButton(valueprop.button.route)\">\r\n {{valueprop.button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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: i4.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", "withoutTitleCase"] }] });
|
|
733
|
+
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\r\n <div class=\"section\" *ngFor=\"let valueprop of sectionContent\">\r\n <div class=\"section-container\">\r\n <div class=\"image-side\">\r\n <img [src]=\"valueprop.image\">\r\n </div>\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"valueprop.sectionTitle\">\r\n </section-title>\r\n <div class=\"optional-button\">\r\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.button\" (click)=\"onClickValuePropButton(valueprop.button.route)\">\r\n {{valueprop.button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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: i4.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", "withoutTitleCase"] }] });
|
|
734
734
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, decorators: [{
|
|
735
735
|
type: Component,
|
|
736
|
-
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\r\n <div class=\"section\" *ngFor=\"let valueprop of sectionContent\">\r\n <div class=\"section-container\">\r\n <div class=\"image-side\">\r\n <img [src]=\"valueprop.image\">\r\n </div>\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"valueprop.sectionTitle\">\r\n </section-title>\r\n <div class=\"optional-button\">\r\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.button\" (click)=\"onClickValuePropButton(valueprop.button.route)\">\r\n {{valueprop.button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-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"] }]
|
|
736
|
+
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\r\n <div class=\"section\" *ngFor=\"let valueprop of sectionContent\">\r\n <div class=\"section-container\">\r\n <div class=\"image-side\">\r\n <img [src]=\"valueprop.image\">\r\n </div>\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"valueprop.sectionTitle\">\r\n </section-title>\r\n <div class=\"optional-button\">\r\n <button mat-raised-button class=\"value-prop-button\" *ngIf=\"valueprop.button\" (click)=\"onClickValuePropButton(valueprop.button.route)\">\r\n {{valueprop.button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
737
737
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
738
738
|
type: Input
|
|
739
739
|
}] } });
|
|
@@ -780,10 +780,10 @@ class ComingSoonComponent {
|
|
|
780
780
|
}
|
|
781
781
|
}
|
|
782
782
|
ComingSoonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComingSoonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
783
|
-
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: "<section class=\"page\">\r\n <div class=\"coming-soon\">\r\n <div class=\"title\">\r\n Coming Soon\r\n </div>\r\n <div class=\"subtitle\">\r\n {{ctaText}}\r\n </div>\r\n <form>\r\n <div class=\"registration-field\">\r\n <div class=\"email-field\">\r\n <input type=\"email\" placeholder=\"Email Address\">\r\n </div>\r\n <button mat-raised-button class=\"submit\" type=\"submit\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n <div class=\"social-media-icons\">\r\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\" [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\r\n </div>\r\n </div>\r\n</section>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;padding:20vh 0}.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;margin:auto;background-color:#fff;padding:6rem 4rem;width:60rem;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060;display:flex;flex-direction:column;row-gap:1rem}.page .coming-soon .title{color:#155ed4;font-weight:500;font-size:4rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem}.page .coming-soon .registration-field{display:flex;flex-direction:row;column-gap:1rem}.page .coming-soon .registration-field .email-field{width:60%}.page .coming-soon .registration-field .email-field input{width:100%}.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}@media only screen and (max-width: 37.5em){.page .coming-soon{width:90%;text-align:center;background-size:2rem,7rem,7rem}.page .coming-soon .registration-field{flex-direction:column;row-gap:1rem}.page .coming-soon .registration-field .email-field,.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .social-media-icons{margin:auto}}\n"], dependencies: [{ kind: "component", type: i4.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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.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"] }] });
|
|
783
|
+
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: "<section class=\"page\">\r\n <div class=\"coming-soon\">\r\n <div class=\"title\">\r\n Coming Soon\r\n </div>\r\n <div class=\"subtitle\">\r\n {{ctaText}}\r\n </div>\r\n <form>\r\n <div class=\"registration-field\">\r\n <div class=\"email-field\">\r\n <input type=\"email\" placeholder=\"Email Address\">\r\n </div>\r\n <button mat-raised-button class=\"submit\" type=\"submit\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n <div class=\"social-media-icons\">\r\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\" [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\r\n </div>\r\n </div>\r\n</section>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;padding:20vh 0}.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;margin:auto;background-color:#fff;padding:6rem 4rem;width:60rem;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060;display:flex;flex-direction:column;row-gap:1rem}.page .coming-soon .title{color:#155ed4;font-weight:500;font-size:4rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem}.page .coming-soon .registration-field{display:flex;flex-direction:row;column-gap:1rem}.page .coming-soon .registration-field .email-field{width:60%}.page .coming-soon .registration-field .email-field input{width:100%}.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}@media only screen and (max-width: 37.5em){.page .coming-soon{width:90%;text-align:center;background-size:2rem,7rem,7rem}.page .coming-soon .registration-field{flex-direction:column;row-gap:1rem}.page .coming-soon .registration-field .email-field,.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .social-media-icons{margin:auto}}\n"], dependencies: [{ kind: "component", type: i4.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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.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"] }] });
|
|
784
784
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComingSoonComponent, decorators: [{
|
|
785
785
|
type: Component,
|
|
786
|
-
args: [{ selector: 'coming-soon', template: "<section class=\"page\">\r\n <div class=\"coming-soon\">\r\n <div class=\"title\">\r\n Coming Soon\r\n </div>\r\n <div class=\"subtitle\">\r\n {{ctaText}}\r\n </div>\r\n <form>\r\n <div class=\"registration-field\">\r\n <div class=\"email-field\">\r\n <input type=\"email\" placeholder=\"Email Address\">\r\n </div>\r\n <button mat-raised-button class=\"submit\" type=\"submit\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n <div class=\"social-media-icons\">\r\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\" [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\r\n </div>\r\n </div>\r\n</section>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;padding:20vh 0}.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;margin:auto;background-color:#fff;padding:6rem 4rem;width:60rem;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060;display:flex;flex-direction:column;row-gap:1rem}.page .coming-soon .title{color:#155ed4;font-weight:500;font-size:4rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem}.page .coming-soon .registration-field{display:flex;flex-direction:row;column-gap:1rem}.page .coming-soon .registration-field .email-field{width:60%}.page .coming-soon .registration-field .email-field input{width:100%}.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}@media only screen and (max-width: 37.5em){.page .coming-soon{width:90%;text-align:center;background-size:2rem,7rem,7rem}.page .coming-soon .registration-field{flex-direction:column;row-gap:1rem}.page .coming-soon .registration-field .email-field,.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .social-media-icons{margin:auto}}\n"] }]
|
|
786
|
+
args: [{ selector: 'coming-soon', template: "<section class=\"page\">\r\n <div class=\"coming-soon\">\r\n <div class=\"title\">\r\n Coming Soon\r\n </div>\r\n <div class=\"subtitle\">\r\n {{ctaText}}\r\n </div>\r\n <form>\r\n <div class=\"registration-field\">\r\n <div class=\"email-field\">\r\n <input type=\"email\" placeholder=\"Email Address\">\r\n </div>\r\n <button mat-raised-button class=\"submit\" type=\"submit\">\r\n Submit\r\n </button>\r\n </div>\r\n </form>\r\n <div class=\"social-media-icons\">\r\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\" [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\r\n </div>\r\n </div>\r\n</section>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;padding:20vh 0}.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;margin:auto;background-color:#fff;padding:6rem 4rem;width:60rem;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060;display:flex;flex-direction:column;row-gap:1rem}.page .coming-soon .title{color:#155ed4;font-weight:500;font-size:4rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem}.page .coming-soon .registration-field{display:flex;flex-direction:row;column-gap:1rem}.page .coming-soon .registration-field .email-field{width:60%}.page .coming-soon .registration-field .email-field input{width:100%}.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}@media only screen and (max-width: 37.5em){.page .coming-soon{width:90%;text-align:center;background-size:2rem,7rem,7rem}.page .coming-soon .registration-field{flex-direction:column;row-gap:1rem}.page .coming-soon .registration-field .email-field,.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .social-media-icons{margin:auto}}\n"] }]
|
|
787
787
|
}], propDecorators: { ctaText: [{
|
|
788
788
|
type: Input
|
|
789
789
|
}], socialMediaLinks: [{
|
|
@@ -800,10 +800,10 @@ class FaqCategoryListingComponent {
|
|
|
800
800
|
}
|
|
801
801
|
}
|
|
802
802
|
FaqCategoryListingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqCategoryListingComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
803
|
-
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\">\r\n <div class=\"icon-container\">\r\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"title\">\r\n {{category.title}}\r\n </div>\r\n</div>", styles: ["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-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"] }] });
|
|
803
|
+
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\">\r\n <div class=\"icon-container\">\r\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"title\">\r\n {{category.title}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }] });
|
|
804
804
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqCategoryListingComponent, decorators: [{
|
|
805
805
|
type: Component,
|
|
806
|
-
args: [{ selector: 'faq-category-listing', template: "<div [ngClass]=\"{'selected':isSelected}\" class=\"listing\">\r\n <div class=\"icon-container\">\r\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"title\">\r\n {{category.title}}\r\n </div>\r\n</div>", styles: ["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-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"] }]
|
|
806
|
+
args: [{ selector: 'faq-category-listing', template: "<div [ngClass]=\"{'selected':isSelected}\" class=\"listing\">\r\n <div class=\"icon-container\">\r\n <fa-icon [icon]=\"category.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"title\">\r\n {{category.title}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
807
807
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { category: [{
|
|
808
808
|
type: Input
|
|
809
809
|
}], isSelected: [{
|
|
@@ -822,10 +822,10 @@ class FaqListingComponent {
|
|
|
822
822
|
}
|
|
823
823
|
}
|
|
824
824
|
FaqListingComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqListingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
825
|
-
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)\"\r\n (closed)=\"onClosed($event)\">\r\n <mat-expansion-panel-header class=\"panel-header\">\r\n <mat-panel-title class=\"title\">\r\n {{faq.question}}\r\n </mat-panel-title>\r\n <div class=\"icon\">\r\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\r\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <div class=\"content\">\r\n {{faq.response}}\r\n </div>\r\n</mat-expansion-panel>", styles: ["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-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" }] });
|
|
825
|
+
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)\"\r\n (closed)=\"onClosed($event)\">\r\n <mat-expansion-panel-header class=\"panel-header\">\r\n <mat-panel-title class=\"title\">\r\n {{faq.question}}\r\n </mat-panel-title>\r\n <div class=\"icon\">\r\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\r\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <div class=\"content\">\r\n {{faq.response}}\r\n </div>\r\n</mat-expansion-panel>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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" }] });
|
|
826
826
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: FaqListingComponent, decorators: [{
|
|
827
827
|
type: Component,
|
|
828
|
-
args: [{ selector: 'faq-listing', template: "<mat-expansion-panel class=\"listing\" hideToggle [expanded]=\"isOpen\" (opened)=\"onOpened($event)\"\r\n (closed)=\"onClosed($event)\">\r\n <mat-expansion-panel-header class=\"panel-header\">\r\n <mat-panel-title class=\"title\">\r\n {{faq.question}}\r\n </mat-panel-title>\r\n <div class=\"icon\">\r\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\r\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <div class=\"content\">\r\n {{faq.response}}\r\n </div>\r\n</mat-expansion-panel>", styles: ["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-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"] }]
|
|
828
|
+
args: [{ selector: 'faq-listing', template: "<mat-expansion-panel class=\"listing\" hideToggle [expanded]=\"isOpen\" (opened)=\"onOpened($event)\"\r\n (closed)=\"onClosed($event)\">\r\n <mat-expansion-panel-header class=\"panel-header\">\r\n <mat-panel-title class=\"title\">\r\n {{faq.question}}\r\n </mat-panel-title>\r\n <div class=\"icon\">\r\n <mat-icon *ngIf=\"!isOpen\">add_circle_outline</mat-icon>\r\n <mat-icon *ngIf=\"isOpen\">remove_circle_outline</mat-icon>\r\n </div>\r\n </mat-expansion-panel-header>\r\n <div class=\"content\">\r\n {{faq.response}}\r\n </div>\r\n</mat-expansion-panel>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}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"] }]
|
|
829
829
|
}], ctorParameters: function () { return []; }, propDecorators: { faq: [{
|
|
830
830
|
type: Input
|
|
831
831
|
}] } });
|
|
@@ -852,10 +852,10 @@ class CtaSectionStyleFourComponent {
|
|
|
852
852
|
}
|
|
853
853
|
}
|
|
854
854
|
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 });
|
|
855
|
-
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}\">\r\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"buttons-line\">\r\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.main-card{position:relative;width:100%;display:grid;row-gap:2rem;column-gap:2%;justify-content:center;padding:10rem 2rem;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: i4.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", "withoutTitleCase"] }] });
|
|
855
|
+
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}\">\r\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"buttons-line\">\r\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.main-card{position:relative;width:100%;display:grid;row-gap:2rem;column-gap:2%;justify-content:center;padding:10rem 2rem;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: i4.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", "withoutTitleCase"] }] });
|
|
856
856
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CtaSectionStyleFourComponent, decorators: [{
|
|
857
857
|
type: Component,
|
|
858
|
-
args: [{ selector: 'cta-section-style-four', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"buttons-line\">\r\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.main-card{position:relative;width:100%;display:grid;row-gap:2rem;column-gap:2%;justify-content:center;padding:10rem 2rem;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"] }]
|
|
858
|
+
args: [{ selector: 'cta-section-style-four', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\" class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"text-side\" [ngClass]=\"{'flex-reverse':sectionContent.imageTextSort}\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"buttons-line\">\r\n <button mat-raised-button *ngFor=\"let button of sectionContent.buttons\" (click)=\"onClickCtaButton( button.route)\" class=\"cta-button\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.main-card{position:relative;width:100%;display:grid;row-gap:2rem;column-gap:2%;justify-content:center;padding:10rem 2rem;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"] }]
|
|
859
859
|
}], ctorParameters: function () { return [{ type: i1$1.BreakpointObserver }, { type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
860
860
|
type: Input
|
|
861
861
|
}] } });
|
|
@@ -897,10 +897,10 @@ class VerticalSideTabsComponent {
|
|
|
897
897
|
}
|
|
898
898
|
}
|
|
899
899
|
VerticalSideTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VerticalSideTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
900
|
-
VerticalSideTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: VerticalSideTabsComponent, selector: "vertical-side-tabs", inputs: { tabs: "tabs" }, outputs: { tabChanged: "tabChanged" }, ngImport: i0, template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><fa-icon [icon]=\"tab.iconName\" class=\"tab-icon\"></fa-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon fa-icon.tab-icon{width:.2rem;height:.2rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align: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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3$4.MatCard, selector: "mat-card", exportAs: ["matCard"] }] });
|
|
900
|
+
VerticalSideTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: VerticalSideTabsComponent, selector: "vertical-side-tabs", inputs: { tabs: "tabs" }, outputs: { tabChanged: "tabChanged" }, ngImport: i0, template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><fa-icon [icon]=\"tab.iconName\" class=\"tab-icon\"></fa-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon fa-icon.tab-icon{width:.2rem;height:.2rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align: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.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3$4.MatCard, selector: "mat-card", exportAs: ["matCard"] }] });
|
|
901
901
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: VerticalSideTabsComponent, decorators: [{
|
|
902
902
|
type: Component,
|
|
903
|
-
args: [{ selector: 'vertical-side-tabs', template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><fa-icon [icon]=\"tab.iconName\" class=\"tab-icon\"></fa-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon fa-icon.tab-icon{width:.2rem;height:.2rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align:center}}\n"] }]
|
|
903
|
+
args: [{ selector: 'vertical-side-tabs', template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><fa-icon [icon]=\"tab.iconName\" class=\"tab-icon\"></fa-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon fa-icon.tab-icon{width:.2rem;height:.2rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align:center}}\n"] }]
|
|
904
904
|
}], ctorParameters: function () { return []; }, propDecorators: { tabs: [{
|
|
905
905
|
type: Input
|
|
906
906
|
}], tabChanged: [{
|
|
@@ -916,10 +916,10 @@ class HeaderSectionOneComponent {
|
|
|
916
916
|
}
|
|
917
917
|
}
|
|
918
918
|
HeaderSectionOneComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: HeaderSectionOneComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
919
|
-
HeaderSectionOneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: HeaderSectionOneComponent, selector: "header-section-one", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"detail-head-block\" [ngClass]=\"{'title-image-sort':sectionContent.titleImageSort , 'image-title-sort':!sectionContent.titleImageSort, 'image-background':sectionContent.backgroundImage != null }\" [ngStyle]=\"{'background-color': !sectionContent.backgroundImage ? sectionContent.backgroundColor :null }\">\r\n <img class=\"bg-image\" [src]=\"sectionContent.backgroundImage\" alt=\"\" *ngIf=\"sectionContent.backgroundImage\">\r\n <div class=\"section-content\">\r\n <div class=\"header-content-container\">\r\n <div class=\"title-desc\">\r\n <div class=\"title-part\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div *ngIf=\"sectionContent.actions\" class=\"main-buttons align-left-items\">\r\n <div class=\"button\" *ngFor=\"let button of sectionContent.actions ,let i = index\">\r\n <button mat-raised-button (click)=\"onClickButton(button.route)\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"img-head\" *ngIf=\"sectionContent.previewImage\">\r\n <img [src]=\"sectionContent.previewImage\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.image-title-sort{flex-direction:row-reverse}.title-image-sort{flex-direction:row}.image-background{position:relative}.image-background .bg-image{position:absolute;width:100%;height:100%;top:0;left:0;z-index:-1;object-fit:cover;-moz-filter:blur(.2rem);filter:blur(.2rem)}.detail-head-block{box-shadow:#32325d40 0 .6rem 1.2rem -.2rem,#0000004d 0 .3rem .7rem -.3rem;margin-bottom:2rem;padding:10rem 0rem}.detail-head-block .section-content{display:flex;margin:auto;column-gap:2%;color:#fff;width:90%}@media only screen and (min-width: 1500px){.detail-head-block .section-content{width:150rem}}.detail-head-block .header-content-container{width:69%;padding-top:3rem}.detail-head-block .header-content-container .title-desc{width:100%;display:flex;flex-direction:column;row-gap:2rem}.detail-head-block .header-content-container .title-desc .title-part{width:80%;margin:auto}.detail-head-block .header-content-container .title-desc .main-buttons{display:flex;margin-top:4rem;column-gap:2rem;justify-content:center}.detail-head-block .header-content-container .title-desc .main-buttons button{padding:2rem;border-radius:.5rem;color:#fff;border:none;font-weight:400;font-size:2rem;font-weight:600;font-family:inherit;background-color:#155ed4}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn{transition:.15s ease-in-out}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn:hover{box-shadow:#64646f33 0 .7rem 2.9rem;transform:scale(1.05)}.detail-head-block .img-head{display:grid;height:100%;width:29%;padding:3rem 0rem;align-self:center;justify-items:center}.detail-head-block .img-head img{align-self:right;box-sizing:border-box;width:100%;height:35rem;object-fit:cover;border-radius:1rem;box-shadow:#959da533 0 .8rem 2.4rem}@media only screen and (max-width: 75em){.detail-head-block .header-content-container{width:59%}.detail-head-block .img-head{width:39%}.detail-head-block .img-head img{width:80%;height:40rem}}@media only screen and (min-width: 900px){.detail-head-block .header-content-container .title-desc .align-left-items{margin:auto;width:80%;justify-content:start}}@media only screen and (max-width: 56.25em){.detail-head-block{padding:0rem}.detail-head-block .section-content{display:flex;flex-wrap:wrap;flex-direction:column-reverse;width:100%}.detail-head-block .header-content-container{margin:auto;width:100%}.detail-head-block .header-content-container .title-desc{width:100%;display:grid;align-items:center;margin:2rem 0rem}.detail-head-block .img-head{justify-items:center;clip-path:none;border-radius:1.5rem;margin-top:3rem;width:100%}.detail-head-block .img-head img{height:40rem;width:65%;border-radius:1.5rem;object-fit:cover}}@media only screen and (max-width: 37.5em){.detail-head-block .img-head img{height:33rem;width:80%}}\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: i4.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", "withoutTitleCase"] }] });
|
|
919
|
+
HeaderSectionOneComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: HeaderSectionOneComponent, selector: "header-section-one", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"detail-head-block\" [ngClass]=\"{'title-image-sort':sectionContent.titleImageSort , 'image-title-sort':!sectionContent.titleImageSort, 'image-background':sectionContent.backgroundImage != null }\" [ngStyle]=\"{'background-color': !sectionContent.backgroundImage ? sectionContent.backgroundColor :null }\">\r\n <img class=\"bg-image\" [src]=\"sectionContent.backgroundImage\" alt=\"\" *ngIf=\"sectionContent.backgroundImage\">\r\n <div class=\"section-content\">\r\n <div class=\"header-content-container\">\r\n <div class=\"title-desc\">\r\n <div class=\"title-part\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div *ngIf=\"sectionContent.actions\" class=\"main-buttons align-left-items\">\r\n <div class=\"button\" *ngFor=\"let button of sectionContent.actions ,let i = index\">\r\n <button mat-raised-button (click)=\"onClickButton(button.route)\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"img-head\" *ngIf=\"sectionContent.previewImage\">\r\n <img [src]=\"sectionContent.previewImage\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.image-title-sort{flex-direction:row-reverse}.title-image-sort{flex-direction:row}.image-background{position:relative}.image-background .bg-image{position:absolute;width:100%;height:100%;top:0;left:0;z-index:-1;object-fit:cover;-moz-filter:blur(.2rem);filter:blur(.2rem)}.detail-head-block{box-shadow:#32325d40 0 .6rem 1.2rem -.2rem,#0000004d 0 .3rem .7rem -.3rem;margin-bottom:2rem;padding:10rem 0rem}.detail-head-block .section-content{display:flex;margin:auto;column-gap:2%;color:#fff;width:90%}@media only screen and (min-width: 1500px){.detail-head-block .section-content{width:150rem}}.detail-head-block .header-content-container{width:69%;padding-top:3rem}.detail-head-block .header-content-container .title-desc{width:100%;display:flex;flex-direction:column;row-gap:2rem}.detail-head-block .header-content-container .title-desc .title-part{width:80%;margin:auto}.detail-head-block .header-content-container .title-desc .main-buttons{display:flex;margin-top:4rem;column-gap:2rem;justify-content:center}.detail-head-block .header-content-container .title-desc .main-buttons button{padding:2rem;border-radius:.5rem;color:#fff;border:none;font-weight:400;font-size:2rem;font-weight:600;font-family:inherit;background-color:#155ed4}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn{transition:.15s ease-in-out}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn:hover{box-shadow:#64646f33 0 .7rem 2.9rem;transform:scale(1.05)}.detail-head-block .img-head{display:grid;height:100%;width:29%;padding:3rem 0rem;align-self:center;justify-items:center}.detail-head-block .img-head img{align-self:right;box-sizing:border-box;width:100%;height:35rem;object-fit:cover;border-radius:1rem;box-shadow:#959da533 0 .8rem 2.4rem}@media only screen and (max-width: 75em){.detail-head-block .header-content-container{width:59%}.detail-head-block .img-head{width:39%}.detail-head-block .img-head img{width:80%;height:40rem}}@media only screen and (min-width: 900px){.detail-head-block .header-content-container .title-desc .align-left-items{margin:auto;width:80%;justify-content:start}}@media only screen and (max-width: 56.25em){.detail-head-block{padding:0rem}.detail-head-block .section-content{display:flex;flex-wrap:wrap;flex-direction:column-reverse;width:100%}.detail-head-block .header-content-container{margin:auto;width:100%}.detail-head-block .header-content-container .title-desc{width:100%;display:grid;align-items:center;margin:2rem 0rem}.detail-head-block .img-head{justify-items:center;clip-path:none;border-radius:1.5rem;margin-top:3rem;width:100%}.detail-head-block .img-head img{height:40rem;width:65%;border-radius:1.5rem;object-fit:cover}}@media only screen and (max-width: 37.5em){.detail-head-block .img-head img{height:33rem;width:80%}}\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: i4.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", "withoutTitleCase"] }] });
|
|
920
920
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: HeaderSectionOneComponent, decorators: [{
|
|
921
921
|
type: Component,
|
|
922
|
-
args: [{ selector: 'header-section-one', template: "<div class=\"detail-head-block\" [ngClass]=\"{'title-image-sort':sectionContent.titleImageSort , 'image-title-sort':!sectionContent.titleImageSort, 'image-background':sectionContent.backgroundImage != null }\" [ngStyle]=\"{'background-color': !sectionContent.backgroundImage ? sectionContent.backgroundColor :null }\">\r\n <img class=\"bg-image\" [src]=\"sectionContent.backgroundImage\" alt=\"\" *ngIf=\"sectionContent.backgroundImage\">\r\n <div class=\"section-content\">\r\n <div class=\"header-content-container\">\r\n <div class=\"title-desc\">\r\n <div class=\"title-part\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div *ngIf=\"sectionContent.actions\" class=\"main-buttons align-left-items\">\r\n <div class=\"button\" *ngFor=\"let button of sectionContent.actions ,let i = index\">\r\n <button mat-raised-button (click)=\"onClickButton(button.route)\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"img-head\" *ngIf=\"sectionContent.previewImage\">\r\n <img [src]=\"sectionContent.previewImage\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.image-title-sort{flex-direction:row-reverse}.title-image-sort{flex-direction:row}.image-background{position:relative}.image-background .bg-image{position:absolute;width:100%;height:100%;top:0;left:0;z-index:-1;object-fit:cover;-moz-filter:blur(.2rem);filter:blur(.2rem)}.detail-head-block{box-shadow:#32325d40 0 .6rem 1.2rem -.2rem,#0000004d 0 .3rem .7rem -.3rem;margin-bottom:2rem;padding:10rem 0rem}.detail-head-block .section-content{display:flex;margin:auto;column-gap:2%;color:#fff;width:90%}@media only screen and (min-width: 1500px){.detail-head-block .section-content{width:150rem}}.detail-head-block .header-content-container{width:69%;padding-top:3rem}.detail-head-block .header-content-container .title-desc{width:100%;display:flex;flex-direction:column;row-gap:2rem}.detail-head-block .header-content-container .title-desc .title-part{width:80%;margin:auto}.detail-head-block .header-content-container .title-desc .main-buttons{display:flex;margin-top:4rem;column-gap:2rem;justify-content:center}.detail-head-block .header-content-container .title-desc .main-buttons button{padding:2rem;border-radius:.5rem;color:#fff;border:none;font-weight:400;font-size:2rem;font-weight:600;font-family:inherit;background-color:#155ed4}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn{transition:.15s ease-in-out}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn:hover{box-shadow:#64646f33 0 .7rem 2.9rem;transform:scale(1.05)}.detail-head-block .img-head{display:grid;height:100%;width:29%;padding:3rem 0rem;align-self:center;justify-items:center}.detail-head-block .img-head img{align-self:right;box-sizing:border-box;width:100%;height:35rem;object-fit:cover;border-radius:1rem;box-shadow:#959da533 0 .8rem 2.4rem}@media only screen and (max-width: 75em){.detail-head-block .header-content-container{width:59%}.detail-head-block .img-head{width:39%}.detail-head-block .img-head img{width:80%;height:40rem}}@media only screen and (min-width: 900px){.detail-head-block .header-content-container .title-desc .align-left-items{margin:auto;width:80%;justify-content:start}}@media only screen and (max-width: 56.25em){.detail-head-block{padding:0rem}.detail-head-block .section-content{display:flex;flex-wrap:wrap;flex-direction:column-reverse;width:100%}.detail-head-block .header-content-container{margin:auto;width:100%}.detail-head-block .header-content-container .title-desc{width:100%;display:grid;align-items:center;margin:2rem 0rem}.detail-head-block .img-head{justify-items:center;clip-path:none;border-radius:1.5rem;margin-top:3rem;width:100%}.detail-head-block .img-head img{height:40rem;width:65%;border-radius:1.5rem;object-fit:cover}}@media only screen and (max-width: 37.5em){.detail-head-block .img-head img{height:33rem;width:80%}}\n"] }]
|
|
922
|
+
args: [{ selector: 'header-section-one', template: "<div class=\"detail-head-block\" [ngClass]=\"{'title-image-sort':sectionContent.titleImageSort , 'image-title-sort':!sectionContent.titleImageSort, 'image-background':sectionContent.backgroundImage != null }\" [ngStyle]=\"{'background-color': !sectionContent.backgroundImage ? sectionContent.backgroundColor :null }\">\r\n <img class=\"bg-image\" [src]=\"sectionContent.backgroundImage\" alt=\"\" *ngIf=\"sectionContent.backgroundImage\">\r\n <div class=\"section-content\">\r\n <div class=\"header-content-container\">\r\n <div class=\"title-desc\">\r\n <div class=\"title-part\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div *ngIf=\"sectionContent.actions\" class=\"main-buttons align-left-items\">\r\n <div class=\"button\" *ngFor=\"let button of sectionContent.actions ,let i = index\">\r\n <button mat-raised-button (click)=\"onClickButton(button.route)\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"img-head\" *ngIf=\"sectionContent.previewImage\">\r\n <img [src]=\"sectionContent.previewImage\">\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.image-title-sort{flex-direction:row-reverse}.title-image-sort{flex-direction:row}.image-background{position:relative}.image-background .bg-image{position:absolute;width:100%;height:100%;top:0;left:0;z-index:-1;object-fit:cover;-moz-filter:blur(.2rem);filter:blur(.2rem)}.detail-head-block{box-shadow:#32325d40 0 .6rem 1.2rem -.2rem,#0000004d 0 .3rem .7rem -.3rem;margin-bottom:2rem;padding:10rem 0rem}.detail-head-block .section-content{display:flex;margin:auto;column-gap:2%;color:#fff;width:90%}@media only screen and (min-width: 1500px){.detail-head-block .section-content{width:150rem}}.detail-head-block .header-content-container{width:69%;padding-top:3rem}.detail-head-block .header-content-container .title-desc{width:100%;display:flex;flex-direction:column;row-gap:2rem}.detail-head-block .header-content-container .title-desc .title-part{width:80%;margin:auto}.detail-head-block .header-content-container .title-desc .main-buttons{display:flex;margin-top:4rem;column-gap:2rem;justify-content:center}.detail-head-block .header-content-container .title-desc .main-buttons button{padding:2rem;border-radius:.5rem;color:#fff;border:none;font-weight:400;font-size:2rem;font-weight:600;font-family:inherit;background-color:#155ed4}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn{transition:.15s ease-in-out}.detail-head-block .header-content-container .title-desc .main-buttons .orange-btn:hover{box-shadow:#64646f33 0 .7rem 2.9rem;transform:scale(1.05)}.detail-head-block .img-head{display:grid;height:100%;width:29%;padding:3rem 0rem;align-self:center;justify-items:center}.detail-head-block .img-head img{align-self:right;box-sizing:border-box;width:100%;height:35rem;object-fit:cover;border-radius:1rem;box-shadow:#959da533 0 .8rem 2.4rem}@media only screen and (max-width: 75em){.detail-head-block .header-content-container{width:59%}.detail-head-block .img-head{width:39%}.detail-head-block .img-head img{width:80%;height:40rem}}@media only screen and (min-width: 900px){.detail-head-block .header-content-container .title-desc .align-left-items{margin:auto;width:80%;justify-content:start}}@media only screen and (max-width: 56.25em){.detail-head-block{padding:0rem}.detail-head-block .section-content{display:flex;flex-wrap:wrap;flex-direction:column-reverse;width:100%}.detail-head-block .header-content-container{margin:auto;width:100%}.detail-head-block .header-content-container .title-desc{width:100%;display:grid;align-items:center;margin:2rem 0rem}.detail-head-block .img-head{justify-items:center;clip-path:none;border-radius:1.5rem;margin-top:3rem;width:100%}.detail-head-block .img-head img{height:40rem;width:65%;border-radius:1.5rem;object-fit:cover}}@media only screen and (max-width: 37.5em){.detail-head-block .img-head img{height:33rem;width:80%}}\n"] }]
|
|
923
923
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
924
924
|
type: Input
|
|
925
925
|
}] } });
|
|
@@ -936,10 +936,10 @@ class CustomTooltipComponent {
|
|
|
936
936
|
}
|
|
937
937
|
}
|
|
938
938
|
CustomTooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CustomTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
939
|
-
CustomTooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CustomTooltipComponent, selector: "custom-tooltip", ngImport: i0, template: "<div class=\"icon\">\r\n <div class=\"content\" (mouseleave)=\"onMouseLeave()\">\r\n <div (click)=\"onMouseClick()\" class=\"icon-container\" (mouseenter)=\"onMouseEnter()\">\r\n <div>\r\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\r\n </div>\r\n </div>\r\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\r\n <fa-icon icon=\"caret-left\"></fa-icon>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;position:relative;width:3rem}.icon .content{position:absolute;display:flex;flex-direction:row;top:0}.icon .icon-container{display:inline-block;height:-moz-fit-content;height:fit-content;cursor:pointer}.icon .icon-container .icon-shape{position:relative;z-index:-2}.icon .tooltip-message-box{align-self:center;display:flex;column-gap:0rem;z-index:100;transition:all .1s ease-in-out;z-index:1}.icon .tooltip-message-box fa-icon{font-size:2rem;margin-left:.5rem}.icon .no-details{opacity:0;transform:scale(0)}.icon .details{opacity:1;transform:scale(1)}\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"] }] });
|
|
939
|
+
CustomTooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CustomTooltipComponent, selector: "custom-tooltip", ngImport: i0, template: "<div class=\"icon\">\r\n <div class=\"content\" (mouseleave)=\"onMouseLeave()\">\r\n <div (click)=\"onMouseClick()\" class=\"icon-container\" (mouseenter)=\"onMouseEnter()\">\r\n <div>\r\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\r\n </div>\r\n </div>\r\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\r\n <fa-icon icon=\"caret-left\"></fa-icon>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;position:relative;width:3rem}.icon .content{position:absolute;display:flex;flex-direction:row;top:0}.icon .icon-container{display:inline-block;height:-moz-fit-content;height:fit-content;cursor:pointer}.icon .icon-container .icon-shape{position:relative;z-index:-2}.icon .tooltip-message-box{align-self:center;display:flex;column-gap:0rem;z-index:100;transition:all .1s ease-in-out;z-index:1}.icon .tooltip-message-box fa-icon{font-size:2rem;margin-left:.5rem}.icon .no-details{opacity:0;transform:scale(0)}.icon .details{opacity:1;transform:scale(1)}\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"] }] });
|
|
940
940
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CustomTooltipComponent, decorators: [{
|
|
941
941
|
type: Component,
|
|
942
|
-
args: [{ selector: 'custom-tooltip', template: "<div class=\"icon\">\r\n <div class=\"content\" (mouseleave)=\"onMouseLeave()\">\r\n <div (click)=\"onMouseClick()\" class=\"icon-container\" (mouseenter)=\"onMouseEnter()\">\r\n <div>\r\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\r\n </div>\r\n </div>\r\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\r\n <fa-icon icon=\"caret-left\"></fa-icon>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;position:relative;width:3rem}.icon .content{position:absolute;display:flex;flex-direction:row;top:0}.icon .icon-container{display:inline-block;height:-moz-fit-content;height:fit-content;cursor:pointer}.icon .icon-container .icon-shape{position:relative;z-index:-2}.icon .tooltip-message-box{align-self:center;display:flex;column-gap:0rem;z-index:100;transition:all .1s ease-in-out;z-index:1}.icon .tooltip-message-box fa-icon{font-size:2rem;margin-left:.5rem}.icon .no-details{opacity:0;transform:scale(0)}.icon .details{opacity:1;transform:scale(1)}\n"] }]
|
|
942
|
+
args: [{ selector: 'custom-tooltip', template: "<div class=\"icon\">\r\n <div class=\"content\" (mouseleave)=\"onMouseLeave()\">\r\n <div (click)=\"onMouseClick()\" class=\"icon-container\" (mouseenter)=\"onMouseEnter()\">\r\n <div>\r\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\r\n </div>\r\n </div>\r\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\r\n <fa-icon icon=\"caret-left\"></fa-icon>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;position:relative;width:3rem}.icon .content{position:absolute;display:flex;flex-direction:row;top:0}.icon .icon-container{display:inline-block;height:-moz-fit-content;height:fit-content;cursor:pointer}.icon .icon-container .icon-shape{position:relative;z-index:-2}.icon .tooltip-message-box{align-self:center;display:flex;column-gap:0rem;z-index:100;transition:all .1s ease-in-out;z-index:1}.icon .tooltip-message-box fa-icon{font-size:2rem;margin-left:.5rem}.icon .no-details{opacity:0;transform:scale(0)}.icon .details{opacity:1;transform:scale(1)}\n"] }]
|
|
943
943
|
}] });
|
|
944
944
|
|
|
945
945
|
class ValuePropCardComponent {
|
|
@@ -950,10 +950,10 @@ class ValuePropCardComponent {
|
|
|
950
950
|
}
|
|
951
951
|
}
|
|
952
952
|
ValuePropCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
953
|
-
ValuePropCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropCardComponent, selector: "value-prop-card", inputs: { ValuePropContent: "ValuePropContent" }, ngImport: i0, template: "<div class=\"reason-block\">\r\n <div class=\"reason-headline\">\r\n <div class=\"reason-icon\" *ngIf=\"icon\">\r\n <fa-icon [icon]=\"icon\"></fa-icon>\r\n </div>\r\n <div class=\"reason-image\" *ngIf=\"!icon\">\r\n <img [src]=\"ValuePropContent.image\" alt=\"\">\r\n </div>\r\n <div class=\"reason-title\">\r\n {{ValuePropContent.title}}\r\n </div>\r\n </div>\r\n <div class=\"reason-desc\">\r\n {{ValuePropContent.description}}\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.reason-block{border-radius:2rem;padding:.5rem 1.5rem;background-color:#fff;color:#32353b;font-weight:400;font-size:1.6rem;margin:1rem 1rem 2rem;display:inline-block;height:95%;box-shadow:.2rem .2rem .4rem #00000040}.reason-block .reason-headline{display:flex;flex-direction:row;column-gap:2rem;padding:1.5rem 0rem;align-items:center}.reason-block .reason-headline .reason-icon{color:#155ed4;font-size:3rem}.reason-block .reason-headline .reason-image img{width:4rem;aspect-ratio:3/2;object-fit:contain}.reason-block .reason-headline .reason-title{color:#32353b;font-weight:600;font-size:2rem}.reason-block .reason-desc{font-weight:300}@media only screen and (max-width: 37.5em){.reason-block{height:93%;width:95%}}\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"] }] });
|
|
953
|
+
ValuePropCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropCardComponent, selector: "value-prop-card", inputs: { ValuePropContent: "ValuePropContent" }, ngImport: i0, template: "<div class=\"reason-block\">\r\n <div class=\"reason-headline\">\r\n <div class=\"reason-icon\" *ngIf=\"icon\">\r\n <fa-icon [icon]=\"icon\"></fa-icon>\r\n </div>\r\n <div class=\"reason-image\" *ngIf=\"!icon\">\r\n <img [src]=\"ValuePropContent.image\" alt=\"\">\r\n </div>\r\n <div class=\"reason-title\">\r\n {{ValuePropContent.title}}\r\n </div>\r\n </div>\r\n <div class=\"reason-desc\">\r\n {{ValuePropContent.description}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.reason-block{border-radius:2rem;padding:.5rem 1.5rem;background-color:#fff;color:#32353b;font-weight:400;font-size:1.6rem;margin:1rem 1rem 2rem;display:inline-block;height:95%;box-shadow:.2rem .2rem .4rem #00000040}.reason-block .reason-headline{display:flex;flex-direction:row;column-gap:2rem;padding:1.5rem 0rem;align-items:center}.reason-block .reason-headline .reason-icon{color:#155ed4;font-size:3rem}.reason-block .reason-headline .reason-image img{width:4rem;aspect-ratio:3/2;object-fit:contain}.reason-block .reason-headline .reason-title{color:#32353b;font-weight:600;font-size:2rem}.reason-block .reason-desc{font-weight:300}@media only screen and (max-width: 37.5em){.reason-block{height:93%;width:95%}}\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"] }] });
|
|
954
954
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropCardComponent, decorators: [{
|
|
955
955
|
type: Component,
|
|
956
|
-
args: [{ selector: 'value-prop-card', template: "<div class=\"reason-block\">\r\n <div class=\"reason-headline\">\r\n <div class=\"reason-icon\" *ngIf=\"icon\">\r\n <fa-icon [icon]=\"icon\"></fa-icon>\r\n </div>\r\n <div class=\"reason-image\" *ngIf=\"!icon\">\r\n <img [src]=\"ValuePropContent.image\" alt=\"\">\r\n </div>\r\n <div class=\"reason-title\">\r\n {{ValuePropContent.title}}\r\n </div>\r\n </div>\r\n <div class=\"reason-desc\">\r\n {{ValuePropContent.description}}\r\n </div>\r\n</div>", styles: ["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-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.reason-block{border-radius:2rem;padding:.5rem 1.5rem;background-color:#fff;color:#32353b;font-weight:400;font-size:1.6rem;margin:1rem 1rem 2rem;display:inline-block;height:95%;box-shadow:.2rem .2rem .4rem #00000040}.reason-block .reason-headline{display:flex;flex-direction:row;column-gap:2rem;padding:1.5rem 0rem;align-items:center}.reason-block .reason-headline .reason-icon{color:#155ed4;font-size:3rem}.reason-block .reason-headline .reason-image img{width:4rem;aspect-ratio:3/2;object-fit:contain}.reason-block .reason-headline .reason-title{color:#32353b;font-weight:600;font-size:2rem}.reason-block .reason-desc{font-weight:300}@media only screen and (max-width: 37.5em){.reason-block{height:93%;width:95%}}\n"] }]
|
|
956
|
+
args: [{ selector: 'value-prop-card', template: "<div class=\"reason-block\">\r\n <div class=\"reason-headline\">\r\n <div class=\"reason-icon\" *ngIf=\"icon\">\r\n <fa-icon [icon]=\"icon\"></fa-icon>\r\n </div>\r\n <div class=\"reason-image\" *ngIf=\"!icon\">\r\n <img [src]=\"ValuePropContent.image\" alt=\"\">\r\n </div>\r\n <div class=\"reason-title\">\r\n {{ValuePropContent.title}}\r\n </div>\r\n </div>\r\n <div class=\"reason-desc\">\r\n {{ValuePropContent.description}}\r\n </div>\r\n</div>", styles: ["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%}}@font-face{font-family:inherit}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.reason-block{border-radius:2rem;padding:.5rem 1.5rem;background-color:#fff;color:#32353b;font-weight:400;font-size:1.6rem;margin:1rem 1rem 2rem;display:inline-block;height:95%;box-shadow:.2rem .2rem .4rem #00000040}.reason-block .reason-headline{display:flex;flex-direction:row;column-gap:2rem;padding:1.5rem 0rem;align-items:center}.reason-block .reason-headline .reason-icon{color:#155ed4;font-size:3rem}.reason-block .reason-headline .reason-image img{width:4rem;aspect-ratio:3/2;object-fit:contain}.reason-block .reason-headline .reason-title{color:#32353b;font-weight:600;font-size:2rem}.reason-block .reason-desc{font-weight:300}@media only screen and (max-width: 37.5em){.reason-block{height:93%;width:95%}}\n"] }]
|
|
957
957
|
}], propDecorators: { ValuePropContent: [{
|
|
958
958
|
type: Input
|
|
959
959
|
}] } });
|
|
@@ -1216,5 +1216,5 @@ class callToActionButton {
|
|
|
1216
1216
|
* Generated bundle index. Do not edit.
|
|
1217
1217
|
*/
|
|
1218
1218
|
|
|
1219
|
-
export { Account, AccountType, Achievement, Achievements, AchievementsComponent, Address, CallToActionSectionComponent, CallToActionSectionTwo, CallToActionSectionTwoComponent, ChooseCountryWithFlagComponent, City, ComingSoonComponent, ContactUsPageComponent, Country, CtaSectionStyleFourComponent, CtaSectionStyleThreeComponent, CustomTooltipComponent, FAQ, FAQCategory, FAQSubcategory, FaqCategoryListingComponent, FaqListingComponent, GetStartedCTAComponent, HeaderSectionOneComponent, ImageGalleryModal, ImageSection, ImageSectionAction, JoolerWebsitesSharedModule, OurClientListingComponent, OurClientsComponent, PageSection, PageSectionAction, PageSectionStyleTenComponent, PageSectionStyleThirteen, PageSectionStyleThirteenComponent, PageSectionStyleThreeComponent, PageSectionWithMultipleCardsComponent, Perks, PricingPlansComponent, SectionTitleComponent, ServicePlan, SocialMediaIconsComponent, SuccessMessageDialogComponent, TeamComponent, TeamMember, TeamSection, User, UserType, ValuePropCardComponent, ValuePropsSectionComponent, ValuesComponent, VerticalSideTabsComponent, callToActionButton, socialMediaLinks };
|
|
1219
|
+
export { Account, AccountType, Achievement, Achievements, AchievementsComponent, Address, CallToActionSectionComponent, CallToActionSectionTwo, CallToActionSectionTwoComponent, ChooseCountryWithFlagComponent, City, ComingSoonComponent, ContactUsPageComponent, Country, CtaSectionStyleFourComponent, CtaSectionStyleThreeComponent, CustomTooltipComponent, FAQ, FAQCategory, FAQSubcategory, FaqCategoryListingComponent, FaqListingComponent, GetStartedCTAComponent, HeaderSectionOneComponent, ImageGalleryModal, ImageSection, ImageSectionAction, JoolerWebsitesSharedModule, OurClientListingComponent, OurClientsComponent, PageSection, PageSectionAction, PageSectionStyleTenComponent, PageSectionStyleThirteen, PageSectionStyleThirteenComponent, PageSectionStyleThreeComponent, PageSectionWithMultipleCardsComponent, Perks, PricingPlansComponent, SectionTitleComponent, SectionTitleSizes, ServicePlan, SocialMediaIconsComponent, SuccessMessageDialogComponent, TeamComponent, TeamMember, TeamSection, User, UserType, ValuePropCardComponent, ValuePropsSectionComponent, ValuesComponent, VerticalSideTabsComponent, callToActionButton, socialMediaLinks };
|
|
1220
1220
|
//# sourceMappingURL=jooler-websites-shared.mjs.map
|