@jooler/jooler-websites-shared 0.0.241 → 0.0.243
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/cta-section-style-three/cta-section-style-three.component.mjs +8 -10
- package/esm2022/lib/get-started-cta/get-started-cta.component.mjs +3 -3
- package/esm2022/lib/vertical-side-tabs/vertical-side-tabs.component.mjs +6 -6
- package/fesm2022/jooler-websites-shared.mjs +7 -9
- package/fesm2022/jooler-websites-shared.mjs.map +1 -1
- package/lib/cta-section-style-three/cta-section-style-three.component.d.ts +1 -3
- package/package.json +6 -6
|
@@ -1,23 +1,21 @@
|
|
|
1
1
|
import { Component, Input } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
|
-
import * as i1 from "@angular/
|
|
4
|
-
import * as i2 from "@angular/
|
|
5
|
-
import * as i3 from "@angular/
|
|
3
|
+
import * as i1 from "@angular/common";
|
|
4
|
+
import * as i2 from "@angular/material/button";
|
|
5
|
+
import * as i3 from "@angular/router";
|
|
6
6
|
import * as i4 from "../section-title/section-title.component";
|
|
7
7
|
export class CtaSectionStyleThreeComponent {
|
|
8
|
-
_router;
|
|
9
8
|
sectionContent;
|
|
10
|
-
constructor(
|
|
11
|
-
this._router = _router;
|
|
9
|
+
constructor() {
|
|
12
10
|
}
|
|
13
11
|
ngOnInit() { }
|
|
14
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CtaSectionStyleThreeComponent, deps: [
|
|
15
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CtaSectionStyleThreeComponent, selector: "cta-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img loading=\"lazy\" *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\"\r\n class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && !sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"text-side\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"buttons-line\">\r\n <a *ngFor=\"let button of sectionContent.buttons\" [routerLink]=\"button.route\" class=\"custom-anchor\">\r\n <button mat-raised-button [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\r\n {{button.label}}\r\n </button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:2rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}@media only screen and (max-width: 75em){.main-card .text-side .section-title{width:85%}}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"], dependencies: [{ kind: "directive", type:
|
|
12
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CtaSectionStyleThreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CtaSectionStyleThreeComponent, selector: "cta-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img loading=\"lazy\" *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\"\r\n class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && !sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"text-side\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"buttons-line\">\r\n <a *ngFor=\"let button of sectionContent.buttons\" [routerLink]=\"button.route\" class=\"custom-anchor\">\r\n <button mat-raised-button [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\r\n {{button.label}}\r\n </button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:2rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}@media only screen and (max-width: 75em){.main-card .text-side .section-title{width:85%}}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle", "withoutTitleCase", "descriptionWidth"] }] });
|
|
16
14
|
}
|
|
17
15
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CtaSectionStyleThreeComponent, decorators: [{
|
|
18
16
|
type: Component,
|
|
19
17
|
args: [{ selector: 'cta-section-style-three', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img loading=\"lazy\" *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\"\r\n class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && !sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"text-side\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"buttons-line\">\r\n <a *ngFor=\"let button of sectionContent.buttons\" [routerLink]=\"button.route\" class=\"custom-anchor\">\r\n <button mat-raised-button [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\r\n {{button.label}}\r\n </button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:2rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}@media only screen and (max-width: 75em){.main-card .text-side .section-title{width:85%}}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"] }]
|
|
20
|
-
}], ctorParameters: function () { return [
|
|
18
|
+
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
21
19
|
type: Input
|
|
22
20
|
}] } });
|
|
23
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
21
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3RhLXNlY3Rpb24tc3R5bGUtdGhyZWUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvam9vbGVyLXdlYnNpdGVzLXNoYXJlZC9zcmMvbGliL2N0YS1zZWN0aW9uLXN0eWxlLXRocmVlL2N0YS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9jdGEtc2VjdGlvbi1zdHlsZS10aHJlZS9jdGEtc2VjdGlvbi1zdHlsZS10aHJlZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBU3pELE1BQU0sT0FBTyw2QkFBNkI7SUFDL0IsY0FBYyxDQUEwQjtJQUVqRDtJQUNBLENBQUM7SUFFRCxRQUFRLEtBQUksQ0FBQzt3R0FORiw2QkFBNkI7NEZBQTdCLDZCQUE2Qiw2R0NUMUMsa3lDQXFCTTs7NEZEWk8sNkJBQTZCO2tCQUx6QyxTQUFTOytCQUNFLHlCQUF5QjswRUFLMUIsY0FBYztzQkFBdEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xyXG5pbXBvcnQgeyBDYWxsVG9BY3Rpb25TdHlsZVRocmVlIH0gZnJvbSAnLi4vbW9kZWxzL2NhbGwtdG8tYWN0aW9uLXN0eWxlLm1vZGVsJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnY3RhLXNlY3Rpb24tc3R5bGUtdGhyZWUnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9jdGEtc2VjdGlvbi1zdHlsZS10aHJlZS5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbICcuL2N0YS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5zY3NzJyBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBDdGFTZWN0aW9uU3R5bGVUaHJlZUNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgQElucHV0KCkgc2VjdGlvbkNvbnRlbnQhOiBDYWxsVG9BY3Rpb25TdHlsZVRocmVlO1xyXG5cclxuICBjb25zdHJ1Y3RvcigpIHtcclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCkge31cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwibWFpbi1jYXJkXCIgW25nU3R5bGVdPVwieydiYWNrZ3JvdW5kJyA6IHNlY3Rpb25Db250ZW50LmJnQ29sb3J9XCI+XHJcbiAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgKm5nSWY9XCIhc2VjdGlvbkNvbnRlbnQuYmdDb2xvciAmJiBzZWN0aW9uQ29udGVudC5iZ0ltYWdlIFwiIFtzcmNdPVwic2VjdGlvbkNvbnRlbnQuYmdJbWFnZVwiXHJcbiAgICAgICAgY2xhc3M9XCJiZy1pbWdcIiBhbHQ9XCJiZy1pbWdcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJpbGx1c3RyYXRpb24tc2lkZVwiICpuZ0lmPVwic2VjdGlvbkNvbnRlbnQuc2lkZUltYWdlICYmICFzZWN0aW9uQ29udGVudC50aXRsZUltYWdlT3JkZXJcIj5cclxuICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJzZWN0aW9uQ29udGVudC5zaWRlSW1hZ2VcIiBjbGFzcz1cInNpZGUtaW1nXCIgYWx0PVwic2lkZS1pbWdcIj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGRpdiBjbGFzcz1cInRleHQtc2lkZVwiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJzZWN0aW9uLXRpdGxlXCI+XHJcbiAgICAgICAgICAgIDxzZWN0aW9uLXRpdGxlIFtzZWN0aW9uVGl0bGVdPVwic2VjdGlvbkNvbnRlbnQuc2VjdGlvblRpdGxlXCI+PC9zZWN0aW9uLXRpdGxlPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJpbGx1c3RyYXRpb24tc2lkZVwiICpuZ0lmPVwic2VjdGlvbkNvbnRlbnQuc2lkZUltYWdlICYmIHNlY3Rpb25Db250ZW50LnRpdGxlSW1hZ2VPcmRlclwiPlxyXG4gICAgICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJzZWN0aW9uQ29udGVudC5zaWRlSW1hZ2VcIiBjbGFzcz1cInNpZGUtaW1nXCIgYWx0PVwic2lkZS1pbWdcIj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiYnV0dG9ucy1saW5lXCI+XHJcbiAgICAgICAgICAgIDxhICpuZ0Zvcj1cImxldCBidXR0b24gb2Ygc2VjdGlvbkNvbnRlbnQuYnV0dG9uc1wiIFtyb3V0ZXJMaW5rXT1cImJ1dHRvbi5yb3V0ZVwiIGNsYXNzPVwiY3VzdG9tLWFuY2hvclwiPlxyXG4gICAgICAgICAgICAgICAgPGJ1dHRvbiBtYXQtcmFpc2VkLWJ1dHRvbiBbbmdTdHlsZV09XCJ7J2JhY2tncm91bmQnOmJ1dHRvbi5iZ0NvbG9yLCAnY29sb3InOiBidXR0b24udGV4dENvbG9yfVwiPlxyXG4gICAgICAgICAgICAgICAgICAgIHt7YnV0dG9uLmxhYmVsfX1cclxuICAgICAgICAgICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICAgICAgICA8L2E+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+Il19
|
|
@@ -13,12 +13,12 @@ export class GetStartedCTAComponent {
|
|
|
13
13
|
this._Router.navigate([route]);
|
|
14
14
|
}
|
|
15
15
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GetStartedCTAComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GetStartedCTAComponent, selector: "get-started-cta", inputs: { ctaCardData: "ctaCardData" }, ngImport: i0, template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
|
|
16
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GetStartedCTAComponent, selector: "get-started-cta", inputs: { ctaCardData: "ctaCardData" }, ngImport: i0, template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button type=\"submit\" color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
|
|
17
17
|
}
|
|
18
18
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GetStartedCTAComponent, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
|
-
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"] }]
|
|
20
|
+
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button type=\"submit\" color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"] }]
|
|
21
21
|
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { ctaCardData: [{
|
|
22
22
|
type: Input
|
|
23
23
|
}] } });
|
|
24
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
24
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ2V0LXN0YXJ0ZWQtY3RhLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9nZXQtc3RhcnRlZC1jdGEvZ2V0LXN0YXJ0ZWQtY3RhLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9nZXQtc3RhcnRlZC1jdGEvZ2V0LXN0YXJ0ZWQtY3RhLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7O0FBUXpELE1BQU0sT0FBTyxzQkFBc0I7SUFJYjtJQUhYLFdBQVcsQ0FBZ0I7SUFFcEMsUUFBUSxLQUFLLENBQUM7SUFDZCxZQUFvQixPQUFlO1FBQWYsWUFBTyxHQUFQLE9BQU8sQ0FBUTtJQUFJLENBQUM7SUFFeEMsV0FBVyxDQUFDLEtBQUs7UUFDZixJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUM7SUFDakMsQ0FBQzt3R0FSVSxzQkFBc0I7NEZBQXRCLHNCQUFzQiwrRkNSbkMseTFGQTZDTTs7NEZEckNPLHNCQUFzQjtrQkFMbEMsU0FBUzsrQkFDRSxpQkFBaUI7NkZBS2xCLFdBQVc7c0JBQW5CLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgUm91dGVyIH0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcclxuaW1wb3J0IHsgR2V0U3RhcnRlZEN0YSB9IGZyb20gJy4uL21vZGVscy9nZXQtc3RhcnRlZC1jdGEubW9kZWwnO1xyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2dldC1zdGFydGVkLWN0YScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2dldC1zdGFydGVkLWN0YS5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vZ2V0LXN0YXJ0ZWQtY3RhLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIEdldFN0YXJ0ZWRDVEFDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIGN0YUNhcmREYXRhOiBHZXRTdGFydGVkQ3RhO1xyXG5cclxuICBuZ09uSW5pdCgpIHsgfVxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgX1JvdXRlcjogUm91dGVyKSB7IH1cclxuXHJcbiAgb25DbGlja0xpbmsocm91dGUpIHtcclxuICAgIHRoaXMuX1JvdXRlci5uYXZpZ2F0ZShbcm91dGVdKTtcclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cImFsbFwiPlxyXG4gICAgPGRpdiBjbGFzcz1cImdldC1zdGFydGVkXCI+XHJcbiAgICAgICAgPHN2ZyB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgY2xhc3M9XCJzdmcgc3ZnLTFcIiB2aWV3Qm94PVwiMCAwIDIyOCAyMzRcIiBmaWxsPVwibm9uZVwiPlxyXG4gICAgICAgICAgICA8cGF0aFxyXG4gICAgICAgICAgICAgICAgZD1cIk0wLjAxMDIyIDE1Ni44MDdDMy43ODI0MiA3Mi41NDY3IC0xNi43NjEyIC0wLjAwMDQyOTc5NiA3MC4zMjIgLTAuMDAwNDI5Nzk2QzE1Ny40MDUgLTAuMDAwNDI5Nzk2IDIyOCA3MC43MTE5IDIyOCAxNTcuOTQxQzIyOCAyNDUuMTcgMTgwLjMyMSAyMzMuODg5IDk0LjY5MSAyMzMuMTMzQy0zLjAwNzU0IDIzMi4yNzEgMC4wMTAyMiAyNDQuMDM2IDAuMDEwMjIgMTU2LjgwN1pcIlxyXG4gICAgICAgICAgICAgICAgZmlsbD1cIiMxNTVFRDRcIiAvPlxyXG4gICAgICAgIDwvc3ZnPlxyXG5cclxuICAgICAgICA8c3ZnIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIiBjbGFzcz1cInN2ZyBzdmctMlwiIHZpZXdCb3g9XCIwIDAgMTc3IDExN1wiIGZpbGw9XCJub25lXCI+XHJcbiAgICAgICAgICAgIDxwYXRoXHJcbiAgICAgICAgICAgICAgICBkPVwiTTExMC4zNTcgMTAuNTMzM0MxOTQgLTMwLjM3MzkgMTgyLjQyOCA2MS4yMzk3IDE1OS4xMiA5MC4wMjM2QzEzNS44MTEgMTE4LjgwOCA4Mi42NDA5IDEyNS44NDQgNTMuODU2OSAxMDIuNTM1QzI1LjA3MyA3OS4yMjYgLTE1Ljk1MiA1Mi4zMTc0IDcuMzU2NzYgMjMuNTMzNUMzMC42NjU1IC01LjI1MDQ1IDcwIDI1LjEyNjEgMTEwLjM1NyAxMC41MzMzWlwiIC8+XHJcbiAgICAgICAgPC9zdmc+XHJcblxyXG4gICAgICAgIDxzdmcgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiIHZpZXdCb3g9XCIwIDAgMzEzIDIyOVwiIGZpbGw9XCJub25lXCIgY2xhc3M9XCJzdmcgc3ZnLTNcIj5cclxuICAgICAgICAgICAgPHBhdGhcclxuICAgICAgICAgICAgICAgIGQ9XCJNMjkxLjEyMiAxODYuMDk2QzI0My45NTEgMjg2Ljc0MSAyMzEuOTQ2IDE4My4wNjEgMTQ4LjgzMiAxNDUuMTg0QzY1LjcxODMgMTA3LjMwNyAtMzMuODc2NSAxNjYuOTE2IDEyLjU4NzkgNjQuOTU5NUM1OS4wNTIzIC0zNi45OTczIDE0OS42NDkgMTUuOTg5NyAyMTcuMTA5IDQuNTg0NTVDMzA1LjE5NyAtMTMuNjE2MyAzMzcuNTg2IDg0LjEzOTMgMjkxLjEyMiAxODYuMDk2WlwiIC8+XHJcbiAgICAgICAgPC9zdmc+XHJcblxyXG4gICAgICAgIDxzdmcgeG1sbnM9XCJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Z1wiIGNsYXNzPVwic3ZnIHN2Zy00XCIgdmlld0JveD1cIjAgMCAxMzAgMTg3XCIgZmlsbD1cIm5vbmVcIj5cclxuICAgICAgICAgICAgPHBhdGhcclxuICAgICAgICAgICAgICAgIGQ9XCJNMTI5LjYyNiA2My4xMjI4QzEyOC45ODEgMTEyLjQ1OCAxMzcuMzMzIDE4NyA4Ny43MDY5IDE4N0MzOC4wODA1IDE4NyAwIDExMi4yMTEgMCA2Mi40NzY1QzAgMTIuNzQxNiAzNy42NTA2IC0wLjAwMDQyNzI0NiA4Ny4yNzcgLTAuMDAwNDI3MjQ2QzEzNi45MDMgLTAuMDAwNDI3MjQ2IDEyOS42MjYgMTMuMzg3OSAxMjkuNjI2IDYzLjEyMjhaXCIgLz5cclxuICAgICAgICA8L3N2Zz5cclxuXHJcbiAgICAgICAgPHN2ZyB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgY2xhc3M9XCJzdmcgc3ZnLTVcIiB2aWV3Qm94PVwiMCAwIDE3MyAxMzFcIiBmaWxsPVwibm9uZVwiPlxyXG4gICAgICAgICAgICA8cGF0aFxyXG4gICAgICAgICAgICAgICAgZD1cIk05OC43MDIxIDIxLjUyODVDMTY3LjUwOCAtNDEuMjAzMiAxODIuMTA1IDQ5Ljk3NzMgMTY3LjgwOCA4NC4xNDQ4QzE1My41MTIgMTE4LjMxMiAxMDQuNDUxIDEzOS45ODQgNzAuMjgzOCAxMjUuNjg3QzM2LjExNjMgMTExLjM5IC0xMC44MTA2IDk3LjA3MjggMy40ODYwMiA2Mi45MDUzQzE3Ljc4MjcgMjguNzM3OCA2NC4wNiA0Ni44NTgyIDk4LjcwMjEgMjEuNTI4NVpcIiAvPlxyXG4gICAgICAgIDwvc3ZnPlxyXG5cclxuXHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIj5cclxuICAgICAgICAgICAgPGgxPnt7Y3RhQ2FyZERhdGEudGl0bGV9fTwvaDE+XHJcbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJkZXNjcmlwdGlvblwiPlxyXG4gICAgICAgICAgICAgICAge3tjdGFDYXJkRGF0YS5kZXNjcmlwdGlvbn19XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICA8YSBbcm91dGVyTGlua109XCJjdGFDYXJkRGF0YS5sb2dvLnJvdXRlXCIgY2xhc3M9XCJjdXN0b20tYW5jaG9yIGltYWdlXCI+XHJcbiAgICAgICAgICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJjdGFDYXJkRGF0YS5sb2dvLnBhdGhcIiBhbHQ9XCJcIiBjbGFzcz1cImxvZ28taW1nXCI+XHJcbiAgICAgICAgICAgIDwvYT5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImNyZWF0ZS1hY2NvdW50XCI+XHJcbiAgICAgICAgICAgICAgICA8aW5wdXQgdHlwZT1cImVtYWlsXCIgY2xhc3M9XCJlbWFpbC1pbnB1dFwiIHBsYWNlaG9sZGVyPVwiRW1haWwgQWRkcmVzc1wiPlxyXG4gICAgICAgICAgICAgICAgPGEgW3JvdXRlckxpbmtdPVwiY3RhQ2FyZERhdGEuY2FsbFRvQWN0aW9uQnV0dG9uLnJvdXRlXCIgY2xhc3M9XCJjdXN0b20tYW5jaG9yXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgPGJ1dHRvbiBtYXQtcmFpc2VkLWJ1dHRvbiB0eXBlPVwic3VibWl0XCIgY29sb3I9XCJwcmltYXJ5XCI+e3tjdGFDYXJkRGF0YS5jYWxsVG9BY3Rpb25CdXR0b24ubGFiZWx9fTwvYnV0dG9uPlxyXG4gICAgICAgICAgICAgICAgPC9hPlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG48L2Rpdj4iXX0=
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
|
-
import * as i1 from "@
|
|
4
|
-
import * as i2 from "@angular/
|
|
5
|
-
import * as i3 from "@angular/material/
|
|
3
|
+
import * as i1 from "@angular/common";
|
|
4
|
+
import * as i2 from "@angular/material/card";
|
|
5
|
+
import * as i3 from "@angular/material/icon";
|
|
6
6
|
export class VerticalSideTabsComponent {
|
|
7
7
|
panelOpenState = false;
|
|
8
8
|
tabs;
|
|
@@ -20,14 +20,14 @@ export class VerticalSideTabsComponent {
|
|
|
20
20
|
this.tabChanged.emit(this.tabs[index].tabContent);
|
|
21
21
|
}
|
|
22
22
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerticalSideTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
23
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerticalSideTabsComponent, selector: "vertical-side-tabs", inputs: { tabs: "tabs" }, outputs: { tabChanged: "tabChanged" }, ngImport: i0, template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><
|
|
23
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerticalSideTabsComponent, selector: "vertical-side-tabs", inputs: { tabs: "tabs" }, outputs: { tabChanged: "tabChanged" }, ngImport: i0, template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><mat-icon>{{tab.iconName}}</mat-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem;font-family:inherit}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon mat-icon{width:.5rem;height:.5rem;font-size:.5rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align:center}}\n"], dependencies: [{ kind: "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.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
24
24
|
}
|
|
25
25
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerticalSideTabsComponent, decorators: [{
|
|
26
26
|
type: Component,
|
|
27
|
-
args: [{ selector: 'vertical-side-tabs', template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><
|
|
27
|
+
args: [{ selector: 'vertical-side-tabs', template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><mat-icon>{{tab.iconName}}</mat-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem;font-family:inherit}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon mat-icon{width:.5rem;height:.5rem;font-size:.5rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align:center}}\n"] }]
|
|
28
28
|
}], ctorParameters: function () { return []; }, propDecorators: { tabs: [{
|
|
29
29
|
type: Input
|
|
30
30
|
}], tabChanged: [{
|
|
31
31
|
type: Output
|
|
32
32
|
}] } });
|
|
33
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
33
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmVydGljYWwtc2lkZS10YWJzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92ZXJ0aWNhbC1zaWRlLXRhYnMvdmVydGljYWwtc2lkZS10YWJzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92ZXJ0aWNhbC1zaWRlLXRhYnMvdmVydGljYWwtc2lkZS10YWJzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7O0FBTy9FLE1BQU0sT0FBTyx5QkFBeUI7SUFDN0IsY0FBYyxHQUFZLEtBQUssQ0FBQztJQUM5QixJQUFJLENBQW9CO0lBQ2pDLGNBQWMsR0FBYyxFQUFFLENBQUM7SUFDckIsVUFBVSxHQUFzQixJQUFJLFlBQVksRUFBRSxDQUFDO0lBRTdELGdCQUFnQixDQUFDO0lBRWpCLFFBQVE7UUFDTixJQUFJLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDO0lBQ3BCLENBQUM7SUFFRCxTQUFTLENBQUMsS0FBYTtRQUNyQixLQUFLLElBQUksQ0FBQyxHQUFHLENBQUMsRUFBRSxDQUFDLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQyxFQUFFLEVBQUU7WUFDekMsSUFBSSxDQUFDLGNBQWMsQ0FBRSxDQUFDLENBQUUsR0FBRyxLQUFLLENBQUM7U0FDbEM7UUFFRCxJQUFJLENBQUMsY0FBYyxDQUFFLEtBQUssQ0FBRSxHQUFHLElBQUksQ0FBQztRQUNwQyxJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFFLEtBQUssQ0FBRSxDQUFDLFVBQVUsQ0FBQyxDQUFDO0lBQ3RELENBQUM7d0dBbkJVLHlCQUF5Qjs0RkFBekIseUJBQXlCLDJIQ1B0QyxvakJBWVc7OzRGRExFLHlCQUF5QjtrQkFMckMsU0FBUzsrQkFDRSxvQkFBb0I7MEVBTXJCLElBQUk7c0JBQVosS0FBSztnQkFFSSxVQUFVO3NCQUFuQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBWZXJ0aWNhbFNpZGVUYWIgfSBmcm9tICcuLi9tb2RlbHMvdmVydGljYWwtc2lkZS10YWIubW9kZWwnO1xyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3ZlcnRpY2FsLXNpZGUtdGFicycsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3ZlcnRpY2FsLXNpZGUtdGFicy5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbICcuL3ZlcnRpY2FsLXNpZGUtdGFicy5jb21wb25lbnQuc2NzcycgXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgVmVydGljYWxTaWRlVGFic0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgcHVibGljIHBhbmVsT3BlblN0YXRlOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCkgdGFiczogVmVydGljYWxTaWRlVGFiW107XHJcbiAgc2VsZWN0ZWRPcHRpb246IGJvb2xlYW5bXSA9IFtdO1xyXG4gIEBPdXRwdXQoKSB0YWJDaGFuZ2VkOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcclxuXHJcbiAgY29uc3RydWN0b3IoKSB7IH1cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICB0aGlzLmNoYW5nZVRhYigwKTtcclxuICB9XHJcblxyXG4gIGNoYW5nZVRhYihpbmRleDogbnVtYmVyKSB7XHJcbiAgICBmb3IgKGxldCBpID0gMDsgaSA8IHRoaXMudGFicy5sZW5ndGg7IGkrKykge1xyXG4gICAgICB0aGlzLnNlbGVjdGVkT3B0aW9uWyBpIF0gPSBmYWxzZTtcclxuICAgIH1cclxuXHJcbiAgICB0aGlzLnNlbGVjdGVkT3B0aW9uWyBpbmRleCBdID0gdHJ1ZTtcclxuICAgIHRoaXMudGFiQ2hhbmdlZC5lbWl0KHRoaXMudGFic1sgaW5kZXggXS50YWJDb250ZW50KTtcclxuICB9XHJcbn1cclxuIiwiPG1hdC1jYXJkIGNsYXNzPVwiYXMtaXRlbXNcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJhcy1pdGVtXCIgKm5nRm9yPVwibGV0IHRhYiBvZiB0YWJzIDsgbGV0IGkgPSBpbmRleFwiPlxyXG4gICAgICAgIDxidXR0b24gY2xhc3M9XCJhcy1idG5cIiBbbmdDbGFzc109XCJ7J2l0ZW0tY2xpY2tlZCc6c2VsZWN0ZWRPcHRpb25baV0sIFxyXG4gICAgICAgICdpdGVtLW5vdC1jbGlja2VkJzohc2VsZWN0ZWRPcHRpb25baV19XCIgKGNsaWNrKT1cImNoYW5nZVRhYihpKVwiPlxyXG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaWNvbi10ZXh0XCI+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaWNvblwiPjxtYXQtaWNvbj57e3RhYi5pY29uTmFtZX19PC9tYXQtaWNvbj48L2Rpdj5cclxuICAgICAgICAgICAgICAgIDxoMyBjbGFzcz1cInRleHRcIj5cclxuICAgICAgICAgICAgICAgICAgICB7e3RhYi50aXRsZX19XHJcbiAgICAgICAgICAgICAgICA8L2gzPlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8L2J1dHRvbj5cclxuICAgIDwvZGl2PlxyXG48L21hdC1jYXJkPiJdfQ==
|
|
@@ -96,11 +96,11 @@ class GetStartedCTAComponent {
|
|
|
96
96
|
this._Router.navigate([route]);
|
|
97
97
|
}
|
|
98
98
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GetStartedCTAComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
99
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GetStartedCTAComponent, selector: "get-started-cta", inputs: { ctaCardData: "ctaCardData" }, ngImport: i0, template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"], dependencies: [{ kind: "component", type: i3$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
|
|
99
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GetStartedCTAComponent, selector: "get-started-cta", inputs: { ctaCardData: "ctaCardData" }, ngImport: i0, template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button type=\"submit\" color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"], dependencies: [{ kind: "component", type: i3$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] });
|
|
100
100
|
}
|
|
101
101
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GetStartedCTAComponent, decorators: [{
|
|
102
102
|
type: Component,
|
|
103
|
-
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"] }]
|
|
103
|
+
args: [{ selector: 'get-started-cta', template: "<div class=\"all\">\r\n <div class=\"get-started\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-1\" viewBox=\"0 0 228 234\" fill=\"none\">\r\n <path\r\n d=\"M0.01022 156.807C3.78242 72.5467 -16.7612 -0.000429796 70.322 -0.000429796C157.405 -0.000429796 228 70.7119 228 157.941C228 245.17 180.321 233.889 94.691 233.133C-3.00754 232.271 0.01022 244.036 0.01022 156.807Z\"\r\n fill=\"#155ED4\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-2\" viewBox=\"0 0 177 117\" fill=\"none\">\r\n <path\r\n d=\"M110.357 10.5333C194 -30.3739 182.428 61.2397 159.12 90.0236C135.811 118.808 82.6409 125.844 53.8569 102.535C25.073 79.226 -15.952 52.3174 7.35676 23.5335C30.6655 -5.25045 70 25.1261 110.357 10.5333Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 313 229\" fill=\"none\" class=\"svg svg-3\">\r\n <path\r\n d=\"M291.122 186.096C243.951 286.741 231.946 183.061 148.832 145.184C65.7183 107.307 -33.8765 166.916 12.5879 64.9595C59.0523 -36.9973 149.649 15.9897 217.109 4.58455C305.197 -13.6163 337.586 84.1393 291.122 186.096Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-4\" viewBox=\"0 0 130 187\" fill=\"none\">\r\n <path\r\n d=\"M129.626 63.1228C128.981 112.458 137.333 187 87.7069 187C38.0805 187 0 112.211 0 62.4765C0 12.7416 37.6506 -0.000427246 87.277 -0.000427246C136.903 -0.000427246 129.626 13.3879 129.626 63.1228Z\" />\r\n </svg>\r\n\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" class=\"svg svg-5\" viewBox=\"0 0 173 131\" fill=\"none\">\r\n <path\r\n d=\"M98.7021 21.5285C167.508 -41.2032 182.105 49.9773 167.808 84.1448C153.512 118.312 104.451 139.984 70.2838 125.687C36.1163 111.39 -10.8106 97.0728 3.48602 62.9053C17.7827 28.7378 64.06 46.8582 98.7021 21.5285Z\" />\r\n </svg>\r\n\r\n\r\n <div class=\"content\">\r\n <h1>{{ctaCardData.title}}</h1>\r\n <div class=\"description\">\r\n {{ctaCardData.description}}\r\n </div>\r\n <a [routerLink]=\"ctaCardData.logo.route\" class=\"custom-anchor image\">\r\n <img loading=\"lazy\" [src]=\"ctaCardData.logo.path\" alt=\"\" class=\"logo-img\">\r\n </a>\r\n <div class=\"create-account\">\r\n <input type=\"email\" class=\"email-input\" placeholder=\"Email Address\">\r\n <a [routerLink]=\"ctaCardData.callToActionButton.route\" class=\"custom-anchor\">\r\n <button mat-raised-button type=\"submit\" color=\"primary\">{{ctaCardData.callToActionButton.label}}</button>\r\n </a>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.all{margin-top:3rem;display:flex;align-items:center}.get-started{position:relative;text-align:center;color:#fff;display:grid;padding:3rem 0rem;border-radius:1.5rem;margin:auto;background-color:#32353b;box-shadow:2rem 2rem 3.4rem #00000040;z-index:2;width:90%}@media only screen and (min-width: 1500px){.get-started{width:150rem}}.get-started path{fill:#155ed4}.get-started .svg{position:absolute;z-index:-1;width:20%;height:11rem}.get-started .svg-1{flex-shrink:0;fill:#155ed4;bottom:1rem;left:0%}.get-started .svg-2{left:10%;width:9em;height:11rem}.get-started .svg-3{top:4rem;right:30%}.get-started .svg-4{top:2rem;right:0}.get-started .svg-5{bottom:1rem;right:0}.get-started .content{display:grid;row-gap:1rem}.get-started .content .title{font-size:4rem}.get-started .content .description{width:60%;margin:auto}@media only screen and (max-width: 75em){.get-started .content .description{width:80%}}.get-started .sign-up{text-decoration:underline;font-weight:500;cursor:pointer}.get-started .image{width:20rem;margin:auto}.get-started .image .logo-img{width:100%}.get-started .create-account{display:flex;justify-content:center;align-items:center;width:50%;margin:auto;gap:2rem}@media only screen and (max-width: 75em){.get-started .create-account{width:70%}}@media only screen and (max-width: 56.25em){.get-started .create-account{height:auto;row-gap:1rem;flex-wrap:wrap;width:100%;flex-direction:column}}@media only screen and (max-width: 37.5em){.get-started .svg-3{display:none}}\n"] }]
|
|
104
104
|
}], ctorParameters: function () { return [{ type: i1$1.Router }]; }, propDecorators: { ctaCardData: [{
|
|
105
105
|
type: Input
|
|
106
106
|
}] } });
|
|
@@ -928,19 +928,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
928
928
|
}] } });
|
|
929
929
|
|
|
930
930
|
class CtaSectionStyleThreeComponent {
|
|
931
|
-
_router;
|
|
932
931
|
sectionContent;
|
|
933
|
-
constructor(
|
|
934
|
-
this._router = _router;
|
|
932
|
+
constructor() {
|
|
935
933
|
}
|
|
936
934
|
ngOnInit() { }
|
|
937
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CtaSectionStyleThreeComponent, deps: [
|
|
935
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CtaSectionStyleThreeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
938
936
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CtaSectionStyleThreeComponent, selector: "cta-section-style-three", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img loading=\"lazy\" *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\"\r\n class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && !sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"text-side\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"buttons-line\">\r\n <a *ngFor=\"let button of sectionContent.buttons\" [routerLink]=\"button.route\" class=\"custom-anchor\">\r\n <button mat-raised-button [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\r\n {{button.label}}\r\n </button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:2rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}@media only screen and (max-width: 75em){.main-card .text-side .section-title{width:85%}}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle", "withoutTitleCase", "descriptionWidth"] }] });
|
|
939
937
|
}
|
|
940
938
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CtaSectionStyleThreeComponent, decorators: [{
|
|
941
939
|
type: Component,
|
|
942
940
|
args: [{ selector: 'cta-section-style-three', template: "<div class=\"main-card\" [ngStyle]=\"{'background' : sectionContent.bgColor}\">\r\n <img loading=\"lazy\" *ngIf=\"!sectionContent.bgColor && sectionContent.bgImage \" [src]=\"sectionContent.bgImage\"\r\n class=\"bg-img\" alt=\"bg-img\">\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && !sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"text-side\">\r\n <div class=\"section-title\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"illustration-side\" *ngIf=\"sectionContent.sideImage && sectionContent.titleImageOrder\">\r\n <img loading=\"lazy\" [src]=\"sectionContent.sideImage\" class=\"side-img\" alt=\"side-img\">\r\n </div>\r\n <div class=\"buttons-line\">\r\n <a *ngFor=\"let button of sectionContent.buttons\" [routerLink]=\"button.route\" class=\"custom-anchor\">\r\n <button mat-raised-button [ngStyle]=\"{'background':button.bgColor, 'color': button.textColor}\">\r\n {{button.label}}\r\n </button>\r\n </a>\r\n </div>\r\n </div>\r\n</div>", styles: [".main-card{position:relative;width:100%;display:flex;flex-direction:column;row-gap:2rem;column-gap:2%;justify-content:center;padding:2rem 0;border-radius:1.5rem}.main-card .bg-img{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;object-fit:cover;border-radius:1.5rem}.main-card .text-side{display:flex;flex-direction:column;row-gap:2rem;width:100%;justify-items:center}.main-card .text-side .section-title{width:60%;margin:auto}.main-card .text-side .buttons-line{width:100%;display:flex;flex-direction:row;column-gap:2%;justify-content:center}.main-card .text-side .buttons-line button{font-family:inherit;font-weight:600}@media only screen and (max-width: 75em){.main-card .text-side .section-title{width:85%}}.main-card .illustration-side{margin:auto;width:40%;display:grid;justify-items:center}.main-card .illustration-side .side-img{width:30%}\n"] }]
|
|
943
|
-
}], ctorParameters: function () { return [
|
|
941
|
+
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
944
942
|
type: Input
|
|
945
943
|
}] } });
|
|
946
944
|
|
|
@@ -961,11 +959,11 @@ class VerticalSideTabsComponent {
|
|
|
961
959
|
this.tabChanged.emit(this.tabs[index].tabContent);
|
|
962
960
|
}
|
|
963
961
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerticalSideTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
964
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerticalSideTabsComponent, selector: "vertical-side-tabs", inputs: { tabs: "tabs" }, outputs: { tabChanged: "tabChanged" }, ngImport: i0, template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><
|
|
962
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerticalSideTabsComponent, selector: "vertical-side-tabs", inputs: { tabs: "tabs" }, outputs: { tabChanged: "tabChanged" }, ngImport: i0, template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><mat-icon>{{tab.iconName}}</mat-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem;font-family:inherit}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon mat-icon{width:.5rem;height:.5rem;font-size:.5rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align:center}}\n"], dependencies: [{ kind: "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$4.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i1$5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
|
|
965
963
|
}
|
|
966
964
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerticalSideTabsComponent, decorators: [{
|
|
967
965
|
type: Component,
|
|
968
|
-
args: [{ selector: 'vertical-side-tabs', template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><
|
|
966
|
+
args: [{ selector: 'vertical-side-tabs', template: "<mat-card class=\"as-items\">\r\n <div class=\"as-item\" *ngFor=\"let tab of tabs ; let i = index\">\r\n <button class=\"as-btn\" [ngClass]=\"{'item-clicked':selectedOption[i], \r\n 'item-not-clicked':!selectedOption[i]}\" (click)=\"changeTab(i)\">\r\n <div class=\"icon-text\">\r\n <div class=\"icon\"><mat-icon>{{tab.iconName}}</mat-icon></div>\r\n <h3 class=\"text\">\r\n {{tab.title}}\r\n </h3>\r\n </div>\r\n </button>\r\n </div>\r\n</mat-card>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.as-items{padding:2rem 1rem;border:.1rem solid #f7f8f9;border-radius:1rem;display:flex;flex-direction:column;height:100%}.as-items .as-btn{border:none;border-left:.3rem solid rgba(50,53,59,.6);margin:auto;width:100%;text-align:left;display:inline;padding:2rem 4%;transition:all ease-in-out .1s;cursor:pointer}.as-items .as-btn:hover{border-left:.3rem solid #32353B;color:#32353b}.as-items .icon-text{display:flex;align-items:center;padding:0 .5rem;font-family:inherit}.as-items .icon-text .icon{display:inline-block;vertical-align:middle;margin-right:2rem}.as-items .icon-text .icon mat-icon{width:.5rem;height:.5rem;font-size:.5rem}.as-items .item-not-clicked{color:#32353b99;background-color:#fff}.as-items .item-clicked{background-color:#fff;border-left:.3rem solid #155ED4;color:#155ed4}.as-items .item-clicked:hover{border-left:.3rem solid #155ED4;color:#155ed4}@media only screen and (max-width: 56.25em){.as-items{flex-direction:row;width:100%}.as-items .as-btn{border:none;border-bottom:.3rem solid rgba(50,53,59,.6)}.as-items .as-btn:hover{border-left:none;border-bottom:.3rem solid #32353B;color:#32353b}.as-items .item-clicked{border-bottom:.3rem solid #155ED4}.as-items .item-clicked:hover{border-left:none;border-bottom:.3rem solid #155ED4;color:#155ed4}.as-items .as-item{flex-grow:1;width:auto}.as-items .icon-text{flex-direction:column;text-align:center}}\n"] }]
|
|
969
967
|
}], ctorParameters: function () { return []; }, propDecorators: { tabs: [{
|
|
970
968
|
type: Input
|
|
971
969
|
}], tabChanged: [{
|