@jooler/jooler-websites-shared 0.0.60 → 0.0.62
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/page-section-style-three/page-section-style-three.component.mjs +4 -3
- package/esm2020/lib/value-props-sections/value-props-sections.component.mjs +3 -3
- package/esm2020/lib/values/values.component.mjs +3 -3
- package/fesm2015/jooler-websites-shared.mjs +6 -6
- package/fesm2015/jooler-websites-shared.mjs.map +1 -1
- package/fesm2020/jooler-websites-shared.mjs +6 -6
- package/fesm2020/jooler-websites-shared.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1,17 +1,18 @@
|
|
|
1
1
|
import { Component, Input } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
import * as i1 from "@angular/common";
|
|
4
|
+
import * as i2 from "../section-title/section-title.component";
|
|
4
5
|
export class PageSectionStyleThreeComponent {
|
|
5
6
|
constructor() { }
|
|
6
7
|
ngOnInit() {
|
|
7
8
|
}
|
|
8
9
|
}
|
|
9
10
|
PageSectionStyleThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
10
|
-
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { pageSection: "pageSection" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <
|
|
11
|
+
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { pageSection: "pageSection" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <section-title title=\"\" subtitle=\"\" [alignLeft]=\"true\"></section-title>\n <div class=\"description\">{{valueprop.description}}</div>\n </div>\n </div>\n </div>\n</div>", styles: [".page{row-gap:5rem;display:grid;justify-items:center;padding:2rem 0rem}.page .section{margin:2rem 0rem;padding:2rem 5%;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;flex-direction:row;column-gap:2%}@media only screen and (min-width: 1500px){.page .section{padding:2rem 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:55%;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 .description{font-size:2.2rem;font-weight:500}.page .section .image-side{border-radius:1.5rem;width:43%;box-shadow:0 .1rem .5rem #00000040}.page .section .image-side img{border-radius:1.5rem;width:100%}@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 .text-side .description{font-size:1.8rem;font-weight:500}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
11
12
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, decorators: [{
|
|
12
13
|
type: Component,
|
|
13
|
-
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <
|
|
14
|
+
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <section-title title=\"\" subtitle=\"\" [alignLeft]=\"true\"></section-title>\n <div class=\"description\">{{valueprop.description}}</div>\n </div>\n </div>\n </div>\n</div>", styles: [".page{row-gap:5rem;display:grid;justify-items:center;padding:2rem 0rem}.page .section{margin:2rem 0rem;padding:2rem 5%;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;flex-direction:row;column-gap:2%}@media only screen and (min-width: 1500px){.page .section{padding:2rem 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:55%;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 .description{font-size:2.2rem;font-weight:500}.page .section .image-side{border-radius:1.5rem;width:43%;box-shadow:0 .1rem .5rem #00000040}.page .section .image-side img{border-radius:1.5rem;width:100%}@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 .text-side .description{font-size:1.8rem;font-weight:500}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"] }]
|
|
14
15
|
}], ctorParameters: function () { return []; }, propDecorators: { pageSection: [{
|
|
15
16
|
type: Input
|
|
16
17
|
}] } });
|
|
17
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
18
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9wYWdlLXNlY3Rpb24tc3R5bGUtdGhyZWUvcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9wYWdlLXNlY3Rpb24tc3R5bGUtdGhyZWUvcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7O0FBTXpELE1BQU0sT0FBTyw4QkFBOEI7SUFHekMsZ0JBQWdCLENBQUM7SUFFakIsUUFBUTtJQUVSLENBQUM7OzJIQVBVLDhCQUE4QjsrR0FBOUIsOEJBQThCLHdHQ04zQyx5ZkFhTTsyRkRQTyw4QkFBOEI7a0JBTDFDLFNBQVM7K0JBQ0UsMEJBQTBCOzBFQUszQixXQUFXO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdwYWdlLXNlY3Rpb24tc3R5bGUtdGhyZWUnLFxuICB0ZW1wbGF0ZVVybDogJy4vcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgUGFnZVNlY3Rpb25TdHlsZVRocmVlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgQElucHV0KCkgcGFnZVNlY3Rpb246IGFueVtdOy8vfCBQYWdlU2VjdGlvbjtcblxuICBjb25zdHJ1Y3RvcigpIHsgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuXG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJwYWdlXCI+XG4gIDxkaXYgY2xhc3M9XCJzZWN0aW9uXCIgKm5nRm9yPVwibGV0IHZhbHVlcHJvcCBvZiBwYWdlU2VjdGlvblwiPlxuICAgIDxkaXYgY2xhc3M9XCJzZWN0aW9uLWNvbnRhaW5lclwiPlxuICAgICAgPGRpdiBjbGFzcz1cImltYWdlLXNpZGVcIj5cbiAgICAgICAgPGltZyBbc3JjXT1cInZhbHVlcHJvcC5pbWFnZVwiPlxuICAgICAgPC9kaXY+XG4gICAgICA8ZGl2IGNsYXNzPVwidGV4dC1zaWRlXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ0aXRsZVwiPnt7dmFsdWVwcm9wLnRpdGxlfX08L2Rpdj5cbiAgICAgICAgPHNlY3Rpb24tdGl0bGUgdGl0bGU9XCJcIiBzdWJ0aXRsZT1cIlwiIFthbGlnbkxlZnRdPVwidHJ1ZVwiPjwvc2VjdGlvbi10aXRsZT5cbiAgICAgICAgPGRpdiBjbGFzcz1cImRlc2NyaXB0aW9uXCI+e3t2YWx1ZXByb3AuZGVzY3JpcHRpb259fTwvZGl2PlxuICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9kaXY+Il19
|
|
@@ -29,11 +29,11 @@ export class ValuePropsSectionsComponent {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
ValuePropsSectionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
-
ValuePropsSectionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropsSectionsComponent, selector: "value-props-sections", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\"
|
|
32
|
+
ValuePropsSectionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropsSectionsComponent, selector: "value-props-sections", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\">\n </section-title>\n <div class=\"value-prop-image\">\n <!-- <img [src]=\"valueprop.paragraphs[i].imagePath\" alt=\"\"> -->\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span>\n {{paragraph.text}}\n </span>\n <!-- <span class=\"cta-icon-container\"><fa-icon [icon]=\"paragraph.ctaIcon\" class=\"cta-icon\"></fa-icon></span> -->\n </p>\n </div>\n <div class=\"image-buttons-side\">\n <img onerror=\"'../../../assets/images/value-one.jpeg'\" [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: [".value-prop{display:flex;flex-direction:row;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph{box-sizing:border-box;padding:1rem;display:grid;grid-template-columns:5rem auto auto;margin:1rem 0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem}.value-prop .text-side .paragraph:hover{background-color:#155ed4;color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon{color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .paragraph:hover .cta-icon{color:#fff;background-color:#155ed4}.value-prop .text-side .paragraph .cta-icon-container{display:grid;align-items:center}.value-prop .text-side .paragraph .cta-icon{align-self:center;justify-content:center;display:grid;font-size:3rem;transform:rotate(-45deg);color:#155ed4;background-color:#fff;border-radius:.7rem;padding:1rem;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#155ed4}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .selected-paragraph{background-color:#155ed4;color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph:hover .cta-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:38%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}.value-prop:nth-child(even){flex-direction:row-reverse}.value-prop:nth-child(even) .text-side .paragraph{padding:1rem;border-radius:.7rem;border:.1rem solid #E3E3E3}.value-prop:nth-child(even) .text-side .paragraph .value-prop-icon{text-align:center}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(even){flex-direction:row}.value-prop:nth-child(even) .image-buttons-side{justify-self:center}.value-prop .text-side{width:100%;justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "component", type: i3.SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
33
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionsComponent, decorators: [{
|
|
34
34
|
type: Component,
|
|
35
|
-
args: [{ selector: 'value-props-sections', template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\"
|
|
35
|
+
args: [{ selector: 'value-props-sections', template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\">\n </section-title>\n <div class=\"value-prop-image\">\n <!-- <img [src]=\"valueprop.paragraphs[i].imagePath\" alt=\"\"> -->\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span>\n {{paragraph.text}}\n </span>\n <!-- <span class=\"cta-icon-container\"><fa-icon [icon]=\"paragraph.ctaIcon\" class=\"cta-icon\"></fa-icon></span> -->\n </p>\n </div>\n <div class=\"image-buttons-side\">\n <img onerror=\"'../../../assets/images/value-one.jpeg'\" [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: [".value-prop{display:flex;flex-direction:row;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph{box-sizing:border-box;padding:1rem;display:grid;grid-template-columns:5rem auto auto;margin:1rem 0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem}.value-prop .text-side .paragraph:hover{background-color:#155ed4;color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon{color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .paragraph:hover .cta-icon{color:#fff;background-color:#155ed4}.value-prop .text-side .paragraph .cta-icon-container{display:grid;align-items:center}.value-prop .text-side .paragraph .cta-icon{align-self:center;justify-content:center;display:grid;font-size:3rem;transform:rotate(-45deg);color:#155ed4;background-color:#fff;border-radius:.7rem;padding:1rem;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#155ed4}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .selected-paragraph{background-color:#155ed4;color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph:hover .cta-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:38%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}.value-prop:nth-child(even){flex-direction:row-reverse}.value-prop:nth-child(even) .text-side .paragraph{padding:1rem;border-radius:.7rem;border:.1rem solid #E3E3E3}.value-prop:nth-child(even) .text-side .paragraph .value-prop-icon{text-align:center}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(even){flex-direction:row}.value-prop:nth-child(even) .image-buttons-side{justify-self:center}.value-prop .text-side{width:100%;justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}\n"] }]
|
|
36
36
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
37
37
|
type: Input
|
|
38
38
|
}] } });
|
|
39
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
39
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmFsdWUtcHJvcHMtc2VjdGlvbnMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvam9vbGVyLXdlYnNpdGVzLXNoYXJlZC9zcmMvbGliL3ZhbHVlLXByb3BzLXNlY3Rpb25zL3ZhbHVlLXByb3BzLXNlY3Rpb25zLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92YWx1ZS1wcm9wcy1zZWN0aW9ucy92YWx1ZS1wcm9wcy1zZWN0aW9ucy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFPekQsTUFBTSxPQUFPLDJCQUEyQjtJQUd0Qyw4QkFBOEI7SUFHOUI7UUFKQSxrQkFBYSxHQUFVLEVBQUUsQ0FBQztJQUlWLENBQUM7SUFFakIsUUFBUTtRQUNOLHlFQUF5RTtRQUN6RSxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7UUFDVixLQUFLLElBQUksSUFBSSxJQUFJLElBQUksQ0FBQyxjQUFjLEVBQUU7WUFDcEMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUMsR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQztZQUNyRCxDQUFDLEVBQUUsQ0FBQztZQUNKLEtBQUssSUFBSSxTQUFTLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtnQkFDckMsU0FBUyxDQUFDLFNBQVMsR0FBRyxLQUFLLENBQUM7YUFDN0I7WUFDRCxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVMsR0FBRyxJQUFJLENBQUM7U0FDckM7SUFDSCxDQUFDO0lBRUQsYUFBYSxDQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsY0FBYztRQUNuRCxLQUFLLElBQUksU0FBUyxJQUFJLElBQUksQ0FBQyxjQUFjLENBQUMsWUFBWSxDQUFDLENBQUMsVUFBVSxFQUFFO1lBQ2xFLFNBQVMsQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1NBQzdCO1FBQ0QsSUFBSSxDQUFDLGFBQWEsQ0FBQyxZQUFZLENBQUMsR0FBRyxTQUFTLENBQUM7UUFDN0MsSUFBSSxDQUFDLGNBQWMsQ0FBQyxZQUFZLENBQUMsQ0FBQyxVQUFVLENBQUMsY0FBYyxDQUFDLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQztJQUNoRixDQUFDOzt3SEEzQlUsMkJBQTJCOzRHQUEzQiwyQkFBMkIsMEdDUHhDLGdxQ0FxQk07MkZEZE8sMkJBQTJCO2tCQUx2QyxTQUFTOytCQUNFLHNCQUFzQjswRUFLdkIsY0FBYztzQkFBdEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd2YWx1ZS1wcm9wcy1zZWN0aW9ucycsXG4gIHRlbXBsYXRlVXJsOiAnLi92YWx1ZS1wcm9wcy1zZWN0aW9ucy5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL3ZhbHVlLXByb3BzLXNlY3Rpb25zLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgVmFsdWVQcm9wc1NlY3Rpb25zQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgQElucHV0KCkgc2VjdGlvbkNvbnRlbnQ6IGFueTtcbiAgc2VsZWN0ZWRJbWFnZTogYW55W10gPSBbXTtcbiAgLy8gaXNTZWxlY3RlZDogYm9vbGVhbltdID0gW107XG5cblxuICBjb25zdHJ1Y3RvcigpIHsgfVxuXG4gIG5nT25Jbml0KCkge1xuICAgIC8vIGNvbnNvbGUubG9nKCdodWh1aHVoJywgdGhpcy5zZWN0aW9uQ29udGVudFswXS5wYXJhZ3JhcGhzWzBdLmltYWdlUGF0aClcbiAgICBsZXQgaSA9IDA7XG4gICAgZm9yIChsZXQgaXRlbSBvZiB0aGlzLnNlY3Rpb25Db250ZW50KSB7XG4gICAgICB0aGlzLnNlbGVjdGVkSW1hZ2VbaV0gPSBpdGVtLnBhcmFncmFwaHNbMF0uaW1hZ2VQYXRoO1xuICAgICAgaSsrO1xuICAgICAgZm9yIChsZXQgcGFyYWdyYXBoIG9mIGl0ZW0ucGFyYWdyYXBocykge1xuICAgICAgICBwYXJhZ3JhcGguaXNDbGlja2VkID0gZmFsc2U7XG4gICAgICB9XG4gICAgICBpdGVtLnBhcmFncmFwaHNbMF0uaXNDbGlja2VkID0gdHJ1ZTtcbiAgICB9XG4gIH1cblxuICBvbkNoYW5nZUltYWdlKGltYWdlUGF0aCwgc2VjdGlvbkluZGV4LCBwYXJhZ3JhcGhJbmRleCkge1xuICAgIGZvciAobGV0IHBhcmFncmFwaCBvZiB0aGlzLnNlY3Rpb25Db250ZW50W3NlY3Rpb25JbmRleF0ucGFyYWdyYXBocykge1xuICAgICAgcGFyYWdyYXBoLmlzQ2xpY2tlZCA9IGZhbHNlO1xuICAgIH1cbiAgICB0aGlzLnNlbGVjdGVkSW1hZ2Vbc2VjdGlvbkluZGV4XSA9IGltYWdlUGF0aDtcbiAgICB0aGlzLnNlY3Rpb25Db250ZW50W3NlY3Rpb25JbmRleF0ucGFyYWdyYXBoc1twYXJhZ3JhcGhJbmRleF0uaXNDbGlja2VkID0gdHJ1ZTtcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cInZhbHVlLXByb3BcIiAqbmdGb3I9XCJsZXQgdmFsdWVwcm9wIG9mIHNlY3Rpb25Db250ZW50OyBsZXQgaSA9IGluZGV4XCI+XG4gICAgPGRpdiBjbGFzcz1cInRleHQtc2lkZVwiPlxuICAgICAgICA8c2VjdGlvbi10aXRsZSBbdGl0bGVdPVwidmFsdWVwcm9wLnRpdGxlXCIgW3N1YnRpdGxlXT1cInZhbHVlcHJvcC5zdWJ0aXRsZVwiIFthbGlnbkxlZnRdPVwidHJ1ZVwiPlxuICAgICAgICA8L3NlY3Rpb24tdGl0bGU+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ2YWx1ZS1wcm9wLWltYWdlXCI+XG4gICAgICAgICAgICA8IS0tIDxpbWcgW3NyY109XCJ2YWx1ZXByb3AucGFyYWdyYXBoc1tpXS5pbWFnZVBhdGhcIiBhbHQ9XCJcIj4gLS0+XG4gICAgICAgICAgICA8aW1nIFtzcmNdPVwic2VsZWN0ZWRJbWFnZVtpXVwiIGFsdD1cIlwiPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPHAgKm5nRm9yPVwibGV0IHBhcmFncmFwaCBvZiB2YWx1ZXByb3AucGFyYWdyYXBoczsgbGV0IGogPSBpbmRleFwiIGNsYXNzPVwicGFyYWdyYXBoXCJcbiAgICAgICAgICAgIChjbGljayk9XCJvbkNoYW5nZUltYWdlKHBhcmFncmFwaC5pbWFnZVBhdGggLCBpICxqKVwiIFtuZ0NsYXNzXT1cInsnc2VsZWN0ZWQtcGFyYWdyYXBoJzpwYXJhZ3JhcGguaXNDbGlja2VkfVwiPlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJ2YWx1ZS1wcm9wLWljb25cIj5cbiAgICAgICAgICAgICAgICA8ZmEtaWNvbiBbaWNvbl09XCJwYXJhZ3JhcGguaWNvbk5hbWVcIj48L2ZhLWljb24+PC9zcGFuPlxuICAgICAgICAgICAgPHNwYW4+XG4gICAgICAgICAgICAgICAge3twYXJhZ3JhcGgudGV4dH19XG4gICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICA8IS0tIDxzcGFuIGNsYXNzPVwiY3RhLWljb24tY29udGFpbmVyXCI+PGZhLWljb24gW2ljb25dPVwicGFyYWdyYXBoLmN0YUljb25cIiBjbGFzcz1cImN0YS1pY29uXCI+PC9mYS1pY29uPjwvc3Bhbj4gLS0+XG4gICAgICAgIDwvcD5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2IGNsYXNzPVwiaW1hZ2UtYnV0dG9ucy1zaWRlXCI+XG4gICAgICAgIDxpbWcgb25lcnJvcj1cIicuLi8uLi8uLi9hc3NldHMvaW1hZ2VzL3ZhbHVlLW9uZS5qcGVnJ1wiIFtzcmNdPVwic2VsZWN0ZWRJbWFnZVtpXVwiIGFsdD1cIlwiPlxuICAgIDwvZGl2PlxuPC9kaXY+Il19
|
|
@@ -26,10 +26,10 @@ export class ValuesComponent {
|
|
|
26
26
|
}
|
|
27
27
|
}
|
|
28
28
|
ValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, deps: [{ token: i1.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
29
|
-
ValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuesComponent, selector: "values", inputs: { values: "values", withBgImage: "withBgImage", isDarkBg: "isDarkBg" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.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: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: i6.SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
29
|
+
ValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuesComponent, selector: "values", inputs: { values: "values", withBgImage: "withBgImage", isDarkBg: "isDarkBg" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\" [isDarkBg]=\"true\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.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: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: i6.SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
30
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, decorators: [{
|
|
31
31
|
type: Component,
|
|
32
|
-
args: [{ selector: 'values', template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"] }]
|
|
32
|
+
args: [{ selector: 'values', template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\" [isDarkBg]=\"true\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"] }]
|
|
33
33
|
}], ctorParameters: function () { return [{ type: i1.BreakpointObserver }]; }, propDecorators: { values: [{
|
|
34
34
|
type: Input
|
|
35
35
|
}], withBgImage: [{
|
|
@@ -37,4 +37,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
37
37
|
}], isDarkBg: [{
|
|
38
38
|
type: Input
|
|
39
39
|
}] } });
|
|
40
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
40
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmFsdWVzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92YWx1ZXMvdmFsdWVzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92YWx1ZXMvdmFsdWVzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7Ozs7OztBQVN6RCxNQUFNLE9BQU8sZUFBZTtJQU0xQixZQUFvQixrQkFBc0M7UUFBdEMsdUJBQWtCLEdBQWxCLGtCQUFrQixDQUFvQjtRQUpqRCxnQkFBVyxHQUFZLEtBQUssQ0FBQztRQUM3QixhQUFRLEdBQVksS0FBSyxDQUFDO0lBTW5DLENBQUM7SUFDRCxRQUFRO1FBRU4sSUFBSSxDQUFDLGtCQUFrQixDQUFDLE9BQU8sQ0FBQztZQUM5QixxQkFBcUI7U0FDdEIsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLE1BQXVCLEVBQUUsRUFBRTtZQUN2QyxJQUFJLE1BQU0sQ0FBQyxPQUFPLEVBQUU7Z0JBQ2xCLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO2FBQzFCO2lCQUFNO2dCQUNMLElBQUksQ0FBQyxZQUFZLEdBQUcsS0FBSyxDQUFDO2FBQzNCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDOzs0R0FyQlUsZUFBZTtnR0FBZixlQUFlLDhIQ1Q1QixzcURBc0NNOzJGRDdCTyxlQUFlO2tCQUwzQixTQUFTOytCQUNFLFFBQVE7eUdBS1QsTUFBTTtzQkFBZCxLQUFLO2dCQUNHLFdBQVc7c0JBQW5CLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tcGFueVZhbHVlcyB9IGZyb20gJy4uL21vZGVscy9hYm91dC11cy1zZWN0aW9uLm1vZGVsJztcbmltcG9ydCB7IEJyZWFrcG9pbnRPYnNlcnZlciwgQnJlYWtwb2ludFN0YXRlIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2xheW91dCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3ZhbHVlcycsXG4gIHRlbXBsYXRlVXJsOiAnLi92YWx1ZXMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi92YWx1ZXMuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBWYWx1ZXNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBASW5wdXQoKSB2YWx1ZXM6IENvbXBhbnlWYWx1ZXM7XG4gIEBJbnB1dCgpIHdpdGhCZ0ltYWdlOiBib29sZWFuID0gZmFsc2U7XG4gIEBJbnB1dCgpIGlzRGFya0JnOiBib29sZWFuID0gZmFsc2U7XG4gIGlzVGFibGV0U2l6ZTogYm9vbGVhbjtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGJyZWFrcG9pbnRPYnNlcnZlcjogQnJlYWtwb2ludE9ic2VydmVyXG4gICkge1xuXG4gIH1cbiAgbmdPbkluaXQoKTogdm9pZCB7XG5cbiAgICB0aGlzLmJyZWFrcG9pbnRPYnNlcnZlci5vYnNlcnZlKFtcbiAgICAgIFwiKG1heC13aWR0aDogMTIwMHB4KVwiXG4gICAgXSkuc3Vic2NyaWJlKChyZXN1bHQ6IEJyZWFrcG9pbnRTdGF0ZSkgPT4ge1xuICAgICAgaWYgKHJlc3VsdC5tYXRjaGVzKSB7XG4gICAgICAgIHRoaXMuaXNUYWJsZXRTaXplID0gdHJ1ZTtcbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIHRoaXMuaXNUYWJsZXRTaXplID0gZmFsc2U7XG4gICAgICB9XG4gICAgfSk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJwYWdlXCI+XG4gICAgPHNlY3Rpb24tdGl0bGUgW3RpdGxlXT1cInZhbHVlcy50aXRsZVwiIFtzdWJ0aXRsZV09XCJ2YWx1ZXMuZGVzY3JpcHRpb25cIiBbaXNEYXJrQmddPVwidHJ1ZVwiPjwvc2VjdGlvbi10aXRsZT5cbiAgICA8aW1nIGNsYXNzPVwiYmFja2dyb3VuZC1pbWFnZVwiIHNyYz1cImh0dHBzOi8vaS5pYmIuY28vazZRelkxNi9iZy1pbWctYWJvdXQtdXMtYm90dG9tLnBuZ1wiIGFsdD1cIlwiICpuZ0lmPVwid2l0aEJnSW1hZ2VcIj5cbiAgICA8ZGl2IGNsYXNzPVwidmFsdWVzLWNhcmRzXCIgKm5nSWY9XCIhaXNUYWJsZXRTaXplXCI+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkXCIgKm5nRm9yPVwibGV0IGNhcmQgb2YgdmFsdWVzLmNhcmRzXCI+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiY2FyZC1oZWFkbGluZVwiPlxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJpY29uXCI+XG4gICAgICAgICAgICAgICAgICAgIDxmYS1pY29uIFtpY29uXT1cImNhcmQuaWNvbk5hbWVcIj48L2ZhLWljb24+XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInN1YnRpdGxlXCI+XG4gICAgICAgICAgICAgICAgICAgIHt7Y2FyZC50aXRsZX19XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJ2YWx1ZS1kZXNjcmlwdGlvblwiPlxuICAgICAgICAgICAgICAgIHt7Y2FyZC5zdWJ0aXRsZX19XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgPC9kaXY+XG4gICAgPGRpdiBjbGFzcz1cInZhbHVlLWNhcmRzXCIgKm5nSWY9XCJpc1RhYmxldFNpemVcIj5cbiAgICAgICAgPHAtY2Fyb3VzZWwgY2xhc3M9XCJjdXN0b21cIiBbdmFsdWVdPVwidmFsdWVzLmNhcmRzXCIgW251bVZpc2libGVdPScxJyBbbnVtU2Nyb2xsXT0nMScgW3BhZ2VdPVwiMFwiXG4gICAgICAgICAgICBvcmllbnRhdGlvbj1cImhvcml6b250YWxcIiBbY2lyY3VsYXJdPVwidHJ1ZVwiPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1jYXJkIHBUZW1wbGF0ZT1cIml0ZW1cIj5cbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiY2FyZFwiPlxuICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiY2FyZC1oZWFkbGluZVwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImljb25cIj5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8aW1nIFtzcmNdPVwiY2FyZC5pbWFnZVwiIGFsdD1cIlwiPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwic3VidGl0bGVcIj5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB7e2NhcmQudGl0bGV9fVxuICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwidmFsdWUtZGVzY3JpcHRpb25cIj5cbiAgICAgICAgICAgICAgICAgICAgICAgIHt7Y2FyZC5zdWJ0aXRsZX19XG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICAgICAgPC9wLWNhcm91c2VsPlxuICAgIDwvZGl2PlxuPC9kaXY+Il19
|
|
@@ -389,10 +389,10 @@ class ValuesComponent {
|
|
|
389
389
|
}
|
|
390
390
|
}
|
|
391
391
|
ValuesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, deps: [{ token: i1$2.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
392
|
-
ValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuesComponent, selector: "values", inputs: { values: "values", withBgImage: "withBgImage", isDarkBg: "isDarkBg" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.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: i4$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
392
|
+
ValuesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuesComponent, selector: "values", inputs: { values: "values", withBgImage: "withBgImage", isDarkBg: "isDarkBg" }, ngImport: i0, template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\" [isDarkBg]=\"true\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.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: i4$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
393
393
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuesComponent, decorators: [{
|
|
394
394
|
type: Component,
|
|
395
|
-
args: [{ selector: 'values', template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"] }]
|
|
395
|
+
args: [{ selector: 'values', template: "<div class=\"page\">\n <section-title [title]=\"values.title\" [subtitle]=\"values.description\" [isDarkBg]=\"true\"></section-title>\n <img class=\"background-image\" src=\"https://i.ibb.co/k6QzY16/bg-img-about-us-bottom.png\" alt=\"\" *ngIf=\"withBgImage\">\n <div class=\"values-cards\" *ngIf=\"!isTabletSize\">\n <div class=\"card\" *ngFor=\"let card of values.cards\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <fa-icon [icon]=\"card.iconName\"></fa-icon>\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </div>\n <div class=\"value-cards\" *ngIf=\"isTabletSize\">\n <p-carousel class=\"custom\" [value]=\"values.cards\" [numVisible]='1' [numScroll]='1' [page]=\"0\"\n orientation=\"horizontal\" [circular]=\"true\">\n <ng-template let-card pTemplate=\"item\">\n <div class=\"card\">\n <div class=\"card-headline\">\n <div class=\"icon\">\n <img [src]=\"card.image\" alt=\"\">\n </div>\n <div class=\"subtitle\">\n {{card.title}}\n </div>\n </div>\n <div class=\"value-description\">\n {{card.subtitle}}\n </div>\n </div>\n </ng-template>\n </p-carousel>\n </div>\n</div>", styles: [".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:2rem 2%;z-index:2;width:90%;margin:auto}@media only screen and (min-width: 1500px){.page .values-cards{max-width:150rem}}.page .card{background-color:#fff;color:#32353b;padding:1rem 2rem;border-radius:2rem;border:.1rem solid #D8D8D8;box-shadow:.2rem .2rem .4rem #00000040;display:flex;flex-direction:column;row-gap:1rem}.page .card .card-headline{display:flex;flex-direction:row;column-gap:2rem;align-items:center}.page .card .icon{color:#155ed4;font-size:3rem}.page .card .subtitle{font-weight:700;font-size:2.4rem}.page .card .value-description{font-weight:400;font-size:1.4rem}@media only screen and (max-width: 75em){.page{height:auto;display:block}.page .values-cards{margin-top:3rem;display:block;width:100%}.page .card{width:90%;margin:2rem auto;height:100%}}\n"] }]
|
|
396
396
|
}], ctorParameters: function () { return [{ type: i1$2.BreakpointObserver }]; }, propDecorators: { values: [{
|
|
397
397
|
type: Input
|
|
398
398
|
}], withBgImage: [{
|
|
@@ -528,10 +528,10 @@ class ValuePropsSectionsComponent {
|
|
|
528
528
|
}
|
|
529
529
|
}
|
|
530
530
|
ValuePropsSectionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
531
|
-
ValuePropsSectionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropsSectionsComponent, selector: "value-props-sections", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\"
|
|
531
|
+
ValuePropsSectionsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ValuePropsSectionsComponent, selector: "value-props-sections", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\">\n </section-title>\n <div class=\"value-prop-image\">\n <!-- <img [src]=\"valueprop.paragraphs[i].imagePath\" alt=\"\"> -->\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span>\n {{paragraph.text}}\n </span>\n <!-- <span class=\"cta-icon-container\"><fa-icon [icon]=\"paragraph.ctaIcon\" class=\"cta-icon\"></fa-icon></span> -->\n </p>\n </div>\n <div class=\"image-buttons-side\">\n <img onerror=\"'../../../assets/images/value-one.jpeg'\" [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: [".value-prop{display:flex;flex-direction:row;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph{box-sizing:border-box;padding:1rem;display:grid;grid-template-columns:5rem auto auto;margin:1rem 0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem}.value-prop .text-side .paragraph:hover{background-color:#155ed4;color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon{color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .paragraph:hover .cta-icon{color:#fff;background-color:#155ed4}.value-prop .text-side .paragraph .cta-icon-container{display:grid;align-items:center}.value-prop .text-side .paragraph .cta-icon{align-self:center;justify-content:center;display:grid;font-size:3rem;transform:rotate(-45deg);color:#155ed4;background-color:#fff;border-radius:.7rem;padding:1rem;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#155ed4}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .selected-paragraph{background-color:#155ed4;color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph:hover .cta-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:38%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}.value-prop:nth-child(even){flex-direction:row-reverse}.value-prop:nth-child(even) .text-side .paragraph{padding:1rem;border-radius:.7rem;border:.1rem solid #E3E3E3}.value-prop:nth-child(even) .text-side .paragraph .value-prop-icon{text-align:center}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(even){flex-direction:row}.value-prop:nth-child(even) .image-buttons-side{justify-self:center}.value-prop .text-side{width:100%;justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
532
532
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionsComponent, decorators: [{
|
|
533
533
|
type: Component,
|
|
534
|
-
args: [{ selector: 'value-props-sections', template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\"
|
|
534
|
+
args: [{ selector: 'value-props-sections', template: "<div class=\"value-prop\" *ngFor=\"let valueprop of sectionContent; let i = index\">\n <div class=\"text-side\">\n <section-title [title]=\"valueprop.title\" [subtitle]=\"valueprop.subtitle\" [alignLeft]=\"true\">\n </section-title>\n <div class=\"value-prop-image\">\n <!-- <img [src]=\"valueprop.paragraphs[i].imagePath\" alt=\"\"> -->\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked}\">\n <span class=\"value-prop-icon\">\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\n <span>\n {{paragraph.text}}\n </span>\n <!-- <span class=\"cta-icon-container\"><fa-icon [icon]=\"paragraph.ctaIcon\" class=\"cta-icon\"></fa-icon></span> -->\n </p>\n </div>\n <div class=\"image-buttons-side\">\n <img onerror=\"'../../../assets/images/value-one.jpeg'\" [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: [".value-prop{display:flex;flex-direction:row;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph{box-sizing:border-box;padding:1rem;display:grid;grid-template-columns:5rem auto auto;margin:1rem 0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem}.value-prop .text-side .paragraph:hover{background-color:#155ed4;color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon{color:#fff}.value-prop .text-side .paragraph:hover .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .paragraph:hover .cta-icon{color:#fff;background-color:#155ed4}.value-prop .text-side .paragraph .cta-icon-container{display:grid;align-items:center}.value-prop .text-side .paragraph .cta-icon{align-self:center;justify-content:center;display:grid;font-size:3rem;transform:rotate(-45deg);color:#155ed4;background-color:#fff;border-radius:.7rem;padding:1rem;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#155ed4}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .selected-paragraph{background-color:#155ed4;color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#fff}.value-prop .text-side .selected-paragraph .value-prop-icon fa-icon{color:#fff}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph:hover .cta-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:38%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}.value-prop:nth-child(even){flex-direction:row-reverse}.value-prop:nth-child(even) .text-side .paragraph{padding:1rem;border-radius:.7rem;border:.1rem solid #E3E3E3}.value-prop:nth-child(even) .text-side .paragraph .value-prop-icon{text-align:center}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(even){flex-direction:row}.value-prop:nth-child(even) .image-buttons-side{justify-self:center}.value-prop .text-side{width:100%;justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}\n"] }]
|
|
535
535
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
536
536
|
type: Input
|
|
537
537
|
}] } });
|
|
@@ -706,10 +706,10 @@ class PageSectionStyleThreeComponent {
|
|
|
706
706
|
}
|
|
707
707
|
}
|
|
708
708
|
PageSectionStyleThreeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
709
|
-
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { pageSection: "pageSection" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <
|
|
709
|
+
PageSectionStyleThreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { pageSection: "pageSection" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <section-title title=\"\" subtitle=\"\" [alignLeft]=\"true\"></section-title>\n <div class=\"description\">{{valueprop.description}}</div>\n </div>\n </div>\n </div>\n</div>", styles: [".page{row-gap:5rem;display:grid;justify-items:center;padding:2rem 0rem}.page .section{margin:2rem 0rem;padding:2rem 5%;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;flex-direction:row;column-gap:2%}@media only screen and (min-width: 1500px){.page .section{padding:2rem 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:55%;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 .description{font-size:2.2rem;font-weight:500}.page .section .image-side{border-radius:1.5rem;width:43%;box-shadow:0 .1rem .5rem #00000040}.page .section .image-side img{border-radius:1.5rem;width:100%}@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 .text-side .description{font-size:1.8rem;font-weight:500}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
710
710
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PageSectionStyleThreeComponent, decorators: [{
|
|
711
711
|
type: Component,
|
|
712
|
-
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <
|
|
712
|
+
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\n <div class=\"section\" *ngFor=\"let valueprop of pageSection\">\n <div class=\"section-container\">\n <div class=\"image-side\">\n <img [src]=\"valueprop.image\">\n </div>\n <div class=\"text-side\">\n <div class=\"title\">{{valueprop.title}}</div>\n <section-title title=\"\" subtitle=\"\" [alignLeft]=\"true\"></section-title>\n <div class=\"description\">{{valueprop.description}}</div>\n </div>\n </div>\n </div>\n</div>", styles: [".page{row-gap:5rem;display:grid;justify-items:center;padding:2rem 0rem}.page .section{margin:2rem 0rem;padding:2rem 5%;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;flex-direction:row;column-gap:2%}@media only screen and (min-width: 1500px){.page .section{padding:2rem 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:55%;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 .description{font-size:2.2rem;font-weight:500}.page .section .image-side{border-radius:1.5rem;width:43%;box-shadow:0 .1rem .5rem #00000040}.page .section .image-side img{border-radius:1.5rem;width:100%}@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 .text-side .description{font-size:1.8rem;font-weight:500}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"] }]
|
|
713
713
|
}], ctorParameters: function () { return []; }, propDecorators: { pageSection: [{
|
|
714
714
|
type: Input
|
|
715
715
|
}] } });
|