@jooler/jooler-websites-shared 0.0.89 → 0.0.90
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/value-props-sections/value-props-sections.component.mjs +2 -2
- package/fesm2015/jooler-websites-shared.mjs +2 -2
- package/fesm2015/jooler-websites-shared.mjs.map +1 -1
- package/fesm2020/jooler-websites-shared.mjs +2 -2
- package/fesm2020/jooler-websites-shared.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -27,10 +27,10 @@ export class ValuePropsSectionsComponent {
|
|
|
27
27
|
}
|
|
28
28
|
}
|
|
29
29
|
ValuePropsSectionsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
30
|
-
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]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{column-
|
|
30
|
+
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]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;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;width:40rem;min-height:max-content;height:15rem}.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 .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}.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}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}\n"], dependencies: [{ kind: "component", type: i1.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.SectionTitleComponent, selector: "section-title", inputs: ["title", "subtitle", "alignLeft", "isDarkBg"] }] });
|
|
31
31
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ValuePropsSectionsComponent, decorators: [{
|
|
32
32
|
type: Component,
|
|
33
|
-
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]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{column-
|
|
33
|
+
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]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;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;width:40rem;min-height:max-content;height:15rem}.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 .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}.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}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}\n"] }]
|
|
34
34
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
35
35
|
type: Input
|
|
36
36
|
}] } });
|
|
@@ -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\">\n </section-title>\n <div class=\"value-prop-image\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{column-
|
|
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]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;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;width:40rem;min-height:max-content;height:15rem}.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 .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}.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}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count: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"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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\">\n </section-title>\n <div class=\"value-prop-image\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{column-
|
|
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]=\"selectedImage[i]\" alt=\"\">\n </div>\n <div class=\"paragraph-items\">\n\n <p *ngFor=\"let paragraph of valueprop.paragraphs; let j = index\" class=\"paragraph\"\n (click)=\"onChangeImage(paragraph.imagePath , i ,j)\"\n [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 </p>\n </div>\n </div>\n <div class=\"image-buttons-side\">\n <img [src]=\"selectedImage[i]\" alt=\"\">\n </div>\n</div>", styles: ["@import\"~@angular/material/prebuilt-themes/indigo-pink.css\";@import\"https://fonts.googleapis.com/icon?family=Material+Icons\";@import\"~@ng-select/ng-select/themes/material.theme.css\";@import\"~primeng/resources/themes/saga-blue/theme.css\";@import\"~primeng/resources/primeng.min.css\";@import\"~primeicons/primeicons.css\";@import\"~ag-grid-community/styles/ag-grid.css\";@import\"~ag-grid-community/styles/ag-theme-material.css\";*{padding:0;margin:0}html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;column-gap:2%;margin:2rem auto;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:60%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;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;width:40rem;min-height:max-content;height:15rem}.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 .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}.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}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}\n"] }]
|
|
535
535
|
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
536
536
|
type: Input
|
|
537
537
|
}] } });
|