@jooler/jooler-websites-shared 0.0.210 → 0.0.212
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 → esm2022}/jooler-websites-shared.mjs +4 -4
- package/esm2022/lib/achievements/achievements.component.mjs +18 -0
- package/esm2022/lib/auth-route-directive.mjs +42 -0
- package/esm2022/lib/call-to-action-section/call-to-action-section.component.mjs +28 -0
- package/esm2022/lib/call-to-action-section-two/call-to-action-section-two.component.mjs +25 -0
- package/esm2022/lib/choose-country-with-flag/choose-country-with-flag.component.mjs +56 -0
- package/esm2022/lib/coming-soon/coming-soon.component.mjs +20 -0
- package/esm2022/lib/contact-us-page/contact-us-page.component.mjs +144 -0
- package/esm2022/lib/cta-section-style-four/cta-section-style-four.component.mjs +34 -0
- package/esm2022/lib/cta-section-style-three/cta-section-style-three.component.mjs +27 -0
- package/esm2022/lib/custom-tooltip/custom-tooltip.component.mjs +23 -0
- package/esm2022/lib/faq-category-listing/faq-category-listing.component.mjs +28 -0
- package/esm2022/lib/faq-listing/faq-listing.component.mjs +27 -0
- package/esm2022/lib/get-started-cta/get-started-cta.component.mjs +24 -0
- package/esm2022/lib/header-section-one/header-section-one.component.mjs +25 -0
- package/esm2022/lib/image-gallery-modal/image-gallery-modal.component.mjs +134 -0
- package/esm2022/lib/jooler-websites-shared.module.mjs +214 -0
- package/{esm2020 → esm2022}/lib/models/about-us-section.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/account-type.model.mjs +8 -8
- package/esm2022/lib/models/account.model.mjs +14 -0
- package/{esm2020 → esm2022}/lib/models/achievement.model.mjs +5 -3
- package/esm2022/lib/models/achievements.model.mjs +5 -0
- package/esm2022/lib/models/address.model.mjs +16 -0
- package/{esm2020 → esm2022}/lib/models/brand-logo.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/call-to-action-data.model.mjs +1 -1
- package/esm2022/lib/models/call-to-action-section-two.model.mjs +7 -0
- package/{esm2020 → esm2022}/lib/models/call-to-action-style.model.mjs +1 -1
- package/esm2022/lib/models/city.model.mjs +6 -0
- package/esm2022/lib/models/country.model.mjs +10 -0
- package/{esm2020 → esm2022}/lib/models/cta-cards.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/cta-one-type.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/cta-section-style-four.model.mjs +1 -1
- package/esm2022/lib/models/faq-category-context.enum.mjs +8 -0
- package/esm2022/lib/models/faq-category.model.mjs +9 -0
- package/esm2022/lib/models/faq-page.model.mjs +4 -0
- package/esm2022/lib/models/faq-subcategory.model.mjs +8 -0
- package/esm2022/lib/models/faq.model.mjs +7 -0
- package/{esm2020 → esm2022}/lib/models/feature-section-nine.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/gallery-items-properties.model.mjs +1 -1
- package/esm2022/lib/models/get-started-cta.model.mjs +7 -0
- package/{esm2020 → esm2022}/lib/models/header-section-style-one.model.mjs +1 -1
- package/esm2022/lib/models/image-section-action.model.mjs +8 -0
- package/esm2022/lib/models/image-section.model.mjs +11 -0
- package/{esm2020 → esm2022}/lib/models/image-with-content.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/library-product-type.model.mjs +6 -6
- package/esm2022/lib/models/page-section-action.model.mjs +8 -0
- package/{esm2020 → esm2022}/lib/models/page-section-style-thirteen.model.mjs +5 -5
- package/{esm2020 → esm2022}/lib/models/page-section-style-three.model.mjs +1 -1
- package/esm2022/lib/models/page-section.model.mjs +11 -0
- package/{esm2020 → esm2022}/lib/models/page-style-section-five.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/perks.model.mjs +5 -3
- package/{esm2020 → esm2022}/lib/models/section-title-sizes.model.mjs +6 -6
- package/{esm2020 → esm2022}/lib/models/section-title.model.mjs +1 -1
- package/esm2022/lib/models/service-plan.model.mjs +11 -0
- package/esm2022/lib/models/team-member.model.mjs +7 -0
- package/esm2022/lib/models/team-section.model.mjs +6 -0
- package/{esm2020 → esm2022}/lib/models/user-type.model.mjs +7 -7
- package/esm2022/lib/models/user.model.mjs +11 -0
- package/{esm2020 → esm2022}/lib/models/value-prop-properties.model.mjs +1 -1
- package/{esm2020 → esm2022}/lib/models/vertical-side-tab.model.mjs +1 -1
- package/esm2022/lib/our-client-listing/our-client-listing.component.mjs +18 -0
- package/esm2022/lib/our-clients/our-clients.component.mjs +57 -0
- package/esm2022/lib/page-section-style-ten/page-section-style-ten.component.mjs +35 -0
- package/esm2022/lib/page-section-style-thirteen/page-section-style-thirteen.component.mjs +46 -0
- package/esm2022/lib/page-section-style-three/page-section-style-three.component.mjs +26 -0
- package/esm2022/lib/page-section-with-multiple-cards/page-section-with-multiple-cards.component.mjs +26 -0
- package/esm2022/lib/pricing-plans/pricing-plans.component.mjs +22 -0
- package/esm2022/lib/section-title/section-title.component.mjs +23 -0
- package/esm2022/lib/services/user.service.mjs +36 -0
- package/esm2022/lib/social-media-icons/social-media-icons.component.mjs +44 -0
- package/esm2022/lib/social-media-icons/social-media-links.model.mjs +7 -0
- package/esm2022/lib/success-message-dialog/success-message-dialog.component.mjs +24 -0
- package/esm2022/lib/team/team.component.mjs +57 -0
- package/esm2022/lib/value-prop-card/value-prop-card.component.mjs +25 -0
- package/esm2022/lib/value-props-section/value-props-section.component.mjs +35 -0
- package/esm2022/lib/values/values.component.mjs +48 -0
- package/esm2022/lib/vertical-side-tabs/vertical-side-tabs.component.mjs +33 -0
- package/esm2022/public-api.mjs +71 -0
- package/fesm2022/jooler-websites-shared.mjs +1463 -0
- package/fesm2022/jooler-websites-shared.mjs.map +1 -0
- package/index.d.ts +5 -5
- package/lib/achievements/achievements.component.d.ts +10 -10
- package/lib/auth-route-directive.d.ts +14 -14
- package/lib/call-to-action-section/call-to-action-section.component.d.ts +11 -11
- package/lib/call-to-action-section-two/call-to-action-section-two.component.d.ts +13 -13
- package/lib/choose-country-with-flag/choose-country-with-flag.component.d.ts +19 -19
- package/lib/coming-soon/coming-soon.component.d.ts +8 -8
- package/lib/contact-us-page/contact-us-page.component.d.ts +50 -50
- package/lib/cta-section-style-four/cta-section-style-four.component.d.ts +12 -12
- package/lib/cta-section-style-three/cta-section-style-three.component.d.ts +13 -13
- package/lib/custom-tooltip/custom-tooltip.component.d.ts +9 -9
- package/lib/faq-category-listing/faq-category-listing.component.d.ts +14 -14
- package/lib/faq-listing/faq-listing.component.d.ts +13 -13
- package/lib/get-started-cta/get-started-cta.component.d.ts +13 -13
- package/lib/header-section-one/header-section-one.component.d.ts +11 -11
- package/lib/image-gallery-modal/image-gallery-modal.component.d.ts +27 -27
- package/lib/jooler-websites-shared.module.d.ts +45 -45
- package/lib/models/about-us-section.model.d.ts +6 -6
- package/lib/models/account-type.model.d.ts +7 -7
- package/lib/models/account.model.d.ts +16 -16
- package/lib/models/achievement.model.d.ts +4 -4
- package/lib/models/achievements.model.d.ts +6 -6
- package/lib/models/address.model.d.ts +18 -18
- package/lib/models/brand-logo.model.d.ts +4 -4
- package/lib/models/call-to-action-data.model.d.ts +17 -17
- package/lib/models/call-to-action-section-two.model.d.ts +6 -6
- package/lib/models/call-to-action-style.model.d.ts +16 -16
- package/lib/models/city.model.d.ts +5 -5
- package/lib/models/country.model.d.ts +9 -9
- package/lib/models/cta-cards.model.d.ts +7 -7
- package/lib/models/cta-one-type.model.d.ts +15 -15
- package/lib/models/cta-section-style-four.model.d.ts +8 -8
- package/lib/models/faq-category-context.enum.d.ts +6 -0
- package/lib/models/faq-category.model.d.ts +9 -9
- package/lib/models/faq-page.model.d.ts +4 -0
- package/lib/models/faq-subcategory.model.d.ts +8 -8
- package/lib/models/faq.model.d.ts +7 -7
- package/lib/models/feature-section-nine.model.d.ts +6 -6
- package/lib/models/gallery-items-properties.model.d.ts +6 -6
- package/lib/models/get-started-cta.model.d.ts +8 -8
- package/lib/models/header-section-style-one.model.d.ts +16 -16
- package/lib/models/image-section-action.model.d.ts +8 -8
- package/lib/models/image-section.model.d.ts +12 -12
- package/lib/models/image-with-content.model.d.ts +5 -5
- package/lib/models/library-product-type.model.d.ts +5 -5
- package/lib/models/page-section-action.model.d.ts +8 -8
- package/lib/models/page-section-style-thirteen.model.d.ts +4 -4
- package/lib/models/page-section-style-three.model.d.ts +8 -8
- package/lib/models/page-section.model.d.ts +11 -11
- package/lib/models/page-style-section-five.model.d.ts +11 -11
- package/lib/models/perks.model.d.ts +4 -4
- package/lib/models/section-title-sizes.model.d.ts +5 -5
- package/lib/models/section-title.model.d.ts +9 -9
- package/lib/models/service-plan.model.d.ts +12 -12
- package/lib/models/team-member.model.d.ts +6 -6
- package/lib/models/team-section.model.d.ts +7 -7
- package/lib/models/user-type.model.d.ts +6 -6
- package/lib/models/user.model.d.ts +11 -11
- package/lib/models/value-prop-properties.model.d.ts +11 -11
- package/lib/models/vertical-side-tab.model.d.ts +6 -6
- package/lib/our-client-listing/our-client-listing.component.d.ts +10 -10
- package/lib/our-clients/our-clients.component.d.ts +15 -15
- package/lib/page-section-style-ten/page-section-style-ten.component.d.ts +15 -15
- package/lib/page-section-style-thirteen/page-section-style-thirteen.component.d.ts +21 -21
- package/lib/page-section-style-three/page-section-style-three.component.d.ts +13 -13
- package/lib/page-section-with-multiple-cards/page-section-with-multiple-cards.component.d.ts +12 -12
- package/lib/pricing-plans/pricing-plans.component.d.ts +10 -10
- package/lib/section-title/section-title.component.d.ts +11 -11
- package/lib/services/user.service.d.ts +15 -15
- package/lib/social-media-icons/social-media-icons.component.d.ts +20 -20
- package/lib/social-media-icons/social-media-links.model.d.ts +6 -6
- package/lib/success-message-dialog/success-message-dialog.component.d.ts +11 -11
- package/lib/team/team.component.d.ts +18 -18
- package/lib/value-prop-card/value-prop-card.component.d.ts +12 -12
- package/lib/value-props-section/value-props-section.component.d.ts +11 -11
- package/lib/values/values.component.d.ts +16 -16
- package/lib/vertical-side-tabs/vertical-side-tabs.component.d.ts +14 -14
- package/package.json +5 -11
- package/public-api.d.ts +67 -61
- package/esm2020/lib/achievements/achievements.component.mjs +0 -17
- package/esm2020/lib/auth-route-directive.mjs +0 -37
- package/esm2020/lib/call-to-action-section/call-to-action-section.component.mjs +0 -28
- package/esm2020/lib/call-to-action-section-two/call-to-action-section-two.component.mjs +0 -23
- package/esm2020/lib/choose-country-with-flag/choose-country-with-flag.component.mjs +0 -55
- package/esm2020/lib/coming-soon/coming-soon.component.mjs +0 -22
- package/esm2020/lib/contact-us-page/contact-us-page.component.mjs +0 -129
- package/esm2020/lib/cta-section-style-four/cta-section-style-four.component.mjs +0 -32
- package/esm2020/lib/cta-section-style-three/cta-section-style-three.component.mjs +0 -25
- package/esm2020/lib/custom-tooltip/custom-tooltip.component.mjs +0 -22
- package/esm2020/lib/faq-category-listing/faq-category-listing.component.mjs +0 -25
- package/esm2020/lib/faq-listing/faq-listing.component.mjs +0 -25
- package/esm2020/lib/get-started-cta/get-started-cta.component.mjs +0 -22
- package/esm2020/lib/header-section-one/header-section-one.component.mjs +0 -23
- package/esm2020/lib/image-gallery-modal/image-gallery-modal.component.mjs +0 -132
- package/esm2020/lib/jooler-websites-shared.module.mjs +0 -210
- package/esm2020/lib/models/account.model.mjs +0 -3
- package/esm2020/lib/models/achievements.model.mjs +0 -3
- package/esm2020/lib/models/address.model.mjs +0 -3
- package/esm2020/lib/models/call-to-action-section-two.model.mjs +0 -3
- package/esm2020/lib/models/city.model.mjs +0 -3
- package/esm2020/lib/models/country.model.mjs +0 -3
- package/esm2020/lib/models/faq-category.model.mjs +0 -3
- package/esm2020/lib/models/faq-subcategory.model.mjs +0 -3
- package/esm2020/lib/models/faq.model.mjs +0 -3
- package/esm2020/lib/models/get-started-cta.model.mjs +0 -3
- package/esm2020/lib/models/image-section-action.model.mjs +0 -3
- package/esm2020/lib/models/image-section.model.mjs +0 -3
- package/esm2020/lib/models/page-section-action.model.mjs +0 -3
- package/esm2020/lib/models/page-section.model.mjs +0 -3
- package/esm2020/lib/models/service-plan.model.mjs +0 -3
- package/esm2020/lib/models/team-member.model.mjs +0 -3
- package/esm2020/lib/models/team-section.model.mjs +0 -3
- package/esm2020/lib/models/user.model.mjs +0 -3
- package/esm2020/lib/our-client-listing/our-client-listing.component.mjs +0 -17
- package/esm2020/lib/our-clients/our-clients.component.mjs +0 -54
- package/esm2020/lib/page-section-style-ten/page-section-style-ten.component.mjs +0 -33
- package/esm2020/lib/page-section-style-thirteen/page-section-style-thirteen.component.mjs +0 -43
- package/esm2020/lib/page-section-style-three/page-section-style-three.component.mjs +0 -24
- package/esm2020/lib/page-section-with-multiple-cards/page-section-with-multiple-cards.component.mjs +0 -24
- package/esm2020/lib/pricing-plans/pricing-plans.component.mjs +0 -21
- package/esm2020/lib/section-title/section-title.component.mjs +0 -22
- package/esm2020/lib/services/user.service.mjs +0 -35
- package/esm2020/lib/social-media-icons/social-media-icons.component.mjs +0 -40
- package/esm2020/lib/social-media-icons/social-media-links.model.mjs +0 -3
- package/esm2020/lib/success-message-dialog/success-message-dialog.component.mjs +0 -22
- package/esm2020/lib/team/team.component.mjs +0 -52
- package/esm2020/lib/value-prop-card/value-prop-card.component.mjs +0 -22
- package/esm2020/lib/value-props-section/value-props-section.component.mjs +0 -33
- package/esm2020/lib/values/values.component.mjs +0 -43
- package/esm2020/lib/vertical-side-tabs/vertical-side-tabs.component.mjs +0 -33
- package/esm2020/public-api.mjs +0 -65
- package/fesm2015/jooler-websites-shared.mjs +0 -1259
- package/fesm2015/jooler-websites-shared.mjs.map +0 -1
- package/fesm2020/jooler-websites-shared.mjs +0 -1259
- package/fesm2020/jooler-websites-shared.mjs.map +0 -1
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/router";
|
|
4
|
+
import * as i2 from "@angular/common";
|
|
5
|
+
import * as i3 from "@angular/material/button";
|
|
6
|
+
import * as i4 from "../section-title/section-title.component";
|
|
7
|
+
export class PageSectionStyleThreeComponent {
|
|
8
|
+
_Router;
|
|
9
|
+
valueprop;
|
|
10
|
+
constructor(_Router) {
|
|
11
|
+
this._Router = _Router;
|
|
12
|
+
}
|
|
13
|
+
ngOnInit() { }
|
|
14
|
+
onClickValuePropButton(route) {
|
|
15
|
+
this._Router.navigate([route]);
|
|
16
|
+
}
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PageSectionStyleThreeComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PageSectionStyleThreeComponent, selector: "page-section-style-three", inputs: { valueprop: "valueprop" }, ngImport: i0, template: "<div class=\"page\">\r\n <div class=\"section\"\r\n [ngClass]=\"{'image-text-sort' : !valueprop.textImageSort,'text-image-sort':valueprop.textImageSort }\">\r\n <div class=\"section-container\">\r\n <div class=\"image-side\">\r\n <img loading=\"lazy\" [src]=\"valueprop.image\">\r\n </div>\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"valueprop.sectionTitle\">\r\n <ng-content></ng-content>\r\n </section-title>\r\n <div class=\"optional-buttons\" *ngIf=\"valueprop.buttons\">\r\n <button mat-raised-button class=\"value-prop-button\" *ngFor=\"let button of valueprop.buttons\"\r\n (click)=\"onClickValuePropButton(button.route)\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{row-gap:5rem;display:grid;justify-items:center;padding:0rem}.page .image-text-sort .section-container{flex-direction:row}.page .text-image-sort{background-color:#f7f8f9}.page .text-image-sort .section-container{flex-direction:row-reverse}.page .section{margin:0rem;padding:2rem 0;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;column-gap:4%;width:90%}@media only screen and (min-width: 1500px){.page .section{padding:5rem 0%}.page .section .section-container{max-width:150rem}}.page .section .text-side{margin:auto;width:53%;padding:2rem 0rem;text-align:left;display:flex;flex-direction:column;row-gap:2rem}.page .section .text-side .title{font-size:3.2rem;font-weight:600;padding:1rem 0rem}.page .section .text-side .optional-buttons{display:flex;flex-direction:row;column-gap:1.5rem}.page .section .text-side .optional-buttons button{padding:1rem;background-color:#155ed4;color:#fff}.page .section .image-side{border-radius:1.5rem;width:43%;height:35rem;box-shadow:0 .1rem .5rem #00000040}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.page .section .image-side img{border-radius:1.5rem;width:100%;height:100%;object-fit:cover;animation:fadeIn 2.5s}@media only screen and (max-width: 75em){.page{row-gap:2rem}.page .image-text-sort .section-container,.page .text-image-sort .section-container,.page .section .section-container{flex-direction:column}.page .image-text-sort .section-container .image-side,.page .text-image-sort .section-container .image-side,.page .section .section-container .image-side{margin:1rem auto;width:40%}.page .image-text-sort .section-container .image-side img,.page .text-image-sort .section-container .image-side img,.page .section .section-container .image-side img,.page .image-text-sort .section-container .text-side,.page .text-image-sort .section-container .text-side,.page .section .section-container .text-side{width:100%}}@media only screen and (max-width: 56.25em){.page{row-gap:2rem}.page .section .section-container .image-side{margin:1rem auto;width:50%}.page .section .section-container .text-side .optional-buttons{flex-direction:column;row-gap:1rem}}@media only screen and (max-width: 37.5em){.page .section{margin:0;padding:0}.page .section .section-container{width:100%}.page .section .section-container .text-side{padding:0rem 4%}.page .section .section-container .text-side .title{font-size:2.4rem;font-weight:600;padding:1rem 0rem}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none;margin-bottom:2rem}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle", "withoutTitleCase", "descriptionWidth"] }] });
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PageSectionStyleThreeComponent, decorators: [{
|
|
21
|
+
type: Component,
|
|
22
|
+
args: [{ selector: 'page-section-style-three', template: "<div class=\"page\">\r\n <div class=\"section\"\r\n [ngClass]=\"{'image-text-sort' : !valueprop.textImageSort,'text-image-sort':valueprop.textImageSort }\">\r\n <div class=\"section-container\">\r\n <div class=\"image-side\">\r\n <img loading=\"lazy\" [src]=\"valueprop.image\">\r\n </div>\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"valueprop.sectionTitle\">\r\n <ng-content></ng-content>\r\n </section-title>\r\n <div class=\"optional-buttons\" *ngIf=\"valueprop.buttons\">\r\n <button mat-raised-button class=\"value-prop-button\" *ngFor=\"let button of valueprop.buttons\"\r\n (click)=\"onClickValuePropButton(button.route)\">\r\n {{button.label}}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{row-gap:5rem;display:grid;justify-items:center;padding:0rem}.page .image-text-sort .section-container{flex-direction:row}.page .text-image-sort{background-color:#f7f8f9}.page .text-image-sort .section-container{flex-direction:row-reverse}.page .section{margin:0rem;padding:2rem 0;width:100%;display:grid;justify-items:center}.page .section .section-container{display:flex;column-gap:4%;width:90%}@media only screen and (min-width: 1500px){.page .section{padding:5rem 0%}.page .section .section-container{max-width:150rem}}.page .section .text-side{margin:auto;width:53%;padding:2rem 0rem;text-align:left;display:flex;flex-direction:column;row-gap:2rem}.page .section .text-side .title{font-size:3.2rem;font-weight:600;padding:1rem 0rem}.page .section .text-side .optional-buttons{display:flex;flex-direction:row;column-gap:1.5rem}.page .section .text-side .optional-buttons button{padding:1rem;background-color:#155ed4;color:#fff}.page .section .image-side{border-radius:1.5rem;width:43%;height:35rem;box-shadow:0 .1rem .5rem #00000040}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.page .section .image-side img{border-radius:1.5rem;width:100%;height:100%;object-fit:cover;animation:fadeIn 2.5s}@media only screen and (max-width: 75em){.page{row-gap:2rem}.page .image-text-sort .section-container,.page .text-image-sort .section-container,.page .section .section-container{flex-direction:column}.page .image-text-sort .section-container .image-side,.page .text-image-sort .section-container .image-side,.page .section .section-container .image-side{margin:1rem auto;width:40%}.page .image-text-sort .section-container .image-side img,.page .text-image-sort .section-container .image-side img,.page .section .section-container .image-side img,.page .image-text-sort .section-container .text-side,.page .text-image-sort .section-container .text-side,.page .section .section-container .text-side{width:100%}}@media only screen and (max-width: 56.25em){.page{row-gap:2rem}.page .section .section-container .image-side{margin:1rem auto;width:50%}.page .section .section-container .text-side .optional-buttons{flex-direction:column;row-gap:1rem}}@media only screen and (max-width: 37.5em){.page .section{margin:0;padding:0}.page .section .section-container{width:100%}.page .section .section-container .text-side{padding:0rem 4%}.page .section .section-container .text-side .title{font-size:2.4rem;font-weight:600;padding:1rem 0rem}.page .section .section-container .image-side{width:100%;height:40rem;border-radius:0;margin:0;box-shadow:none;margin-bottom:2rem}.page .section .section-container .image-side img{border-radius:0;height:100%;object-fit:cover}}\n"] }]
|
|
23
|
+
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { valueprop: [{
|
|
24
|
+
type: Input
|
|
25
|
+
}] } });
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9wYWdlLXNlY3Rpb24tc3R5bGUtdGhyZWUvcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9wYWdlLXNlY3Rpb24tc3R5bGUtdGhyZWUvcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7Ozs7QUFRekQsTUFBTSxPQUFPLDhCQUE4QjtJQUdyQjtJQUZYLFNBQVMsQ0FBd0I7SUFFMUMsWUFBb0IsT0FBZTtRQUFmLFlBQU8sR0FBUCxPQUFPLENBQVE7SUFBSSxDQUFDO0lBRXhDLFFBQVEsS0FBVSxDQUFDO0lBRW5CLHNCQUFzQixDQUFDLEtBQUs7UUFDMUIsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsQ0FBRSxLQUFLLENBQUUsQ0FBQyxDQUFDO0lBQ25DLENBQUM7d0dBVFUsOEJBQThCOzRGQUE5Qiw4QkFBOEIsb0dDUjNDLDAxQkFvQk07OzRGRFpPLDhCQUE4QjtrQkFMMUMsU0FBUzsrQkFDRSwwQkFBMEI7NkZBSzNCLFNBQVM7c0JBQWpCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgUm91dGVyIH0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcclxuaW1wb3J0IHsgUGFnZVNlY3Rpb25TdHlsZVRocmVlIH0gZnJvbSAnLi4vbW9kZWxzL3BhZ2Utc2VjdGlvbi1zdHlsZS10aHJlZS5tb2RlbCc7XHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAncGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsgJy4vcGFnZS1zZWN0aW9uLXN0eWxlLXRocmVlLmNvbXBvbmVudC5zY3NzJyBdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBQYWdlU2VjdGlvblN0eWxlVGhyZWVDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHZhbHVlcHJvcDogUGFnZVNlY3Rpb25TdHlsZVRocmVlO1xyXG5cclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIF9Sb3V0ZXI6IFJvdXRlcikgeyB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge31cclxuXHJcbiAgb25DbGlja1ZhbHVlUHJvcEJ1dHRvbihyb3V0ZSkge1xyXG4gICAgdGhpcy5fUm91dGVyLm5hdmlnYXRlKFsgcm91dGUgXSk7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJwYWdlXCI+XHJcbiAgPGRpdiBjbGFzcz1cInNlY3Rpb25cIlxyXG4gICAgW25nQ2xhc3NdPVwieydpbWFnZS10ZXh0LXNvcnQnIDogIXZhbHVlcHJvcC50ZXh0SW1hZ2VTb3J0LCd0ZXh0LWltYWdlLXNvcnQnOnZhbHVlcHJvcC50ZXh0SW1hZ2VTb3J0IH1cIj5cclxuICAgIDxkaXYgY2xhc3M9XCJzZWN0aW9uLWNvbnRhaW5lclwiPlxyXG4gICAgICA8ZGl2IGNsYXNzPVwiaW1hZ2Utc2lkZVwiPlxyXG4gICAgICAgIDxpbWcgbG9hZGluZz1cImxhenlcIiBbc3JjXT1cInZhbHVlcHJvcC5pbWFnZVwiPlxyXG4gICAgICA8L2Rpdj5cclxuICAgICAgPGRpdiBjbGFzcz1cInRleHQtc2lkZVwiPlxyXG4gICAgICAgIDxzZWN0aW9uLXRpdGxlIFtzZWN0aW9uVGl0bGVdPVwidmFsdWVwcm9wLnNlY3Rpb25UaXRsZVwiPlxyXG4gICAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4gICAgICAgIDwvc2VjdGlvbi10aXRsZT5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwib3B0aW9uYWwtYnV0dG9uc1wiICpuZ0lmPVwidmFsdWVwcm9wLmJ1dHRvbnNcIj5cclxuICAgICAgICAgIDxidXR0b24gbWF0LXJhaXNlZC1idXR0b24gY2xhc3M9XCJ2YWx1ZS1wcm9wLWJ1dHRvblwiICpuZ0Zvcj1cImxldCBidXR0b24gb2YgdmFsdWVwcm9wLmJ1dHRvbnNcIlxyXG4gICAgICAgICAgICAoY2xpY2spPVwib25DbGlja1ZhbHVlUHJvcEJ1dHRvbihidXR0b24ucm91dGUpXCI+XHJcbiAgICAgICAgICAgIHt7YnV0dG9uLmxhYmVsfX1cclxuICAgICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L2Rpdj4iXX0=
|
package/esm2022/lib/page-section-with-multiple-cards/page-section-with-multiple-cards.component.mjs
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/router";
|
|
4
|
+
import * as i2 from "@fortawesome/angular-fontawesome";
|
|
5
|
+
import * as i3 from "@angular/common";
|
|
6
|
+
import * as i4 from "../section-title/section-title.component";
|
|
7
|
+
export class PageSectionWithMultipleCardsComponent {
|
|
8
|
+
_Router;
|
|
9
|
+
sectionContent;
|
|
10
|
+
constructor(_Router) {
|
|
11
|
+
this._Router = _Router;
|
|
12
|
+
}
|
|
13
|
+
ngOnInit() { }
|
|
14
|
+
onClickAllReasons(route) {
|
|
15
|
+
this._Router.navigate([route]);
|
|
16
|
+
}
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PageSectionWithMultipleCardsComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PageSectionWithMultipleCardsComponent, selector: "page-section-with-multiple-cards", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\r\n <div class=\"text-part\">\r\n <h2 class=\"tip-title\">\r\n {{sectionContent.tipTitle}}\r\n </h2>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\r\n <div class=\"card-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\r\n <path\r\n d=\"M5.0312 58.8331C-9.18797 29.0705 16.1615 9.11602 41.3271 3.99601C66.4928 -1.12401 102.401 -5.60082 96.1642 40.2919C89.9278 86.1847 85.034 90.009 59.8684 95.129C34.7027 100.249 19.2504 88.5958 5.0312 58.8331Z\" />\r\n </svg>\r\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"card-title\">\r\n {{reason.title}}\r\n </div>\r\n <div class=\"card-description\">\r\n {{reason.description}}\r\n </div>\r\n </div>\r\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\r\n <div class=\"card-title\">\r\n {{sectionContent.allReasonsBox.ctaText}}\r\n </div>\r\n <div class=\"icon-circle\">\r\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\r\n </div>\r\n </button>\r\n\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{gap:1.5rem;display:flex;flex-wrap:wrap;width:90%;margin:2rem auto}@media only screen and (min-width: 1500px){.page{max-width:150rem}}.page .text-part{width:61.5rem;row-gap:.5rem;display:grid;grid-template-rows:2rem 13rem auto;min-width:52rem;margin-bottom:2rem}@media only screen and (max-width: 600px){.page .text-part{min-width:0;width:100%;grid-template-rows:2rem auto auto}.page .text-part .subtitle{font-size:3rem;font-weight:700}}.page .text-part .tip-title{color:#155ed4;font-size:1.6rem;font-weight:700}.page .text-part .subtitle{font-size:4rem;font-weight:800;color:#3d3d3d}.page .text-part .description{font-size:2rem;font-weight:500;color:#7e7e7e}.page .reason-card,.page .all-reason-card{row-gap:1rem;display:grid;border-radius:1.5rem;border:.1rem solid #D8D8D8;background:#fff;box-shadow:.2rem .2rem .4rem #00000040;padding:2rem 1rem;margin:0rem auto}.page .reason-card{width:30rem;grid-template-rows:auto auto auto;text-align:center}.page .reason-card:nth-child(odd) svg{transform:rotate(90deg)}.page .reason-card .card-icon{place-self:center;position:relative}.page .reason-card .card-icon svg{width:9.5rem;height:9.5rem}.page .reason-card .card-icon fa-icon{position:absolute;font-size:3.8rem;top:calc(50% - 1.9rem);left:calc(50% - 1.9rem)}.page .reason-card .card-description{font-size:1.4rem;font-weight:500;color:#484848}.page .card-title{font-size:2.2rem;font-weight:800;color:#424345}.page .all-reason-card{place-content:center;cursor:pointer;transition:all .2s;width:30rem}@media (hover: hover){.page .all-reason-card:hover{background-color:#155ed4}.page .all-reason-card:hover .card-title{color:#fff}.page .all-reason-card:hover .icon-circle{color:#155ed4;background-color:#fff}.page .all-reason-card:active{background-color:#fff}.page .all-reason-card:active .card-title{color:#424345}.page .all-reason-card:active .icon-circle{color:#fff;background-color:#155ed4}}.page .all-reason-card .icon-circle{border-radius:50%;font-size:1.8rem;width:4rem;height:4rem;display:grid;place-content:center;background-color:#155ed4;color:#fff;justify-self:center}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle", "withoutTitleCase", "descriptionWidth"] }] });
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PageSectionWithMultipleCardsComponent, decorators: [{
|
|
21
|
+
type: Component,
|
|
22
|
+
args: [{ selector: 'page-section-with-multiple-cards', template: "<div class=\"page\">\r\n <div class=\"text-part\">\r\n <h2 class=\"tip-title\">\r\n {{sectionContent.tipTitle}}\r\n </h2>\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\"></section-title>\r\n </div>\r\n <div class=\"reason-card\" *ngFor=\"let reason of sectionContent.reasons\">\r\n <div class=\"card-icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 97 97\" [style.fill]=\"reason.shapeColor\">\r\n <path\r\n d=\"M5.0312 58.8331C-9.18797 29.0705 16.1615 9.11602 41.3271 3.99601C66.4928 -1.12401 102.401 -5.60082 96.1642 40.2919C89.9278 86.1847 85.034 90.009 59.8684 95.129C34.7027 100.249 19.2504 88.5958 5.0312 58.8331Z\" />\r\n </svg>\r\n <fa-icon [style.color]=\"reason.iconColor\" [icon]=\"reason.iconName\"></fa-icon>\r\n </div>\r\n <div class=\"card-title\">\r\n {{reason.title}}\r\n </div>\r\n <div class=\"card-description\">\r\n {{reason.description}}\r\n </div>\r\n </div>\r\n <button class=\"all-reason-card\" (click)=\"onClickAllReasons(sectionContent.allReasonsBox.route)\">\r\n <div class=\"card-title\">\r\n {{sectionContent.allReasonsBox.ctaText}}\r\n </div>\r\n <div class=\"icon-circle\">\r\n <fa-icon [icon]=\"sectionContent.allReasonsBox.iconName\"></fa-icon>\r\n </div>\r\n </button>\r\n\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{gap:1.5rem;display:flex;flex-wrap:wrap;width:90%;margin:2rem auto}@media only screen and (min-width: 1500px){.page{max-width:150rem}}.page .text-part{width:61.5rem;row-gap:.5rem;display:grid;grid-template-rows:2rem 13rem auto;min-width:52rem;margin-bottom:2rem}@media only screen and (max-width: 600px){.page .text-part{min-width:0;width:100%;grid-template-rows:2rem auto auto}.page .text-part .subtitle{font-size:3rem;font-weight:700}}.page .text-part .tip-title{color:#155ed4;font-size:1.6rem;font-weight:700}.page .text-part .subtitle{font-size:4rem;font-weight:800;color:#3d3d3d}.page .text-part .description{font-size:2rem;font-weight:500;color:#7e7e7e}.page .reason-card,.page .all-reason-card{row-gap:1rem;display:grid;border-radius:1.5rem;border:.1rem solid #D8D8D8;background:#fff;box-shadow:.2rem .2rem .4rem #00000040;padding:2rem 1rem;margin:0rem auto}.page .reason-card{width:30rem;grid-template-rows:auto auto auto;text-align:center}.page .reason-card:nth-child(odd) svg{transform:rotate(90deg)}.page .reason-card .card-icon{place-self:center;position:relative}.page .reason-card .card-icon svg{width:9.5rem;height:9.5rem}.page .reason-card .card-icon fa-icon{position:absolute;font-size:3.8rem;top:calc(50% - 1.9rem);left:calc(50% - 1.9rem)}.page .reason-card .card-description{font-size:1.4rem;font-weight:500;color:#484848}.page .card-title{font-size:2.2rem;font-weight:800;color:#424345}.page .all-reason-card{place-content:center;cursor:pointer;transition:all .2s;width:30rem}@media (hover: hover){.page .all-reason-card:hover{background-color:#155ed4}.page .all-reason-card:hover .card-title{color:#fff}.page .all-reason-card:hover .icon-circle{color:#155ed4;background-color:#fff}.page .all-reason-card:active{background-color:#fff}.page .all-reason-card:active .card-title{color:#424345}.page .all-reason-card:active .icon-circle{color:#fff;background-color:#155ed4}}.page .all-reason-card .icon-circle{border-radius:50%;font-size:1.8rem;width:4rem;height:4rem;display:grid;place-content:center;background-color:#155ed4;color:#fff;justify-self:center}\n"] }]
|
|
23
|
+
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { sectionContent: [{
|
|
24
|
+
type: Input
|
|
25
|
+
}] } });
|
|
26
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1zZWN0aW9uLXdpdGgtbXVsdGlwbGUtY2FyZHMuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvam9vbGVyLXdlYnNpdGVzLXNoYXJlZC9zcmMvbGliL3BhZ2Utc2VjdGlvbi13aXRoLW11bHRpcGxlLWNhcmRzL3BhZ2Utc2VjdGlvbi13aXRoLW11bHRpcGxlLWNhcmRzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9wYWdlLXNlY3Rpb24td2l0aC1tdWx0aXBsZS1jYXJkcy9wYWdlLXNlY3Rpb24td2l0aC1tdWx0aXBsZS1jYXJkcy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBVSxNQUFNLGVBQWUsQ0FBQzs7Ozs7O0FBUXpELE1BQU0sT0FBTyxxQ0FBcUM7SUFHNUI7SUFGWCxjQUFjLENBQU07SUFFN0IsWUFBb0IsT0FBZTtRQUFmLFlBQU8sR0FBUCxPQUFPLENBQVE7SUFBSSxDQUFDO0lBQ3hDLFFBQVEsS0FBVyxDQUFDO0lBRXBCLGlCQUFpQixDQUFDLEtBQWE7UUFDN0IsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO0lBQ2pDLENBQUM7d0dBUlUscUNBQXFDOzRGQUFyQyxxQ0FBcUMsc0hDUmxELDg4Q0ErQk07OzRGRHZCTyxxQ0FBcUM7a0JBTGpELFNBQVM7K0JBQ0Usa0NBQWtDOzZGQUtuQyxjQUFjO3NCQUF0QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFJvdXRlciB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3BhZ2Utc2VjdGlvbi13aXRoLW11bHRpcGxlLWNhcmRzJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vcGFnZS1zZWN0aW9uLXdpdGgtbXVsdGlwbGUtY2FyZHMuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3BhZ2Utc2VjdGlvbi13aXRoLW11bHRpcGxlLWNhcmRzLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFBhZ2VTZWN0aW9uV2l0aE11bHRpcGxlQ2FyZHNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHNlY3Rpb25Db250ZW50OiBhbnk7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgX1JvdXRlcjogUm91dGVyKSB7IH1cclxuICBuZ09uSW5pdCgpOiB2b2lkIHsgfVxyXG5cclxuICBvbkNsaWNrQWxsUmVhc29ucyhyb3V0ZTogc3RyaW5nKSB7XHJcbiAgICB0aGlzLl9Sb3V0ZXIubmF2aWdhdGUoW3JvdXRlXSk7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJwYWdlXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwidGV4dC1wYXJ0XCI+XHJcbiAgICAgICAgPGgyIGNsYXNzPVwidGlwLXRpdGxlXCI+XHJcbiAgICAgICAgICAgIHt7c2VjdGlvbkNvbnRlbnQudGlwVGl0bGV9fVxyXG4gICAgICAgIDwvaDI+XHJcbiAgICAgICAgPHNlY3Rpb24tdGl0bGUgW3NlY3Rpb25UaXRsZV09XCJzZWN0aW9uQ29udGVudC5zZWN0aW9uVGl0bGVcIj48L3NlY3Rpb24tdGl0bGU+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJyZWFzb24tY2FyZFwiICpuZ0Zvcj1cImxldCByZWFzb24gb2Ygc2VjdGlvbkNvbnRlbnQucmVhc29uc1wiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWljb25cIj5cclxuICAgICAgICAgICAgPHN2ZyB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCIgdmlld0JveD1cIjAgMCA5NyA5N1wiIFtzdHlsZS5maWxsXT1cInJlYXNvbi5zaGFwZUNvbG9yXCI+XHJcbiAgICAgICAgICAgICAgICA8cGF0aFxyXG4gICAgICAgICAgICAgICAgICAgIGQ9XCJNNS4wMzEyIDU4LjgzMzFDLTkuMTg3OTcgMjkuMDcwNSAxNi4xNjE1IDkuMTE2MDIgNDEuMzI3MSAzLjk5NjAxQzY2LjQ5MjggLTEuMTI0MDEgMTAyLjQwMSAtNS42MDA4MiA5Ni4xNjQyIDQwLjI5MTlDODkuOTI3OCA4Ni4xODQ3IDg1LjAzNCA5MC4wMDkgNTkuODY4NCA5NS4xMjlDMzQuNzAyNyAxMDAuMjQ5IDE5LjI1MDQgODguNTk1OCA1LjAzMTIgNTguODMzMVpcIiAvPlxyXG4gICAgICAgICAgICA8L3N2Zz5cclxuICAgICAgICAgICAgPGZhLWljb24gW3N0eWxlLmNvbG9yXT1cInJlYXNvbi5pY29uQ29sb3JcIiBbaWNvbl09XCJyZWFzb24uaWNvbk5hbWVcIj48L2ZhLWljb24+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImNhcmQtdGl0bGVcIj5cclxuICAgICAgICAgICAge3tyZWFzb24udGl0bGV9fVxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWRlc2NyaXB0aW9uXCI+XHJcbiAgICAgICAgICAgIHt7cmVhc29uLmRlc2NyaXB0aW9ufX1cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGJ1dHRvbiBjbGFzcz1cImFsbC1yZWFzb24tY2FyZFwiIChjbGljayk9XCJvbkNsaWNrQWxsUmVhc29ucyhzZWN0aW9uQ29udGVudC5hbGxSZWFzb25zQm94LnJvdXRlKVwiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLXRpdGxlXCI+XHJcbiAgICAgICAgICAgIHt7c2VjdGlvbkNvbnRlbnQuYWxsUmVhc29uc0JveC5jdGFUZXh0fX1cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiaWNvbi1jaXJjbGVcIj5cclxuICAgICAgICAgICAgPGZhLWljb24gW2ljb25dPVwic2VjdGlvbkNvbnRlbnQuYWxsUmVhc29uc0JveC5pY29uTmFtZVwiPjwvZmEtaWNvbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvYnV0dG9uPlxyXG5cclxuPC9kaXY+Il19
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@fortawesome/angular-fontawesome";
|
|
4
|
+
import * as i2 from "@angular/common";
|
|
5
|
+
import * as i3 from "@angular/material/button";
|
|
6
|
+
import * as i4 from "@angular/material/tooltip";
|
|
7
|
+
import * as i5 from "../auth-route-directive";
|
|
8
|
+
export class PricingPlansComponent {
|
|
9
|
+
servicePlan;
|
|
10
|
+
constructor() { }
|
|
11
|
+
ngOnInit() {
|
|
12
|
+
}
|
|
13
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PricingPlansComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
14
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PricingPlansComponent, selector: "pricing-plans", inputs: { servicePlan: "servicePlan" }, ngImport: i0, template: "<div class=\"plan-content\">\r\n <div class=\"title-price-desc\">\r\n <h1 class=\"plan-title\">\r\n {{servicePlan.name}}\r\n </h1>\r\n <div class=\"price\" *ngIf=\"servicePlan.price\">\r\n <span class=\"service-price\">{{servicePlan.price|currency}}</span>\r\n <span>/{{servicePlan.frequency}}</span>\r\n </div>\r\n <div class=\"description\">\r\n {{servicePlan.description}}\r\n </div>\r\n <div class=\"divider\"></div>\r\n </div>\r\n <div class=\"perks\">\r\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\r\n <span class=\"check-icon\">\r\n <fa-icon icon=\"check\"></fa-icon>\r\n </span>\r\n <div class=\"service-description\">\r\n <div class=\"service-perk\">\r\n {{perk.perk}}\r\n </div>\r\n <span class=\"exclamation-mark\">\r\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\"\r\n icon=\"circle-exclamation\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"registration-button\">\r\n <button mat-raised-button [requireAuth]=\"servicePlan.button.requiresAuth\"\r\n [targetRoute]=\"servicePlan.button.route\" authRoute [navigationExtras]=\"servicePlan.button.navigationExtras\"\r\n class=\"button\">\r\n {{servicePlan.button.label}}\r\n </button>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.service-suggestion{display:flex;justify-content:center;align-items:top;font-weight:650;font-size:2.4rem;height:2rem;color:#32353b;margin-bottom:2.5rem}.plan-content{display:flex;flex-direction:column;width:20%;background:#fff;border-radius:1rem;padding:3rem 2rem;min-width:33rem;row-gap:.5rem;transition:all .2s ease-in-out;box-shadow:#0000001f 0 .1rem .3rem,#0000003d 0 .1rem .2rem;height:100%;margin:auto}@media only screen and (max-width: 552px){.plan-content{min-width:60%}}@media only screen and (max-width: 75em){.plan-content{width:33rem}}@media only screen and (max-width: 620px){.plan-content{width:90%;height:99%}}.plan-content .title-price-desc{height:22rem}.plan-content .title-price-desc .divider{width:90%;border:.1rem solid #155ED4;margin:1rem auto}.plan-content .plan-title{grid-row:1;color:#155ed4;text-transform:uppercase;font-weight:700;font-size:2.5rem;padding:1rem 0rem;text-align:center}.plan-content .description{color:#32353b;font-size:1.2rem;padding:1rem 0rem;text-align:center;height:8rem}.plan-content .perks{display:flex;row-gap:.5rem;height:100%;align-items:flex-start;flex-direction:column}.plan-content .perks .perk{display:flex;align-items:center;width:100%}.plan-content .perks .perk .service-description{align-items:center;font-weight:600;font-size:1.3rem;margin-left:1rem;color:#32353b;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:row;justify-content:space-between;width:100%}.plan-content .perks .perk .service-description .exclamation-mark{cursor:pointer;color:#32353b}.plan-content .service-price{font-weight:800;font-size:4.2rem;text-align:center}.plan-content .registration-button{display:flex;padding:1rem 0rem;height:100%}.plan-content .registration-button .button{align-self:flex-end;font-weight:600;width:85%;background-color:#155ed4;color:#fff;width:100%}\n"], dependencies: [{ kind: "component", type: 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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.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: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i5.AuthRouteDirective, selector: "[authRoute]", inputs: ["targetRoute", "requireAuth", "navigationExtras"] }, { kind: "pipe", type: i2.CurrencyPipe, name: "currency" }] });
|
|
15
|
+
}
|
|
16
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PricingPlansComponent, decorators: [{
|
|
17
|
+
type: Component,
|
|
18
|
+
args: [{ selector: 'pricing-plans', template: "<div class=\"plan-content\">\r\n <div class=\"title-price-desc\">\r\n <h1 class=\"plan-title\">\r\n {{servicePlan.name}}\r\n </h1>\r\n <div class=\"price\" *ngIf=\"servicePlan.price\">\r\n <span class=\"service-price\">{{servicePlan.price|currency}}</span>\r\n <span>/{{servicePlan.frequency}}</span>\r\n </div>\r\n <div class=\"description\">\r\n {{servicePlan.description}}\r\n </div>\r\n <div class=\"divider\"></div>\r\n </div>\r\n <div class=\"perks\">\r\n <div class=\"perk\" *ngFor=\"let perk of servicePlan.perks; let switchStyle = index\">\r\n <span class=\"check-icon\">\r\n <fa-icon icon=\"check\"></fa-icon>\r\n </span>\r\n <div class=\"service-description\">\r\n <div class=\"service-perk\">\r\n {{perk.perk}}\r\n </div>\r\n <span class=\"exclamation-mark\">\r\n <fa-icon #tooltip=\"matTooltip\" [matTooltip]=\"perk.tooltipMessage\" [matTooltipPosition]=\"'right'\"\r\n icon=\"circle-exclamation\"></fa-icon>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"registration-button\">\r\n <button mat-raised-button [requireAuth]=\"servicePlan.button.requiresAuth\"\r\n [targetRoute]=\"servicePlan.button.route\" authRoute [navigationExtras]=\"servicePlan.button.navigationExtras\"\r\n class=\"button\">\r\n {{servicePlan.button.label}}\r\n </button>\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.service-suggestion{display:flex;justify-content:center;align-items:top;font-weight:650;font-size:2.4rem;height:2rem;color:#32353b;margin-bottom:2.5rem}.plan-content{display:flex;flex-direction:column;width:20%;background:#fff;border-radius:1rem;padding:3rem 2rem;min-width:33rem;row-gap:.5rem;transition:all .2s ease-in-out;box-shadow:#0000001f 0 .1rem .3rem,#0000003d 0 .1rem .2rem;height:100%;margin:auto}@media only screen and (max-width: 552px){.plan-content{min-width:60%}}@media only screen and (max-width: 75em){.plan-content{width:33rem}}@media only screen and (max-width: 620px){.plan-content{width:90%;height:99%}}.plan-content .title-price-desc{height:22rem}.plan-content .title-price-desc .divider{width:90%;border:.1rem solid #155ED4;margin:1rem auto}.plan-content .plan-title{grid-row:1;color:#155ed4;text-transform:uppercase;font-weight:700;font-size:2.5rem;padding:1rem 0rem;text-align:center}.plan-content .description{color:#32353b;font-size:1.2rem;padding:1rem 0rem;text-align:center;height:8rem}.plan-content .perks{display:flex;row-gap:.5rem;height:100%;align-items:flex-start;flex-direction:column}.plan-content .perks .perk{display:flex;align-items:center;width:100%}.plan-content .perks .perk .service-description{align-items:center;font-weight:600;font-size:1.3rem;margin-left:1rem;color:#32353b;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:row;justify-content:space-between;width:100%}.plan-content .perks .perk .service-description .exclamation-mark{cursor:pointer;color:#32353b}.plan-content .service-price{font-weight:800;font-size:4.2rem;text-align:center}.plan-content .registration-button{display:flex;padding:1rem 0rem;height:100%}.plan-content .registration-button .button{align-self:flex-end;font-weight:600;width:85%;background-color:#155ed4;color:#fff;width:100%}\n"] }]
|
|
19
|
+
}], ctorParameters: function () { return []; }, propDecorators: { servicePlan: [{
|
|
20
|
+
type: Input
|
|
21
|
+
}] } });
|
|
22
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJpY2luZy1wbGFucy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9qb29sZXItd2Vic2l0ZXMtc2hhcmVkL3NyYy9saWIvcHJpY2luZy1wbGFucy9wcmljaW5nLXBsYW5zLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9wcmljaW5nLXBsYW5zL3ByaWNpbmctcGxhbnMuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7Ozs7QUFRekQsTUFBTSxPQUFPLHFCQUFxQjtJQUN2QixXQUFXLENBQWM7SUFDbEMsZ0JBQWdCLENBQUM7SUFFakIsUUFBUTtJQUNSLENBQUM7d0dBTFUscUJBQXFCOzRGQUFyQixxQkFBcUIsNkZDUmxDLDhtREFxQ007OzRGRDdCTyxxQkFBcUI7a0JBTGpDLFNBQVM7K0JBQ0UsZUFBZTswRUFLaEIsV0FBVztzQkFBbkIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBTZXJ2aWNlUGxhbiB9IGZyb20gJy4uL21vZGVscy9zZXJ2aWNlLXBsYW4ubW9kZWwnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdwcmljaW5nLXBsYW5zJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vcHJpY2luZy1wbGFucy5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vcHJpY2luZy1wbGFucy5jb21wb25lbnQuc2NzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBQcmljaW5nUGxhbnNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHNlcnZpY2VQbGFuOiBTZXJ2aWNlUGxhbjtcclxuICBjb25zdHJ1Y3RvcigpIHsgfVxyXG5cclxuICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICB9XHJcblxyXG5cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwicGxhbi1jb250ZW50XCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwidGl0bGUtcHJpY2UtZGVzY1wiPlxyXG4gICAgICAgIDxoMSBjbGFzcz1cInBsYW4tdGl0bGVcIj5cclxuICAgICAgICAgICAge3tzZXJ2aWNlUGxhbi5uYW1lfX1cclxuICAgICAgICA8L2gxPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJwcmljZVwiICpuZ0lmPVwic2VydmljZVBsYW4ucHJpY2VcIj5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJzZXJ2aWNlLXByaWNlXCI+e3tzZXJ2aWNlUGxhbi5wcmljZXxjdXJyZW5jeX19PC9zcGFuPlxyXG4gICAgICAgICAgICA8c3Bhbj4ve3tzZXJ2aWNlUGxhbi5mcmVxdWVuY3l9fTwvc3Bhbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiZGVzY3JpcHRpb25cIj5cclxuICAgICAgICAgICAge3tzZXJ2aWNlUGxhbi5kZXNjcmlwdGlvbn19XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImRpdmlkZXJcIj48L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGRpdiBjbGFzcz1cInBlcmtzXCI+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cInBlcmtcIiAqbmdGb3I9XCJsZXQgcGVyayBvZiBzZXJ2aWNlUGxhbi5wZXJrczsgbGV0IHN3aXRjaFN0eWxlID0gaW5kZXhcIj5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJjaGVjay1pY29uXCI+XHJcbiAgICAgICAgICAgICAgICA8ZmEtaWNvbiBpY29uPVwiY2hlY2tcIj48L2ZhLWljb24+XHJcbiAgICAgICAgICAgIDwvc3Bhbj5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cInNlcnZpY2UtZGVzY3JpcHRpb25cIj5cclxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzZXJ2aWNlLXBlcmtcIj5cclxuICAgICAgICAgICAgICAgICAgICB7e3BlcmsucGVya319XHJcbiAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiZXhjbGFtYXRpb24tbWFya1wiPlxyXG4gICAgICAgICAgICAgICAgICAgIDxmYS1pY29uICN0b29sdGlwPVwibWF0VG9vbHRpcFwiIFttYXRUb29sdGlwXT1cInBlcmsudG9vbHRpcE1lc3NhZ2VcIiBbbWF0VG9vbHRpcFBvc2l0aW9uXT1cIidyaWdodCdcIlxyXG4gICAgICAgICAgICAgICAgICAgICAgICBpY29uPVwiY2lyY2xlLWV4Y2xhbWF0aW9uXCI+PC9mYS1pY29uPlxyXG4gICAgICAgICAgICAgICAgPC9zcGFuPlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGRpdiBjbGFzcz1cInJlZ2lzdHJhdGlvbi1idXR0b25cIj5cclxuICAgICAgICA8YnV0dG9uIG1hdC1yYWlzZWQtYnV0dG9uIFtyZXF1aXJlQXV0aF09XCJzZXJ2aWNlUGxhbi5idXR0b24ucmVxdWlyZXNBdXRoXCJcclxuICAgICAgICAgICAgW3RhcmdldFJvdXRlXT1cInNlcnZpY2VQbGFuLmJ1dHRvbi5yb3V0ZVwiIGF1dGhSb3V0ZSBbbmF2aWdhdGlvbkV4dHJhc109XCJzZXJ2aWNlUGxhbi5idXR0b24ubmF2aWdhdGlvbkV4dHJhc1wiXHJcbiAgICAgICAgICAgIGNsYXNzPVwiYnV0dG9uXCI+XHJcbiAgICAgICAgICAgIHt7c2VydmljZVBsYW4uYnV0dG9uLmxhYmVsfX1cclxuICAgICAgICA8L2J1dHRvbj5cclxuICAgIDwvZGl2PlxyXG48L2Rpdj4iXX0=
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import { SectionTitleSizes } from '../models/section-title-sizes.model';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
import * as i1 from "@angular/common";
|
|
5
|
+
export class SectionTitleComponent {
|
|
6
|
+
sectionTitle;
|
|
7
|
+
sectionTitleSizes = SectionTitleSizes;
|
|
8
|
+
withoutTitleCase;
|
|
9
|
+
descriptionWidth;
|
|
10
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SectionTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SectionTitleComponent, selector: "section-title", inputs: { sectionTitle: "sectionTitle", withoutTitleCase: "withoutTitleCase", descriptionWidth: "descriptionWidth" }, ngImport: i0, template: "<div class=\"section-container\" [ngClass]=\"{'align-left':sectionTitle.alignLeft,'align-center':!sectionTitle.alignLeft,'dark-background':sectionTitle.isDarkBg ,'light-background':!sectionTitle.isDarkBg, 'without-divider':sectionTitle.isWithoutDivider,\r\n'small-font': sectionTitle.fontSizeEnum == sectionTitleSizes.SMALL,\r\n'medium-font': sectionTitle.fontSizeEnum == sectionTitleSizes.MEDIUM || (!sectionTitle.fontSizeEnum),\r\n'large-font': (sectionTitle.fontSizeEnum == sectionTitleSizes.LARGE) }\">\r\n <div class=\"title-container\">\r\n <div class=\"title\" *ngIf=\"sectionTitle.title\">\r\n {{withoutTitleCase? sectionTitle.title : (sectionTitle.title | titlecase)}}\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\r\n </div>\r\n </div>\r\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\"\r\n [ngStyle]=\"descriptionWidth ? {width : descriptionWidth} : null\">\r\n {{sectionTitle.subtitle}}<ng-content></ng-content>\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}.section-container{width:100%}.align-center{text-align:center}.align-center .title-container{margin:auto}.align-center .divider{margin:.2rem auto 1rem}.align-center .description{margin:auto;width:90%}.title-container{margin:auto;width:-moz-fit-content;width:fit-content}.title{font-weight:700;width:auto;margin:auto;line-height:normal}.divider{height:.4rem;width:auto;border-radius:4rem}.dark-background .divider{background-color:#fff}.dark-background .title,.dark-background .description{color:#fff}.without-divider{display:flex;flex-direction:column;row-gap:3rem}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500}.align-left .title{margin:0}.align-left .divider{margin:.2rem 0 1rem;width:auto}.align-left .description{width:85%;margin:0}.align-left .title-container{margin:0}.large-font .title{font-size:5rem}.large-font .description{font-size:1.8rem}.medium-font .title{font-size:4rem}.medium-font .description{font-size:1.8rem}.small-font .title{font-size:3rem}.small-font .description{font-size:1.6rem}@media only screen and (max-width: 37.5em){.large-font .title,.align-left .title,.align-center .title{font-size:3rem}.large-font .description,.align-left .description,.align-center .description{width:85%;font-size:1.8rem}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i1.TitleCasePipe, name: "titlecase" }] });
|
|
12
|
+
}
|
|
13
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SectionTitleComponent, decorators: [{
|
|
14
|
+
type: Component,
|
|
15
|
+
args: [{ selector: 'section-title', template: "<div class=\"section-container\" [ngClass]=\"{'align-left':sectionTitle.alignLeft,'align-center':!sectionTitle.alignLeft,'dark-background':sectionTitle.isDarkBg ,'light-background':!sectionTitle.isDarkBg, 'without-divider':sectionTitle.isWithoutDivider,\r\n'small-font': sectionTitle.fontSizeEnum == sectionTitleSizes.SMALL,\r\n'medium-font': sectionTitle.fontSizeEnum == sectionTitleSizes.MEDIUM || (!sectionTitle.fontSizeEnum),\r\n'large-font': (sectionTitle.fontSizeEnum == sectionTitleSizes.LARGE) }\">\r\n <div class=\"title-container\">\r\n <div class=\"title\" *ngIf=\"sectionTitle.title\">\r\n {{withoutTitleCase? sectionTitle.title : (sectionTitle.title | titlecase)}}\r\n </div>\r\n <div class=\"divider\" *ngIf=\"!sectionTitle.isWithoutDivider\">\r\n </div>\r\n </div>\r\n <div class=\"description\" *ngIf=\"sectionTitle.subtitle\"\r\n [ngStyle]=\"descriptionWidth ? {width : descriptionWidth} : null\">\r\n {{sectionTitle.subtitle}}<ng-content></ng-content>\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}.section-container{width:100%}.align-center{text-align:center}.align-center .title-container{margin:auto}.align-center .divider{margin:.2rem auto 1rem}.align-center .description{margin:auto;width:90%}.title-container{margin:auto;width:-moz-fit-content;width:fit-content}.title{font-weight:700;width:auto;margin:auto;line-height:normal}.divider{height:.4rem;width:auto;border-radius:4rem}.dark-background .divider{background-color:#fff}.dark-background .title,.dark-background .description{color:#fff}.without-divider{display:flex;flex-direction:column;row-gap:3rem}.light-background .divider{background-color:#155ed4}.light-background .title,.light-background .description{color:#32353b}.description{width:85%;font-weight:500}.align-left .title{margin:0}.align-left .divider{margin:.2rem 0 1rem;width:auto}.align-left .description{width:85%;margin:0}.align-left .title-container{margin:0}.large-font .title{font-size:5rem}.large-font .description{font-size:1.8rem}.medium-font .title{font-size:4rem}.medium-font .description{font-size:1.8rem}.small-font .title{font-size:3rem}.small-font .description{font-size:1.6rem}@media only screen and (max-width: 37.5em){.large-font .title,.align-left .title,.align-center .title{font-size:3rem}.large-font .description,.align-left .description,.align-center .description{width:85%;font-size:1.8rem}}\n"] }]
|
|
16
|
+
}], propDecorators: { sectionTitle: [{
|
|
17
|
+
type: Input
|
|
18
|
+
}], withoutTitleCase: [{
|
|
19
|
+
type: Input
|
|
20
|
+
}], descriptionWidth: [{
|
|
21
|
+
type: Input
|
|
22
|
+
}] } });
|
|
23
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2VjdGlvbi10aXRsZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9qb29sZXItd2Vic2l0ZXMtc2hhcmVkL3NyYy9saWIvc2VjdGlvbi10aXRsZS9zZWN0aW9uLXRpdGxlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9zZWN0aW9uLXRpdGxlL3NlY3Rpb24tdGl0bGUuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFakQsT0FBTyxFQUFFLGlCQUFpQixFQUFFLE1BQU0scUNBQXFDLENBQUM7OztBQU14RSxNQUFNLE9BQU8scUJBQXFCO0lBQ3ZCLFlBQVksQ0FBZTtJQUNwQyxpQkFBaUIsR0FBRyxpQkFBaUIsQ0FBQztJQUM3QixnQkFBZ0IsQ0FBVTtJQUMxQixnQkFBZ0IsQ0FBVTt3R0FKeEIscUJBQXFCOzRGQUFyQixxQkFBcUIsMktDUmxDLGlpQ0FlTTs7NEZEUE8scUJBQXFCO2tCQUxqQyxTQUFTOytCQUNFLGVBQWU7OEJBS2hCLFlBQVk7c0JBQXBCLEtBQUs7Z0JBRUcsZ0JBQWdCO3NCQUF4QixLQUFLO2dCQUNHLGdCQUFnQjtzQkFBeEIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgU2VjdGlvblRpdGxlIH0gZnJvbSAnLi4vbW9kZWxzL3NlY3Rpb24tdGl0bGUubW9kZWwnXHJcbmltcG9ydCB7IFNlY3Rpb25UaXRsZVNpemVzIH0gZnJvbSAnLi4vbW9kZWxzL3NlY3Rpb24tdGl0bGUtc2l6ZXMubW9kZWwnO1xyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3NlY3Rpb24tdGl0bGUnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9zZWN0aW9uLXRpdGxlLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9zZWN0aW9uLXRpdGxlLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFNlY3Rpb25UaXRsZUNvbXBvbmVudCB7XHJcbiAgQElucHV0KCkgc2VjdGlvblRpdGxlOiBTZWN0aW9uVGl0bGU7XHJcbiAgc2VjdGlvblRpdGxlU2l6ZXMgPSBTZWN0aW9uVGl0bGVTaXplcztcclxuICBASW5wdXQoKSB3aXRob3V0VGl0bGVDYXNlOiBib29sZWFuO1xyXG4gIEBJbnB1dCgpIGRlc2NyaXB0aW9uV2lkdGg6IHN0cmluZyA7XHJcbn0iLCI8ZGl2IGNsYXNzPVwic2VjdGlvbi1jb250YWluZXJcIiBbbmdDbGFzc109XCJ7J2FsaWduLWxlZnQnOnNlY3Rpb25UaXRsZS5hbGlnbkxlZnQsJ2FsaWduLWNlbnRlcic6IXNlY3Rpb25UaXRsZS5hbGlnbkxlZnQsJ2RhcmstYmFja2dyb3VuZCc6c2VjdGlvblRpdGxlLmlzRGFya0JnICwnbGlnaHQtYmFja2dyb3VuZCc6IXNlY3Rpb25UaXRsZS5pc0RhcmtCZywgJ3dpdGhvdXQtZGl2aWRlcic6c2VjdGlvblRpdGxlLmlzV2l0aG91dERpdmlkZXIsXHJcbidzbWFsbC1mb250Jzogc2VjdGlvblRpdGxlLmZvbnRTaXplRW51bSA9PSBzZWN0aW9uVGl0bGVTaXplcy5TTUFMTCxcclxuJ21lZGl1bS1mb250Jzogc2VjdGlvblRpdGxlLmZvbnRTaXplRW51bSA9PSBzZWN0aW9uVGl0bGVTaXplcy5NRURJVU0gfHwgKCFzZWN0aW9uVGl0bGUuZm9udFNpemVFbnVtKSxcclxuJ2xhcmdlLWZvbnQnOiAoc2VjdGlvblRpdGxlLmZvbnRTaXplRW51bSA9PSBzZWN0aW9uVGl0bGVTaXplcy5MQVJHRSkgfVwiPlxyXG4gICAgPGRpdiBjbGFzcz1cInRpdGxlLWNvbnRhaW5lclwiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJ0aXRsZVwiICpuZ0lmPVwic2VjdGlvblRpdGxlLnRpdGxlXCI+XHJcbiAgICAgICAgICAgIHt7d2l0aG91dFRpdGxlQ2FzZT8gc2VjdGlvblRpdGxlLnRpdGxlIDogKHNlY3Rpb25UaXRsZS50aXRsZSB8IHRpdGxlY2FzZSl9fVxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJkaXZpZGVyXCIgKm5nSWY9XCIhc2VjdGlvblRpdGxlLmlzV2l0aG91dERpdmlkZXJcIj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gICAgPGRpdiBjbGFzcz1cImRlc2NyaXB0aW9uXCIgKm5nSWY9XCJzZWN0aW9uVGl0bGUuc3VidGl0bGVcIlxyXG4gICAgICAgIFtuZ1N0eWxlXT1cImRlc2NyaXB0aW9uV2lkdGggPyB7d2lkdGggOiBkZXNjcmlwdGlvbldpZHRofSA6IG51bGxcIj5cclxuICAgICAgICB7e3NlY3Rpb25UaXRsZS5zdWJ0aXRsZX19PG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { HttpHeaders } from '@angular/common/http';
|
|
2
|
+
import { Injectable } from '@angular/core';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
import * as i1 from "@angular/common/http";
|
|
5
|
+
export class UserService {
|
|
6
|
+
http;
|
|
7
|
+
constructor(http) {
|
|
8
|
+
this.http = http;
|
|
9
|
+
}
|
|
10
|
+
getAuthenticationHeaders() {
|
|
11
|
+
const token = localStorage.getItem("token");
|
|
12
|
+
const httpHeaders = new HttpHeaders({
|
|
13
|
+
"Content-Type": "application/json; charset-utf-8",
|
|
14
|
+
Authorization: "Token " + token,
|
|
15
|
+
});
|
|
16
|
+
return { headers: httpHeaders };
|
|
17
|
+
}
|
|
18
|
+
getTokenlessHeaders() {
|
|
19
|
+
const httpHeaders = new HttpHeaders({
|
|
20
|
+
"Content-Type": "application/json; charset-utf-8",
|
|
21
|
+
});
|
|
22
|
+
return { headers: httpHeaders };
|
|
23
|
+
}
|
|
24
|
+
isAuthenticated() {
|
|
25
|
+
return !!localStorage.getItem('token');
|
|
26
|
+
}
|
|
27
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UserService, deps: [{ token: i1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
28
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UserService, providedIn: 'root' });
|
|
29
|
+
}
|
|
30
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: UserService, decorators: [{
|
|
31
|
+
type: Injectable,
|
|
32
|
+
args: [{
|
|
33
|
+
providedIn: 'root'
|
|
34
|
+
}]
|
|
35
|
+
}], ctorParameters: function () { return [{ type: i1.HttpClient }]; } });
|
|
36
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlci5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvam9vbGVyLXdlYnNpdGVzLXNoYXJlZC9zcmMvbGliL3NlcnZpY2VzL3VzZXIuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQWMsV0FBVyxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDL0QsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7O0FBTzNDLE1BQU0sT0FBTyxXQUFXO0lBRUY7SUFBcEIsWUFBb0IsSUFBZ0I7UUFBaEIsU0FBSSxHQUFKLElBQUksQ0FBWTtJQUFJLENBQUM7SUFFekMsd0JBQXdCO1FBQ3RCLE1BQU0sS0FBSyxHQUFHLFlBQVksQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDNUMsTUFBTSxXQUFXLEdBQUcsSUFBSSxXQUFXLENBQUM7WUFDbEMsY0FBYyxFQUFFLGlDQUFpQztZQUNqRCxhQUFhLEVBQUUsUUFBUSxHQUFHLEtBQUs7U0FDaEMsQ0FBQyxDQUFDO1FBQ0gsT0FBTyxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsQ0FBQztJQUNsQyxDQUFDO0lBRUQsbUJBQW1CO1FBQ2pCLE1BQU0sV0FBVyxHQUFHLElBQUksV0FBVyxDQUFDO1lBQ2xDLGNBQWMsRUFBRSxpQ0FBaUM7U0FDbEQsQ0FBQyxDQUFDO1FBQ0gsT0FBTyxFQUFFLE9BQU8sRUFBRSxXQUFXLEVBQUUsQ0FBQztJQUNsQyxDQUFDO0lBRUQsZUFBZTtRQUNiLE9BQU8sQ0FBQyxDQUFDLFlBQVksQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDekMsQ0FBQzt3R0F0QlUsV0FBVzs0R0FBWCxXQUFXLGNBSFYsTUFBTTs7NEZBR1AsV0FBVztrQkFKdkIsVUFBVTttQkFBQztvQkFDVixVQUFVLEVBQUUsTUFBTTtpQkFDbkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBIdHRwQ2xpZW50LCBIdHRwSGVhZGVycyB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbi9odHRwJztcclxuaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuXHJcbkBJbmplY3RhYmxlKHtcclxuICBwcm92aWRlZEluOiAncm9vdCdcclxufSlcclxuXHJcbmV4cG9ydCBjbGFzcyBVc2VyU2VydmljZSB7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgaHR0cDogSHR0cENsaWVudCkgeyB9XHJcblxyXG4gIGdldEF1dGhlbnRpY2F0aW9uSGVhZGVycygpIHtcclxuICAgIGNvbnN0IHRva2VuID0gbG9jYWxTdG9yYWdlLmdldEl0ZW0oXCJ0b2tlblwiKTtcclxuICAgIGNvbnN0IGh0dHBIZWFkZXJzID0gbmV3IEh0dHBIZWFkZXJzKHtcclxuICAgICAgXCJDb250ZW50LVR5cGVcIjogXCJhcHBsaWNhdGlvbi9qc29uOyBjaGFyc2V0LXV0Zi04XCIsXHJcbiAgICAgIEF1dGhvcml6YXRpb246IFwiVG9rZW4gXCIgKyB0b2tlbixcclxuICAgIH0pO1xyXG4gICAgcmV0dXJuIHsgaGVhZGVyczogaHR0cEhlYWRlcnMgfTtcclxuICB9XHJcblxyXG4gIGdldFRva2VubGVzc0hlYWRlcnMoKSB7XHJcbiAgICBjb25zdCBodHRwSGVhZGVycyA9IG5ldyBIdHRwSGVhZGVycyh7XHJcbiAgICAgIFwiQ29udGVudC1UeXBlXCI6IFwiYXBwbGljYXRpb24vanNvbjsgY2hhcnNldC11dGYtOFwiLFxyXG4gICAgfSk7XHJcbiAgICByZXR1cm4geyBoZWFkZXJzOiBodHRwSGVhZGVycyB9O1xyXG4gIH1cclxuXHJcbiAgaXNBdXRoZW50aWNhdGVkKCk6IGJvb2xlYW4ge1xyXG4gICAgcmV0dXJuICEhbG9jYWxTdG9yYWdlLmdldEl0ZW0oJ3Rva2VuJyk7XHJcbiAgfVxyXG59XHJcbiJdfQ==
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/router";
|
|
4
|
+
import * as i2 from "@fortawesome/angular-fontawesome";
|
|
5
|
+
import * as i3 from "@angular/common";
|
|
6
|
+
export class SocialMediaIconsComponent {
|
|
7
|
+
_router;
|
|
8
|
+
color;
|
|
9
|
+
areIconsInFooter;
|
|
10
|
+
socialMediaLinks;
|
|
11
|
+
constructor(_router) {
|
|
12
|
+
this._router = _router;
|
|
13
|
+
}
|
|
14
|
+
ngOnInit() {
|
|
15
|
+
}
|
|
16
|
+
onClickLinkedIn() {
|
|
17
|
+
window.location.href = this.socialMediaLinks.linkedIn;
|
|
18
|
+
}
|
|
19
|
+
onClickInstagram() {
|
|
20
|
+
window.location.href = this.socialMediaLinks.instagram;
|
|
21
|
+
}
|
|
22
|
+
onClickYoutube() {
|
|
23
|
+
window.location.href = this.socialMediaLinks.youTube;
|
|
24
|
+
}
|
|
25
|
+
setStyles() {
|
|
26
|
+
let style = {
|
|
27
|
+
color: this.color
|
|
28
|
+
};
|
|
29
|
+
return style;
|
|
30
|
+
}
|
|
31
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SocialMediaIconsComponent, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
32
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SocialMediaIconsComponent, selector: "social-media-icons", inputs: { color: "color", areIconsInFooter: "areIconsInFooter", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<div [ngClass]=\"{'icons-white':areIconsInFooter, 'icons':!areIconsInFooter}\">\r\n <fa-icon [icon]=\"['fab', 'linkedin-in']\" class=\"icon linkedin\" (click)=\"onClickLinkedIn()\"></fa-icon>\r\n <fa-icon [icon]=\"['fab', 'instagram']\" class=\"icon instagram\" (click)=\"onClickInstagram()\"></fa-icon>\r\n <fa-icon [icon]=\"['fab', 'youtube']\" class=\"icon youtube\" (click)=\"onClickYoutube()\"></fa-icon>\r\n</div>", styles: [".icons,.icons-white{display:flex;gap:1.5rem}.icons .icon,.icons-white .icon{cursor:pointer;font-size:2rem}.icons-white{color:#fff}.icons-white .icon:hover{color:#e6e6e6}.icons{font-size:2rem}.icons .icon{color:#4d4d4d;cursor:pointer;transition:ease-in-out .2s}.icons .linkedin:hover{color:#0072b1}.icons .instagram:hover{color:#c92bb7}.icons .youtube:hover{color:red}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
33
|
+
}
|
|
34
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SocialMediaIconsComponent, decorators: [{
|
|
35
|
+
type: Component,
|
|
36
|
+
args: [{ selector: 'social-media-icons', template: "<div [ngClass]=\"{'icons-white':areIconsInFooter, 'icons':!areIconsInFooter}\">\r\n <fa-icon [icon]=\"['fab', 'linkedin-in']\" class=\"icon linkedin\" (click)=\"onClickLinkedIn()\"></fa-icon>\r\n <fa-icon [icon]=\"['fab', 'instagram']\" class=\"icon instagram\" (click)=\"onClickInstagram()\"></fa-icon>\r\n <fa-icon [icon]=\"['fab', 'youtube']\" class=\"icon youtube\" (click)=\"onClickYoutube()\"></fa-icon>\r\n</div>", styles: [".icons,.icons-white{display:flex;gap:1.5rem}.icons .icon,.icons-white .icon{cursor:pointer;font-size:2rem}.icons-white{color:#fff}.icons-white .icon:hover{color:#e6e6e6}.icons{font-size:2rem}.icons .icon{color:#4d4d4d;cursor:pointer;transition:ease-in-out .2s}.icons .linkedin:hover{color:#0072b1}.icons .instagram:hover{color:#c92bb7}.icons .youtube:hover{color:red}\n"] }]
|
|
37
|
+
}], ctorParameters: function () { return [{ type: i1.Router }]; }, propDecorators: { color: [{
|
|
38
|
+
type: Input
|
|
39
|
+
}], areIconsInFooter: [{
|
|
40
|
+
type: Input
|
|
41
|
+
}], socialMediaLinks: [{
|
|
42
|
+
type: Input
|
|
43
|
+
}] } });
|
|
44
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic29jaWFsLW1lZGlhLWljb25zLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9zb2NpYWwtbWVkaWEtaWNvbnMvc29jaWFsLW1lZGlhLWljb25zLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9zb2NpYWwtbWVkaWEtaWNvbnMvc29jaWFsLW1lZGlhLWljb25zLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7OztBQU96RCxNQUFNLE9BQU8seUJBQXlCO0lBSWhCO0lBSFgsS0FBSyxDQUFTO0lBQ2QsZ0JBQWdCLENBQVU7SUFDMUIsZ0JBQWdCLENBQW1CO0lBQzVDLFlBQW9CLE9BQWU7UUFBZixZQUFPLEdBQVAsT0FBTyxDQUFRO0lBQUksQ0FBQztJQUV4QyxRQUFRO0lBQ1IsQ0FBQztJQUVELGVBQWU7UUFDYixNQUFNLENBQUMsUUFBUSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsUUFBUSxDQUFDO0lBQ3hELENBQUM7SUFFRCxnQkFBZ0I7UUFDZCxNQUFNLENBQUMsUUFBUSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsU0FBUyxDQUFDO0lBQ3pELENBQUM7SUFFRCxjQUFjO1FBQ1osTUFBTSxDQUFDLFFBQVEsQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLE9BQU8sQ0FBQztJQUN2RCxDQUFDO0lBRUQsU0FBUztRQUNQLElBQUksS0FBSyxHQUFHO1lBQ1YsS0FBSyxFQUFFLElBQUksQ0FBQyxLQUFLO1NBQ2xCLENBQUE7UUFDRCxPQUFPLEtBQUssQ0FBQztJQUNmLENBQUM7d0dBMUJVLHlCQUF5Qjs0RkFBekIseUJBQXlCLGtLQ1J0Qyx3YUFJTTs7NEZESU8seUJBQXlCO2tCQUxyQyxTQUFTOytCQUNFLG9CQUFvQjs2RkFLckIsS0FBSztzQkFBYixLQUFLO2dCQUNHLGdCQUFnQjtzQkFBeEIsS0FBSztnQkFDRyxnQkFBZ0I7c0JBQXhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBSb3V0ZXIgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xyXG5pbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgc29jaWFsTWVkaWFMaW5rcyB9IGZyb20gJy4vc29jaWFsLW1lZGlhLWxpbmtzLm1vZGVsJztcclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdzb2NpYWwtbWVkaWEtaWNvbnMnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi9zb2NpYWwtbWVkaWEtaWNvbnMuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3NvY2lhbC1tZWRpYS1pY29ucy5jb21wb25lbnQuc2NzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBTb2NpYWxNZWRpYUljb25zQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICBASW5wdXQoKSBjb2xvcjogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGFyZUljb25zSW5Gb290ZXI6IGJvb2xlYW47XHJcbiAgQElucHV0KCkgc29jaWFsTWVkaWFMaW5rczogc29jaWFsTWVkaWFMaW5rcztcclxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIF9yb3V0ZXI6IFJvdXRlcikgeyB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gIH1cclxuXHJcbiAgb25DbGlja0xpbmtlZEluKCkge1xyXG4gICAgd2luZG93LmxvY2F0aW9uLmhyZWYgPSB0aGlzLnNvY2lhbE1lZGlhTGlua3MubGlua2VkSW47XHJcbiAgfVxyXG5cclxuICBvbkNsaWNrSW5zdGFncmFtKCkge1xyXG4gICAgd2luZG93LmxvY2F0aW9uLmhyZWYgPSB0aGlzLnNvY2lhbE1lZGlhTGlua3MuaW5zdGFncmFtO1xyXG4gIH1cclxuXHJcbiAgb25DbGlja1lvdXR1YmUoKSB7XHJcbiAgICB3aW5kb3cubG9jYXRpb24uaHJlZiA9IHRoaXMuc29jaWFsTWVkaWFMaW5rcy55b3VUdWJlO1xyXG4gIH1cclxuXHJcbiAgc2V0U3R5bGVzKCkge1xyXG4gICAgbGV0IHN0eWxlID0ge1xyXG4gICAgICBjb2xvcjogdGhpcy5jb2xvclxyXG4gICAgfVxyXG4gICAgcmV0dXJuIHN0eWxlO1xyXG4gIH1cclxufVxyXG4iLCI8ZGl2IFtuZ0NsYXNzXT1cInsnaWNvbnMtd2hpdGUnOmFyZUljb25zSW5Gb290ZXIsICdpY29ucyc6IWFyZUljb25zSW5Gb290ZXJ9XCI+XHJcbiAgPGZhLWljb24gW2ljb25dPVwiWydmYWInLCAnbGlua2VkaW4taW4nXVwiIGNsYXNzPVwiaWNvbiBsaW5rZWRpblwiIChjbGljayk9XCJvbkNsaWNrTGlua2VkSW4oKVwiPjwvZmEtaWNvbj5cclxuICA8ZmEtaWNvbiBbaWNvbl09XCJbJ2ZhYicsICdpbnN0YWdyYW0nXVwiIGNsYXNzPVwiaWNvbiBpbnN0YWdyYW1cIiAoY2xpY2spPVwib25DbGlja0luc3RhZ3JhbSgpXCI+PC9mYS1pY29uPlxyXG4gIDxmYS1pY29uIFtpY29uXT1cIlsnZmFiJywgJ3lvdXR1YmUnXVwiIGNsYXNzPVwiaWNvbiB5b3V0dWJlXCIgKGNsaWNrKT1cIm9uQ2xpY2tZb3V0dWJlKClcIj48L2ZhLWljb24+XHJcbjwvZGl2PiJdfQ==
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export class socialMediaLinks {
|
|
2
|
+
linkedIn;
|
|
3
|
+
instagram;
|
|
4
|
+
youTube;
|
|
5
|
+
faceBook;
|
|
6
|
+
}
|
|
7
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic29jaWFsLW1lZGlhLWxpbmtzLm1vZGVsLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvam9vbGVyLXdlYnNpdGVzLXNoYXJlZC9zcmMvbGliL3NvY2lhbC1tZWRpYS1pY29ucy9zb2NpYWwtbWVkaWEtbGlua3MubW9kZWwudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsTUFBTSxPQUFPLGdCQUFnQjtJQUN6QixRQUFRLENBQVM7SUFDakIsU0FBUyxDQUFTO0lBQ2xCLE9BQU8sQ0FBUztJQUNoQixRQUFRLENBQVM7Q0FDcEIiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgY2xhc3Mgc29jaWFsTWVkaWFMaW5rcyB7XHJcbiAgICBsaW5rZWRJbjogc3RyaW5nO1xyXG4gICAgaW5zdGFncmFtOiBzdHJpbmc7XHJcbiAgICB5b3VUdWJlOiBzdHJpbmc7XHJcbiAgICBmYWNlQm9vazogc3RyaW5nO1xyXG59Il19
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { Component } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/material/dialog";
|
|
4
|
+
import * as i2 from "@angular/router";
|
|
5
|
+
import * as i3 from "@fortawesome/angular-fontawesome";
|
|
6
|
+
export class SuccessMessageDialogComponent {
|
|
7
|
+
dialogRef;
|
|
8
|
+
_Router;
|
|
9
|
+
constructor(dialogRef, _Router) {
|
|
10
|
+
this.dialogRef = dialogRef;
|
|
11
|
+
this._Router = _Router;
|
|
12
|
+
}
|
|
13
|
+
onClickSubmitAnotherForm() {
|
|
14
|
+
this.dialogRef.close();
|
|
15
|
+
this._Router.navigate(['/contact-us/contact-us-page']);
|
|
16
|
+
}
|
|
17
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuccessMessageDialogComponent, deps: [{ token: i1.MatDialogRef }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SuccessMessageDialogComponent, selector: "success-message-dialog", ngImport: i0, template: "<div class=\"page\">\r\n <span mat-dialog-title class=\"dialog-header\" mat-button>\r\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\r\n </span>\r\n\r\n <mat-dialog-content class=\"mat-typography\">\r\n <div class=\"success-icon\">\r\n <fa-icon icon=\"calendar-check\"></fa-icon>\r\n </div>\r\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\r\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\r\n </mat-dialog-content>\r\n <div class=\"divider\"></div>\r\n <mat-dialog-actions class=\"dialog-footer\">\r\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\r\n another form</span>\r\n </h3>\r\n </mat-dialog-actions>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{text-align:center}.page .mat-typography{padding:0 6rem 2rem;display:grid}.page .dialog-header{text-align:right;font-size:3rem;color:#686868;font-weight:900;padding:0 2rem}.page .success-icon{font-size:7rem;color:#12957e;margin-bottom:2rem}.page .title{color:#36393f;font-size:2.8rem;font-weight:700}.page .subtitle{justify-self:center;width:85%;font-size:2.2rem;font-weight:500;color:#494949}.page .divider{width:95%;border:.1rem solid #D8D8D8;margin:auto}.page .dialog-footer{padding:3rem 0rem;display:grid;justify-content:center}.page .dialog-footer h3{color:#494949;align-self:center;font-size:2.2rem}.page .link-text{color:#155ed4;cursor:pointer}\n"], dependencies: [{ kind: "component", type: i3.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }] });
|
|
19
|
+
}
|
|
20
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SuccessMessageDialogComponent, decorators: [{
|
|
21
|
+
type: Component,
|
|
22
|
+
args: [{ selector: 'success-message-dialog', template: "<div class=\"page\">\r\n <span mat-dialog-title class=\"dialog-header\" mat-button>\r\n <fa-icon icon=\"xmark\" mat-dialog-close></fa-icon>\r\n </span>\r\n\r\n <mat-dialog-content class=\"mat-typography\">\r\n <div class=\"success-icon\">\r\n <fa-icon icon=\"calendar-check\"></fa-icon>\r\n </div>\r\n <h2 class=\"title\">Thanks! your request has been submitted</h2>\r\n <h3 class=\"subtitle\">We have received your message, we'll reach out to you as soon as possible!</h3>\r\n </mat-dialog-content>\r\n <div class=\"divider\"></div>\r\n <mat-dialog-actions class=\"dialog-footer\">\r\n <h3>Still have any questions? <span class=\"link-text\" (click)=\"onClickSubmitAnotherForm()\">Submit\r\n another form</span>\r\n </h3>\r\n </mat-dialog-actions>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{text-align:center}.page .mat-typography{padding:0 6rem 2rem;display:grid}.page .dialog-header{text-align:right;font-size:3rem;color:#686868;font-weight:900;padding:0 2rem}.page .success-icon{font-size:7rem;color:#12957e;margin-bottom:2rem}.page .title{color:#36393f;font-size:2.8rem;font-weight:700}.page .subtitle{justify-self:center;width:85%;font-size:2.2rem;font-weight:500;color:#494949}.page .divider{width:95%;border:.1rem solid #D8D8D8;margin:auto}.page .dialog-footer{padding:3rem 0rem;display:grid;justify-content:center}.page .dialog-footer h3{color:#494949;align-self:center;font-size:2.2rem}.page .link-text{color:#155ed4;cursor:pointer}\n"] }]
|
|
23
|
+
}], ctorParameters: function () { return [{ type: i1.MatDialogRef }, { type: i2.Router }]; } });
|
|
24
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3VjY2Vzcy1tZXNzYWdlLWRpYWxvZy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9qb29sZXItd2Vic2l0ZXMtc2hhcmVkL3NyYy9saWIvc3VjY2Vzcy1tZXNzYWdlLWRpYWxvZy9zdWNjZXNzLW1lc3NhZ2UtZGlhbG9nLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi9zdWNjZXNzLW1lc3NhZ2UtZGlhbG9nL3N1Y2Nlc3MtbWVzc2FnZS1kaWFsb2cuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFTMUMsTUFBTSxPQUFPLDZCQUE2QjtJQUcvQjtJQUNDO0lBRlYsWUFDUyxTQUFzRCxFQUNyRCxPQUFlO1FBRGhCLGNBQVMsR0FBVCxTQUFTLENBQTZDO1FBQ3JELFlBQU8sR0FBUCxPQUFPLENBQVE7SUFDckIsQ0FBQztJQUVMLHdCQUF3QjtRQUN0QixJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQ3ZCLElBQUksQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLENBQUMsNkJBQTZCLENBQUMsQ0FBQyxDQUFDO0lBQ3pELENBQUM7d0dBVlUsNkJBQTZCOzRGQUE3Qiw2QkFBNkIsOERDVDFDLGd5QkFrQk07OzRGRFRPLDZCQUE2QjtrQkFMekMsU0FBUzsrQkFDRSx3QkFBd0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgTWF0RGlhbG9nUmVmIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZGlhbG9nJztcclxuaW1wb3J0IHsgUm91dGVyIH0gZnJvbSAnQGFuZ3VsYXIvcm91dGVyJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnc3VjY2Vzcy1tZXNzYWdlLWRpYWxvZycsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3N1Y2Nlc3MtbWVzc2FnZS1kaWFsb2cuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3N1Y2Nlc3MtbWVzc2FnZS1kaWFsb2cuY29tcG9uZW50LnNjc3MnXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgU3VjY2Vzc01lc3NhZ2VEaWFsb2dDb21wb25lbnQge1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIHB1YmxpYyBkaWFsb2dSZWY6IE1hdERpYWxvZ1JlZjxTdWNjZXNzTWVzc2FnZURpYWxvZ0NvbXBvbmVudD4sXHJcbiAgICBwcml2YXRlIF9Sb3V0ZXI6IFJvdXRlclxyXG4gICkgeyB9XHJcblxyXG4gIG9uQ2xpY2tTdWJtaXRBbm90aGVyRm9ybSgpIHtcclxuICAgIHRoaXMuZGlhbG9nUmVmLmNsb3NlKCk7XHJcbiAgICB0aGlzLl9Sb3V0ZXIubmF2aWdhdGUoWycvY29udGFjdC11cy9jb250YWN0LXVzLXBhZ2UnXSk7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJwYWdlXCI+XHJcbiAgPHNwYW4gbWF0LWRpYWxvZy10aXRsZSBjbGFzcz1cImRpYWxvZy1oZWFkZXJcIiBtYXQtYnV0dG9uPlxyXG4gICAgPGZhLWljb24gaWNvbj1cInhtYXJrXCIgbWF0LWRpYWxvZy1jbG9zZT48L2ZhLWljb24+XHJcbiAgPC9zcGFuPlxyXG5cclxuICA8bWF0LWRpYWxvZy1jb250ZW50IGNsYXNzPVwibWF0LXR5cG9ncmFwaHlcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJzdWNjZXNzLWljb25cIj5cclxuICAgICAgPGZhLWljb24gaWNvbj1cImNhbGVuZGFyLWNoZWNrXCI+PC9mYS1pY29uPlxyXG4gICAgPC9kaXY+XHJcbiAgICA8aDIgY2xhc3M9XCJ0aXRsZVwiPlRoYW5rcyEgeW91ciByZXF1ZXN0IGhhcyBiZWVuIHN1Ym1pdHRlZDwvaDI+XHJcbiAgICA8aDMgY2xhc3M9XCJzdWJ0aXRsZVwiPldlIGhhdmUgcmVjZWl2ZWQgeW91ciBtZXNzYWdlLCB3ZSdsbCByZWFjaCBvdXQgdG8geW91IGFzIHNvb24gYXMgcG9zc2libGUhPC9oMz5cclxuICA8L21hdC1kaWFsb2ctY29udGVudD5cclxuICA8ZGl2IGNsYXNzPVwiZGl2aWRlclwiPjwvZGl2PlxyXG4gIDxtYXQtZGlhbG9nLWFjdGlvbnMgY2xhc3M9XCJkaWFsb2ctZm9vdGVyXCI+XHJcbiAgICA8aDM+U3RpbGwgaGF2ZSBhbnkgcXVlc3Rpb25zPyA8c3BhbiBjbGFzcz1cImxpbmstdGV4dFwiIChjbGljayk9XCJvbkNsaWNrU3VibWl0QW5vdGhlckZvcm0oKVwiPlN1Ym1pdFxyXG4gICAgICAgIGFub3RoZXIgZm9ybTwvc3Bhbj5cclxuICAgIDwvaDM+XHJcbiAgPC9tYXQtZGlhbG9nLWFjdGlvbnM+XHJcbjwvZGl2PiJdfQ==
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/router";
|
|
4
|
+
import * as i2 from "@angular/cdk/layout";
|
|
5
|
+
import * as i3 from "@angular/common";
|
|
6
|
+
import * as i4 from "primeng/api";
|
|
7
|
+
import * as i5 from "primeng/carousel";
|
|
8
|
+
import * as i6 from "../section-title/section-title.component";
|
|
9
|
+
;
|
|
10
|
+
export class TeamComponent {
|
|
11
|
+
_router;
|
|
12
|
+
breakpointObserver;
|
|
13
|
+
sectionContent;
|
|
14
|
+
isTabletSize;
|
|
15
|
+
membersToShow;
|
|
16
|
+
scrollMemberNumber = 2;
|
|
17
|
+
constructor(_router, breakpointObserver) {
|
|
18
|
+
this._router = _router;
|
|
19
|
+
this.breakpointObserver = breakpointObserver;
|
|
20
|
+
}
|
|
21
|
+
ngOnInit() {
|
|
22
|
+
this.breakpointObserver.observe([
|
|
23
|
+
"(max-width: 1200px) and (min-width:851px)", "(max-width: 850px) and (min-width:601px)",
|
|
24
|
+
"(max-width: 600px)"
|
|
25
|
+
]).subscribe((result) => {
|
|
26
|
+
if (result.breakpoints['(max-width: 1200px) and (min-width:851px)']) {
|
|
27
|
+
this.isTabletSize = true;
|
|
28
|
+
this.membersToShow = 3;
|
|
29
|
+
}
|
|
30
|
+
else if (result.breakpoints['(max-width: 850px) and (min-width:601px)']) {
|
|
31
|
+
this.membersToShow = 2;
|
|
32
|
+
this.scrollMemberNumber = 2;
|
|
33
|
+
this.isTabletSize = true;
|
|
34
|
+
}
|
|
35
|
+
else if (result.breakpoints['(max-width: 600px)']) {
|
|
36
|
+
this.membersToShow = 1;
|
|
37
|
+
this.scrollMemberNumber = 1;
|
|
38
|
+
this.isTabletSize = true;
|
|
39
|
+
}
|
|
40
|
+
else {
|
|
41
|
+
this.isTabletSize = false;
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
onAddNewMember() {
|
|
46
|
+
this._router.navigate(['/team/new-member']);
|
|
47
|
+
}
|
|
48
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TeamComponent, deps: [{ token: i1.Router }, { token: i2.BreakpointObserver }], target: i0.ɵɵFactoryTarget.Component });
|
|
49
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TeamComponent, selector: "team", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"page\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\r\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\r\n <div class=\"image-container\">\r\n <img loading=\"lazy\" [src]=\"teamMember.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{teamMember.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{teamMember.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\r\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-member pTemplate=\"item\">\r\n <div class=\"member-card\">\r\n <div class=\"image-container\">\r\n <img loading=\"lazy\" [src]=\"member.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{member.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{member.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n <div class=\"caption-text\">\r\n {{sectionContent.caption}}\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{margin-top:3rem;padding:5%;display:grid;grid-template-rows:auto auto;row-gap:2rem;width:100%}.page .title{font-weight:700;font-size:3.2rem;width:80%;margin-left:4%}.page .cards{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.page .caption-text{font-weight:600;font-size:2rem;width:85%;text-align:center;margin:2rem auto;color:#155ed4}.page .member-card{place-self:center;height:27rem;width:22rem;padding:1rem;display:grid;transition:all .3s ease-in-out;border-radius:1rem}.page .member-card:hover{transition:all .2s ease-in-out}.page .member-card .image-container{display:grid;place-self:center;place-items:center;border-radius:1.5rem;overflow:hidden;width:100%;height:20rem}.page .member-card .image-container img{width:100%;height:100%;object-fit:cover}.page .member-card .member-information{justify-self:center;text-align:center}.page .member-card .member-information .name{font-weight:600;font-size:1.9rem;margin:auto;text-align:center}.page .member-card .member-information .position{font-weight:500;font-size:1.4rem}@media only screen and (max-width: 75em){.page{width:100%;display:block}.page .title{margin-bottom:1.8rem}.page .cards{display:block;width:100%}.page .member-card{width:22rem;margin:auto}.page .member-card .image-container{width:100%;height:100%;overflow:hidden}.page .member-card .image-container img{width:100%;height:100%}}@media only screen and (max-width: 37.5em){.page .member-card{width:23rem}}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#155ed4;width:2.7rem;transition:all ease-in-out .1s}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i5.Carousel, selector: "p-carousel", inputs: ["page", "numVisible", "numScroll", "responsiveOptions", "orientation", "verticalViewPortHeight", "contentClass", "indicatorsContentClass", "indicatorsContentStyle", "indicatorStyleClass", "indicatorStyle", "value", "circular", "showIndicators", "showNavigators", "autoplayInterval", "style", "styleClass"], outputs: ["onPage"] }, { kind: "component", type: i6.SectionTitleComponent, selector: "section-title", inputs: ["sectionTitle", "withoutTitleCase", "descriptionWidth"] }] });
|
|
50
|
+
}
|
|
51
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TeamComponent, decorators: [{
|
|
52
|
+
type: Component,
|
|
53
|
+
args: [{ selector: 'team', template: "<div class=\"page\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\" ></section-title>\r\n <div class=\"cards\" *ngIf=\"!isTabletSize\">\r\n <div class=\"member-card\" *ngFor=\"let teamMember of sectionContent.teamMembers\">\r\n <div class=\"image-container\">\r\n <img loading=\"lazy\" [src]=\"teamMember.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{teamMember.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{teamMember.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"cards\" *ngIf=\"isTabletSize\">\r\n <p-carousel class=\"custom\" [value]=\"sectionContent.teamMembers\" [numVisible]='membersToShow'\r\n [numScroll]='scrollMemberNumber' [page]=\"0\" orientation=\"horizontal\" [circular]=\"true\">\r\n <ng-template let-member pTemplate=\"item\">\r\n <div class=\"member-card\">\r\n <div class=\"image-container\">\r\n <img loading=\"lazy\" [src]=\"member.profilePicture\">\r\n </div>\r\n <div class=\"member-information\">\r\n <div class=\"name\">\r\n {{member.fullName}}\r\n </div>\r\n <div class=\"position\">\r\n {{member.position}}\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </p-carousel>\r\n </div>\r\n <div class=\"caption-text\">\r\n {{sectionContent.caption}}\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{margin-top:3rem;padding:5%;display:grid;grid-template-rows:auto auto;row-gap:2rem;width:100%}.page .title{font-weight:700;font-size:3.2rem;width:80%;margin-left:4%}.page .cards{display:flex;flex-wrap:wrap;justify-content:center;gap:2rem}.page .caption-text{font-weight:600;font-size:2rem;width:85%;text-align:center;margin:2rem auto;color:#155ed4}.page .member-card{place-self:center;height:27rem;width:22rem;padding:1rem;display:grid;transition:all .3s ease-in-out;border-radius:1rem}.page .member-card:hover{transition:all .2s ease-in-out}.page .member-card .image-container{display:grid;place-self:center;place-items:center;border-radius:1.5rem;overflow:hidden;width:100%;height:20rem}.page .member-card .image-container img{width:100%;height:100%;object-fit:cover}.page .member-card .member-information{justify-self:center;text-align:center}.page .member-card .member-information .name{font-weight:600;font-size:1.9rem;margin:auto;text-align:center}.page .member-card .member-information .position{font-weight:500;font-size:1.4rem}@media only screen and (max-width: 75em){.page{width:100%;display:block}.page .title{margin-bottom:1.8rem}.page .cards{display:block;width:100%}.page .member-card{width:22rem;margin:auto}.page .member-card .image-container{width:100%;height:100%;overflow:hidden}.page .member-card .image-container img{width:100%;height:100%}}@media only screen and (max-width: 37.5em){.page .member-card{width:23rem}}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator.p-highlight button{background-color:#155ed4;width:2.7rem;transition:all ease-in-out .1s}::ng-deep .p-carousel .p-carousel-indicators .p-carousel-indicator button{border-radius:1rem;width:.8rem;height:.8rem;transition:all ease-in-out .5s}\n"] }]
|
|
54
|
+
}], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.BreakpointObserver }]; }, propDecorators: { sectionContent: [{
|
|
55
|
+
type: Input
|
|
56
|
+
}] } });
|
|
57
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGVhbS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9qb29sZXItd2Vic2l0ZXMtc2hhcmVkL3NyYy9saWIvdGVhbS90ZWFtLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi90ZWFtL3RlYW0uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBVSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7Ozs7O0FBRWhCLENBQUM7QUFRMUMsTUFBTSxPQUFPLGFBQWE7SUFPZDtJQUNBO0lBUEQsY0FBYyxDQUFjO0lBQ3JDLFlBQVksQ0FBVTtJQUN0QixhQUFhLENBQVM7SUFDdEIsa0JBQWtCLEdBQVcsQ0FBQyxDQUFDO0lBRS9CLFlBQ1UsT0FBZSxFQUNmLGtCQUFzQztRQUR0QyxZQUFPLEdBQVAsT0FBTyxDQUFRO1FBQ2YsdUJBQWtCLEdBQWxCLGtCQUFrQixDQUFvQjtJQUM1QyxDQUFDO0lBRUwsUUFBUTtRQUNOLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxPQUFPLENBQUM7WUFDOUIsMkNBQTJDLEVBQUUsMENBQTBDO1lBQ3ZGLG9CQUFvQjtTQUNyQixDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsTUFBdUIsRUFBRSxFQUFFO1lBQ3ZDLElBQUksTUFBTSxDQUFDLFdBQVcsQ0FBQywyQ0FBMkMsQ0FBQyxFQUFFO2dCQUNuRSxJQUFJLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQztnQkFDekIsSUFBSSxDQUFDLGFBQWEsR0FBRyxDQUFDLENBQUM7YUFDeEI7aUJBQ0ksSUFBSSxNQUFNLENBQUMsV0FBVyxDQUFDLDBDQUEwQyxDQUFDLEVBQUU7Z0JBQ3ZFLElBQUksQ0FBQyxhQUFhLEdBQUcsQ0FBQyxDQUFDO2dCQUN2QixJQUFJLENBQUMsa0JBQWtCLEdBQUcsQ0FBQyxDQUFDO2dCQUM1QixJQUFJLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQzthQUMxQjtpQkFDSSxJQUFJLE1BQU0sQ0FBQyxXQUFXLENBQUMsb0JBQW9CLENBQUMsRUFBRTtnQkFDakQsSUFBSSxDQUFDLGFBQWEsR0FBRyxDQUFDLENBQUM7Z0JBQ3ZCLElBQUksQ0FBQyxrQkFBa0IsR0FBRyxDQUFDLENBQUM7Z0JBQzVCLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO2FBQzFCO2lCQUNJO2dCQUNILElBQUksQ0FBQyxZQUFZLEdBQUcsS0FBSyxDQUFDO2FBQzNCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQsY0FBYztRQUNaLElBQUksQ0FBQyxPQUFPLENBQUMsUUFBUSxDQUFDLENBQUMsa0JBQWtCLENBQUMsQ0FBQyxDQUFDO0lBQzlDLENBQUM7d0dBdENVLGFBQWE7NEZBQWIsYUFBYSwwRkNWMUIsdXlEQXdDTTs7NEZEOUJPLGFBQWE7a0JBTHpCLFNBQVM7K0JBQ0UsTUFBTTs4SEFLUCxjQUFjO3NCQUF0QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEJyZWFrcG9pbnRPYnNlcnZlciwgQnJlYWtwb2ludFN0YXRlIH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2xheW91dCc7XHJcbmltcG9ydCB7IFJvdXRlciB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7O1xyXG5pbXBvcnQgeyBUZWFtU2VjdGlvbiB9IGZyb20gJy4uL21vZGVscy90ZWFtLXNlY3Rpb24ubW9kZWwnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICd0ZWFtJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vdGVhbS5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vdGVhbS5jb21wb25lbnQuc2NzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBUZWFtQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICBASW5wdXQoKSBzZWN0aW9uQ29udGVudDogVGVhbVNlY3Rpb247XHJcbiAgaXNUYWJsZXRTaXplOiBib29sZWFuO1xyXG4gIG1lbWJlcnNUb1Nob3c6IG51bWJlcjtcclxuICBzY3JvbGxNZW1iZXJOdW1iZXI6IG51bWJlciA9IDI7XHJcblxyXG4gIGNvbnN0cnVjdG9yKFxyXG4gICAgcHJpdmF0ZSBfcm91dGVyOiBSb3V0ZXIsXHJcbiAgICBwcml2YXRlIGJyZWFrcG9pbnRPYnNlcnZlcjogQnJlYWtwb2ludE9ic2VydmVyLFxyXG4gICkgeyB9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gICAgdGhpcy5icmVha3BvaW50T2JzZXJ2ZXIub2JzZXJ2ZShbXHJcbiAgICAgIFwiKG1heC13aWR0aDogMTIwMHB4KSBhbmQgKG1pbi13aWR0aDo4NTFweClcIiwgXCIobWF4LXdpZHRoOiA4NTBweCkgYW5kIChtaW4td2lkdGg6NjAxcHgpXCIsXHJcbiAgICAgIFwiKG1heC13aWR0aDogNjAwcHgpXCJcclxuICAgIF0pLnN1YnNjcmliZSgocmVzdWx0OiBCcmVha3BvaW50U3RhdGUpID0+IHtcclxuICAgICAgaWYgKHJlc3VsdC5icmVha3BvaW50c1snKG1heC13aWR0aDogMTIwMHB4KSBhbmQgKG1pbi13aWR0aDo4NTFweCknXSkge1xyXG4gICAgICAgIHRoaXMuaXNUYWJsZXRTaXplID0gdHJ1ZTtcclxuICAgICAgICB0aGlzLm1lbWJlcnNUb1Nob3cgPSAzO1xyXG4gICAgICB9XHJcbiAgICAgIGVsc2UgaWYgKHJlc3VsdC5icmVha3BvaW50c1snKG1heC13aWR0aDogODUwcHgpIGFuZCAobWluLXdpZHRoOjYwMXB4KSddKSB7XHJcbiAgICAgICAgdGhpcy5tZW1iZXJzVG9TaG93ID0gMjtcclxuICAgICAgICB0aGlzLnNjcm9sbE1lbWJlck51bWJlciA9IDI7XHJcbiAgICAgICAgdGhpcy5pc1RhYmxldFNpemUgPSB0cnVlO1xyXG4gICAgICB9XHJcbiAgICAgIGVsc2UgaWYgKHJlc3VsdC5icmVha3BvaW50c1snKG1heC13aWR0aDogNjAwcHgpJ10pIHtcclxuICAgICAgICB0aGlzLm1lbWJlcnNUb1Nob3cgPSAxO1xyXG4gICAgICAgIHRoaXMuc2Nyb2xsTWVtYmVyTnVtYmVyID0gMTtcclxuICAgICAgICB0aGlzLmlzVGFibGV0U2l6ZSA9IHRydWU7XHJcbiAgICAgIH1cclxuICAgICAgZWxzZSB7XHJcbiAgICAgICAgdGhpcy5pc1RhYmxldFNpemUgPSBmYWxzZTtcclxuICAgICAgfVxyXG4gICAgfSk7XHJcbiAgfVxyXG5cclxuICBvbkFkZE5ld01lbWJlcigpIHtcclxuICAgIHRoaXMuX3JvdXRlci5uYXZpZ2F0ZShbJy90ZWFtL25ldy1tZW1iZXInXSk7XHJcbiAgfVxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJwYWdlXCI+XHJcbiAgICA8c2VjdGlvbi10aXRsZSBbc2VjdGlvblRpdGxlXT1cInNlY3Rpb25Db250ZW50LnNlY3Rpb25UaXRsZVwiID48L3NlY3Rpb24tdGl0bGU+XHJcbiAgICA8ZGl2IGNsYXNzPVwiY2FyZHNcIiAqbmdJZj1cIiFpc1RhYmxldFNpemVcIj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwibWVtYmVyLWNhcmRcIiAqbmdGb3I9XCJsZXQgdGVhbU1lbWJlciBvZiBzZWN0aW9uQ29udGVudC50ZWFtTWVtYmVyc1wiPlxyXG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaW1hZ2UtY29udGFpbmVyXCI+XHJcbiAgICAgICAgICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJ0ZWFtTWVtYmVyLnByb2ZpbGVQaWN0dXJlXCI+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwibWVtYmVyLWluZm9ybWF0aW9uXCI+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwibmFtZVwiPlxyXG4gICAgICAgICAgICAgICAgICAgIHt7dGVhbU1lbWJlci5mdWxsTmFtZX19XHJcbiAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJwb3NpdGlvblwiPlxyXG4gICAgICAgICAgICAgICAgICAgIHt7dGVhbU1lbWJlci5wb3NpdGlvbn19XHJcbiAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJjYXJkc1wiICpuZ0lmPVwiaXNUYWJsZXRTaXplXCI+XHJcbiAgICAgICAgPHAtY2Fyb3VzZWwgY2xhc3M9XCJjdXN0b21cIiBbdmFsdWVdPVwic2VjdGlvbkNvbnRlbnQudGVhbU1lbWJlcnNcIiBbbnVtVmlzaWJsZV09J21lbWJlcnNUb1Nob3cnXHJcbiAgICAgICAgICAgIFtudW1TY3JvbGxdPSdzY3JvbGxNZW1iZXJOdW1iZXInIFtwYWdlXT1cIjBcIiBvcmllbnRhdGlvbj1cImhvcml6b250YWxcIiBbY2lyY3VsYXJdPVwidHJ1ZVwiPlxyXG4gICAgICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW1lbWJlciBwVGVtcGxhdGU9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwibWVtYmVyLWNhcmRcIj5cclxuICAgICAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaW1hZ2UtY29udGFpbmVyXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIDxpbWcgbG9hZGluZz1cImxhenlcIiBbc3JjXT1cIm1lbWJlci5wcm9maWxlUGljdHVyZVwiPlxyXG4gICAgICAgICAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJtZW1iZXItaW5mb3JtYXRpb25cIj5cclxuICAgICAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cIm5hbWVcIj5cclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHt7bWVtYmVyLmZ1bGxOYW1lfX1cclxuICAgICAgICAgICAgICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJwb3NpdGlvblwiPlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAge3ttZW1iZXIucG9zaXRpb259fVxyXG4gICAgICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgICAgIDwvcC1jYXJvdXNlbD5cclxuICAgIDwvZGl2PlxyXG4gICAgPGRpdiBjbGFzcz1cImNhcHRpb24tdGV4dFwiPlxyXG4gICAgICAgIHt7c2VjdGlvbkNvbnRlbnQuY2FwdGlvbn19XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+Il19
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@fortawesome/angular-fontawesome";
|
|
4
|
+
import * as i2 from "@angular/common";
|
|
5
|
+
export class ValuePropCardComponent {
|
|
6
|
+
valuePropContent;
|
|
7
|
+
cardOnHover;
|
|
8
|
+
icon;
|
|
9
|
+
ngOnInit() {
|
|
10
|
+
if (this.valuePropContent.iconName) {
|
|
11
|
+
this.icon = this.valuePropContent.iconName;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValuePropCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ValuePropCardComponent, selector: "value-prop-card", inputs: { valuePropContent: "valuePropContent", cardOnHover: "cardOnHover" }, ngImport: i0, template: "<div class=\"reason-block\" [ngClass]=\"{'card-on-hover':cardOnHover , 'constant-card': !cardOnHover}\">\r\n <div class=\"reason-headline\">\r\n <div class=\"reason-icon\" *ngIf=\"icon\">\r\n <fa-icon [icon]=\"icon\"></fa-icon>\r\n </div>\r\n <div class=\"reason-image\" *ngIf=\"!icon\">\r\n <img loading=\"lazy\" [src]=\"valuePropContent.image\" alt=\"\">\r\n </div>\r\n <div class=\"reason-title\">\r\n {{valuePropContent.title}}\r\n </div>\r\n </div>\r\n <div class=\"reason-desc\">\r\n {{valuePropContent.description}}\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.card-on-hover:hover{background-color:#f7f8f9;box-shadow:.2rem .2rem .4rem #00000040}.constant-card{background-color:#fff;box-shadow:.2rem .2rem .4rem #00000040}.reason-block{transition:all ease-in-out .2s;border-radius:2rem;padding:.5rem 2rem 2rem;background-color:#fff;color:#32353b;font-weight:400;font-size:1.6rem;margin:1rem 1rem 2rem;display:inline-block;height:95%;width:100%}.reason-block .reason-headline{display:flex;flex-direction:row;column-gap:2rem;padding:1.5rem 0rem;align-items:center}.reason-block .reason-headline .reason-icon{color:#155ed4;font-size:3rem}.reason-block .reason-headline .reason-image img{width:4rem;aspect-ratio:3/2;object-fit:contain}.reason-block .reason-headline .reason-title{color:#32353b;font-weight:600;font-size:2rem}.reason-block .reason-title,.reason-block .reason-desc{font-family:inherit}.reason-block .reason-desc{font-weight:300}@media only screen and (max-width: 37.5em){.reason-block{height:93%;width:95%}}\n"], dependencies: [{ kind: "component", type: 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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
16
|
+
}
|
|
17
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValuePropCardComponent, decorators: [{
|
|
18
|
+
type: Component,
|
|
19
|
+
args: [{ selector: 'value-prop-card', template: "<div class=\"reason-block\" [ngClass]=\"{'card-on-hover':cardOnHover , 'constant-card': !cardOnHover}\">\r\n <div class=\"reason-headline\">\r\n <div class=\"reason-icon\" *ngIf=\"icon\">\r\n <fa-icon [icon]=\"icon\"></fa-icon>\r\n </div>\r\n <div class=\"reason-image\" *ngIf=\"!icon\">\r\n <img loading=\"lazy\" [src]=\"valuePropContent.image\" alt=\"\">\r\n </div>\r\n <div class=\"reason-title\">\r\n {{valuePropContent.title}}\r\n </div>\r\n </div>\r\n <div class=\"reason-desc\">\r\n {{valuePropContent.description}}\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.card-on-hover:hover{background-color:#f7f8f9;box-shadow:.2rem .2rem .4rem #00000040}.constant-card{background-color:#fff;box-shadow:.2rem .2rem .4rem #00000040}.reason-block{transition:all ease-in-out .2s;border-radius:2rem;padding:.5rem 2rem 2rem;background-color:#fff;color:#32353b;font-weight:400;font-size:1.6rem;margin:1rem 1rem 2rem;display:inline-block;height:95%;width:100%}.reason-block .reason-headline{display:flex;flex-direction:row;column-gap:2rem;padding:1.5rem 0rem;align-items:center}.reason-block .reason-headline .reason-icon{color:#155ed4;font-size:3rem}.reason-block .reason-headline .reason-image img{width:4rem;aspect-ratio:3/2;object-fit:contain}.reason-block .reason-headline .reason-title{color:#32353b;font-weight:600;font-size:2rem}.reason-block .reason-title,.reason-block .reason-desc{font-family:inherit}.reason-block .reason-desc{font-weight:300}@media only screen and (max-width: 37.5em){.reason-block{height:93%;width:95%}}\n"] }]
|
|
20
|
+
}], propDecorators: { valuePropContent: [{
|
|
21
|
+
type: Input
|
|
22
|
+
}], cardOnHover: [{
|
|
23
|
+
type: Input
|
|
24
|
+
}] } });
|
|
25
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmFsdWUtcHJvcC1jYXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92YWx1ZS1wcm9wLWNhcmQvdmFsdWUtcHJvcC1jYXJkLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92YWx1ZS1wcm9wLWNhcmQvdmFsdWUtcHJvcC1jYXJkLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFVLE1BQU0sZUFBZSxDQUFDOzs7O0FBU3pELE1BQU0sT0FBTyxzQkFBc0I7SUFDeEIsZ0JBQWdCLENBQXNCO0lBQ3RDLFdBQVcsQ0FBVTtJQUM5QixJQUFJLENBQVc7SUFFZixRQUFRO1FBQ04sSUFBSSxJQUFJLENBQUMsZ0JBQWdCLENBQUMsUUFBUSxFQUFFO1lBQ2xDLElBQUksQ0FBQyxJQUFJLEdBQUcsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFFBQW9CLENBQUM7U0FDeEQ7SUFDSCxDQUFDO3dHQVRVLHNCQUFzQjs0RkFBdEIsc0JBQXNCLHFJQ1RuQywrbkJBZU07OzRGRE5PLHNCQUFzQjtrQkFMbEMsU0FBUzsrQkFDRSxpQkFBaUI7OEJBS2xCLGdCQUFnQjtzQkFBeEIsS0FBSztnQkFDRyxXQUFXO3NCQUFuQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEljb25OYW1lIH0gZnJvbSAnQGZvcnRhd2Vzb21lL2ZvbnRhd2Vzb21lLXN2Zy1jb3JlJztcclxuaW1wb3J0IHsgVmFsdWVQcm9wUHJvcGVydGllcyB9IGZyb20gJ0Bqb29sZXIvam9vbGVyLXdlYnNpdGVzLXNoYXJlZCc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3ZhbHVlLXByb3AtY2FyZCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL3ZhbHVlLXByb3AtY2FyZC5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vdmFsdWUtcHJvcC1jYXJkLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFZhbHVlUHJvcENhcmRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHZhbHVlUHJvcENvbnRlbnQ6IFZhbHVlUHJvcFByb3BlcnRpZXM7XHJcbiAgQElucHV0KCkgY2FyZE9uSG92ZXI6IGJvb2xlYW47XHJcbiAgaWNvbjogSWNvbk5hbWU7XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgaWYgKHRoaXMudmFsdWVQcm9wQ29udGVudC5pY29uTmFtZSkge1xyXG4gICAgICB0aGlzLmljb24gPSB0aGlzLnZhbHVlUHJvcENvbnRlbnQuaWNvbk5hbWUgYXMgSWNvbk5hbWU7XHJcbiAgICB9XHJcbiAgfVxyXG59IiwiPGRpdiBjbGFzcz1cInJlYXNvbi1ibG9ja1wiIFtuZ0NsYXNzXT1cInsnY2FyZC1vbi1ob3Zlcic6Y2FyZE9uSG92ZXIgLCAnY29uc3RhbnQtY2FyZCc6ICFjYXJkT25Ib3Zlcn1cIj5cclxuICAgIDxkaXYgY2xhc3M9XCJyZWFzb24taGVhZGxpbmVcIj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwicmVhc29uLWljb25cIiAqbmdJZj1cImljb25cIj5cclxuICAgICAgICAgICAgPGZhLWljb24gW2ljb25dPVwiaWNvblwiPjwvZmEtaWNvbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwicmVhc29uLWltYWdlXCIgKm5nSWY9XCIhaWNvblwiPlxyXG4gICAgICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJ2YWx1ZVByb3BDb250ZW50LmltYWdlXCIgYWx0PVwiXCI+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cInJlYXNvbi10aXRsZVwiPlxyXG4gICAgICAgICAgICB7e3ZhbHVlUHJvcENvbnRlbnQudGl0bGV9fVxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbiAgICA8ZGl2IGNsYXNzPVwicmVhc29uLWRlc2NcIj5cclxuICAgICAgICB7e3ZhbHVlUHJvcENvbnRlbnQuZGVzY3JpcHRpb259fVxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PiJdfQ==
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { Component, Input } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
import * as i1 from "@fortawesome/angular-fontawesome";
|
|
4
|
+
import * as i2 from "@angular/common";
|
|
5
|
+
import * as i3 from "../section-title/section-title.component";
|
|
6
|
+
export class ValuePropsSectionComponent {
|
|
7
|
+
sectionContent;
|
|
8
|
+
selectedImage;
|
|
9
|
+
constructor() { }
|
|
10
|
+
ngOnInit() {
|
|
11
|
+
let i = 0;
|
|
12
|
+
this.selectedImage = this.sectionContent.paragraphs[0].imagePath;
|
|
13
|
+
i++;
|
|
14
|
+
for (let paragraph of this.sectionContent.paragraphs) {
|
|
15
|
+
paragraph.isClicked = false;
|
|
16
|
+
}
|
|
17
|
+
this.sectionContent.paragraphs[0].isClicked = true;
|
|
18
|
+
}
|
|
19
|
+
onChangeImage(imagePath, paragraphIndex) {
|
|
20
|
+
for (let paragraph of this.sectionContent.paragraphs) {
|
|
21
|
+
paragraph.isClicked = false;
|
|
22
|
+
}
|
|
23
|
+
this.selectedImage = imagePath;
|
|
24
|
+
this.sectionContent.paragraphs[paragraphIndex].isClicked = true;
|
|
25
|
+
}
|
|
26
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValuePropsSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
27
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ValuePropsSectionComponent, selector: "value-props-section", inputs: { sectionContent: "sectionContent" }, ngImport: i0, template: "<div class=\"value-prop\" [ngClass]=\"{'image-text-sort': sectionContent.paragraphProperties.onRightSide , 'text-image-sort': !sectionContent.paragraphProperties.onRightSide ,'paragraph-with-card':sectionContent.paragraphProperties.withCard }\">\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\r\n </section-title>\r\n <div class=\"value-prop-image\">\r\n <img loading=\"lazy\" [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n <div class=\"paragraph-items\">\r\n <p *ngFor=\"let paragraph of sectionContent.paragraphs; let j = index\" class=\"paragraph\" (click)=\"onChangeImage(paragraph.imagePath ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked, 'one-paragraph':sectionContent.paragraphs.length == 1}\">\r\n <span class=\"value-prop-icon\">\r\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\r\n <span class=\"paragraph-text\">\r\n {{paragraph.text}}\r\n </span>\r\n </p>\r\n </div>\r\n </div>\r\n <div class=\"image-buttons-side\">\r\n <img loading=\"lazy\" [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;justify-content:space-between;column-gap:2%;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:58%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;display:grid;grid-template-columns:5rem auto auto;margin:0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem;width:40rem;height:-moz-fit-content;height:fit-content}@media only screen and (max-width: 725px){.value-prop .text-side .paragraph{width:100%;height:auto;padding:2rem 1rem}}.value-prop .text-side .paragraph:hover .paragraph-text,.value-prop .text-side .paragraph:hover .value-prop-icon{color:#32353b}.value-prop .text-side .paragraph .paragraph-text{color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .one-paragraph{width:100%}.value-prop .text-side .selected-paragraph .paragraph-text{color:#32353b}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.value-prop .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:40%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(2n){flex-direction:row}.value-prop:nth-child(2n) .image-buttons-side{justify-self:center}.value-prop .text-side{justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}.image-text-sort{flex-direction:row-reverse}@media only screen and (max-width: 56.25em){.image-text-sort:nth-child(2n) .image-buttons-side{justify-self:center}}.text-image-sort{flex-direction:row}.paragraph-with-card .text-side .paragraph{padding:1rem;margin:1rem 0rem;border-radius:.7rem;border:.2rem solid rgba(50,53,59,.1);min-height:max-content;height:15rem}.paragraph-with-card .text-side .paragraph:hover{border:.2rem solid #32353b}.paragraph-with-card .text-side .paragraph .value-prop-icon{text-align:center}.paragraph-with-card .text-side .selected-paragraph{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph .paragraph-text{color:#32353b}.paragraph-with-card .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.paragraph-with-card .text-side .selected-paragraph:hover{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4}\n"], dependencies: [{ kind: "component", type: 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: ["sectionTitle", "withoutTitleCase", "descriptionWidth"] }] });
|
|
28
|
+
}
|
|
29
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ValuePropsSectionComponent, decorators: [{
|
|
30
|
+
type: Component,
|
|
31
|
+
args: [{ selector: 'value-props-section', template: "<div class=\"value-prop\" [ngClass]=\"{'image-text-sort': sectionContent.paragraphProperties.onRightSide , 'text-image-sort': !sectionContent.paragraphProperties.onRightSide ,'paragraph-with-card':sectionContent.paragraphProperties.withCard }\">\r\n <div class=\"text-side\">\r\n <section-title [sectionTitle]=\"sectionContent.sectionTitle\">\r\n </section-title>\r\n <div class=\"value-prop-image\">\r\n <img loading=\"lazy\" [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n <div class=\"paragraph-items\">\r\n <p *ngFor=\"let paragraph of sectionContent.paragraphs; let j = index\" class=\"paragraph\" (click)=\"onChangeImage(paragraph.imagePath ,j)\" [ngClass]=\"{'selected-paragraph':paragraph.isClicked, 'one-paragraph':sectionContent.paragraphs.length == 1}\">\r\n <span class=\"value-prop-icon\">\r\n <fa-icon [icon]=\"paragraph.iconName\"></fa-icon></span>\r\n <span class=\"paragraph-text\">\r\n {{paragraph.text}}\r\n </span>\r\n </p>\r\n </div>\r\n </div>\r\n <div class=\"image-buttons-side\">\r\n <img loading=\"lazy\" [src]=\"selectedImage\" alt=\"\">\r\n </div>\r\n</div>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-size:1.6rem;font-family:inherit}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.value-prop{display:flex;justify-content:space-between;column-gap:2%;width:100%}.value-prop .text-side{display:grid;row-gap:1rem;width:58%;padding:2rem 0rem}.value-prop .text-side .value-prop-image{display:none}.value-prop .text-side .paragraph-items{display:flex;flex-wrap:wrap;flex-direction:row;column-gap:1rem}.value-prop .text-side .paragraph{box-sizing:border-box;display:grid;grid-template-columns:5rem auto auto;margin:0rem;align-content:center;align-self:start;cursor:pointer;transition:all ease-in-out .2s;border-radius:1.5rem;column-gap:.5rem;width:40rem;height:-moz-fit-content;height:fit-content}@media only screen and (max-width: 725px){.value-prop .text-side .paragraph{width:100%;height:auto;padding:2rem 1rem}}.value-prop .text-side .paragraph:hover .paragraph-text,.value-prop .text-side .paragraph:hover .value-prop-icon{color:#32353b}.value-prop .text-side .paragraph .paragraph-text{color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon{display:grid;align-content:center;color:#32353b99;transition:all ease-in-out .2s}.value-prop .text-side .paragraph .value-prop-icon fa-icon{font-size:3rem}.value-prop .text-side .one-paragraph{width:100%}.value-prop .text-side .selected-paragraph .paragraph-text{color:#32353b}.value-prop .text-side .selected-paragraph .cta-icon{transform:rotate(0)}.value-prop .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.value-prop .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4;background-color:#fff}.value-prop .image-buttons-side{width:40%;display:grid;align-content:center}.value-prop .image-buttons-side img{width:100%;height:42rem;object-fit:cover;border-radius:1rem}@media only screen and (max-width: 56.25em){.value-prop{flex-wrap:wrap}.value-prop:nth-child(2n){flex-direction:row}.value-prop:nth-child(2n) .image-buttons-side{justify-self:center}.value-prop .text-side{justify-self:left}.value-prop .text-side .value-prop-image{display:grid;width:100%}.value-prop .text-side .value-prop-image img{width:100%;height:35rem;object-fit:cover;border-radius:1rem}.value-prop .image-buttons-side{display:none}}@media only screen and (max-width: 37.5em){.value-prop .text-side .paragraph-items{column-count:1}}.image-text-sort{flex-direction:row-reverse}@media only screen and (max-width: 56.25em){.image-text-sort:nth-child(2n) .image-buttons-side{justify-self:center}}.text-image-sort{flex-direction:row}.paragraph-with-card .text-side .paragraph{padding:1rem;margin:1rem 0rem;border-radius:.7rem;border:.2rem solid rgba(50,53,59,.1);min-height:max-content;height:15rem}.paragraph-with-card .text-side .paragraph:hover{border:.2rem solid #32353b}.paragraph-with-card .text-side .paragraph .value-prop-icon{text-align:center}.paragraph-with-card .text-side .selected-paragraph{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph .paragraph-text{color:#32353b}.paragraph-with-card .text-side .selected-paragraph .value-prop-icon{color:#155ed4}.paragraph-with-card .text-side .selected-paragraph:hover{border:.2rem solid #155ed4}.paragraph-with-card .text-side .selected-paragraph:hover .value-prop-icon{color:#155ed4}\n"] }]
|
|
32
|
+
}], ctorParameters: function () { return []; }, propDecorators: { sectionContent: [{
|
|
33
|
+
type: Input
|
|
34
|
+
}] } });
|
|
35
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidmFsdWUtcHJvcHMtc2VjdGlvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9qb29sZXItd2Vic2l0ZXMtc2hhcmVkL3NyYy9saWIvdmFsdWUtcHJvcHMtc2VjdGlvbi92YWx1ZS1wcm9wcy1zZWN0aW9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2pvb2xlci13ZWJzaXRlcy1zaGFyZWQvc3JjL2xpYi92YWx1ZS1wcm9wcy1zZWN0aW9uL3ZhbHVlLXByb3BzLXNlY3Rpb24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQVUsTUFBTSxlQUFlLENBQUM7Ozs7O0FBT3pELE1BQU0sT0FBTywwQkFBMEI7SUFDNUIsY0FBYyxDQUFNO0lBQzdCLGFBQWEsQ0FBTTtJQUNuQixnQkFBZ0IsQ0FBQztJQUVqQixRQUFRO1FBQ04sSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO1FBQ1YsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDLFVBQVUsQ0FBRSxDQUFDLENBQUUsQ0FBQyxTQUFTLENBQUM7UUFDbkUsQ0FBQyxFQUFFLENBQUM7UUFDSixLQUFLLElBQUksU0FBUyxJQUFJLElBQUksQ0FBQyxjQUFjLENBQUMsVUFBVSxFQUFFO1lBQ3BELFNBQVMsQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO1NBQzdCO1FBQ0QsSUFBSSxDQUFDLGNBQWMsQ0FBQyxVQUFVLENBQUUsQ0FBQyxDQUFFLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQztJQUV2RCxDQUFDO0lBRUQsYUFBYSxDQUFDLFNBQVMsRUFBRSxjQUFjO1FBQ3JDLEtBQUssSUFBSSxTQUFTLElBQUksSUFBSSxDQUFDLGNBQWMsQ0FBQyxVQUFVLEVBQUU7WUFDcEQsU0FBUyxDQUFDLFNBQVMsR0FBRyxLQUFLLENBQUM7U0FDN0I7UUFDRCxJQUFJLENBQUMsYUFBYSxHQUFHLFNBQVMsQ0FBQztRQUMvQixJQUFJLENBQUMsY0FBYyxDQUFDLFVBQVUsQ0FBRSxjQUFjLENBQUUsQ0FBQyxTQUFTLEdBQUcsSUFBSSxDQUFDO0lBQ3BFLENBQUM7d0dBdEJVLDBCQUEwQjs0RkFBMUIsMEJBQTBCLHlHQ1B2QyxpdkNBb0JNOzs0RkRiTywwQkFBMEI7a0JBTHRDLFNBQVM7K0JBQ0UscUJBQXFCOzBFQUt0QixjQUFjO3NCQUF0QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3ZhbHVlLXByb3BzLXNlY3Rpb24nLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi92YWx1ZS1wcm9wcy1zZWN0aW9uLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsgJy4vdmFsdWUtcHJvcHMtc2VjdGlvbi5jb21wb25lbnQuc2NzcycgXVxyXG59KVxyXG5leHBvcnQgY2xhc3MgVmFsdWVQcm9wc1NlY3Rpb25Db21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBJbnB1dCgpIHNlY3Rpb25Db250ZW50OiBhbnk7XHJcbiAgc2VsZWN0ZWRJbWFnZTogYW55O1xyXG4gIGNvbnN0cnVjdG9yKCkgeyB9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gICAgbGV0IGkgPSAwO1xyXG4gICAgdGhpcy5zZWxlY3RlZEltYWdlID0gdGhpcy5zZWN0aW9uQ29udGVudC5wYXJhZ3JhcGhzWyAwIF0uaW1hZ2VQYXRoO1xyXG4gICAgaSsrO1xyXG4gICAgZm9yIChsZXQgcGFyYWdyYXBoIG9mIHRoaXMuc2VjdGlvbkNvbnRlbnQucGFyYWdyYXBocykge1xyXG4gICAgICBwYXJhZ3JhcGguaXNDbGlja2VkID0gZmFsc2U7XHJcbiAgICB9XHJcbiAgICB0aGlzLnNlY3Rpb25Db250ZW50LnBhcmFncmFwaHNbIDAgXS5pc0NsaWNrZWQgPSB0cnVlO1xyXG5cclxuICB9XHJcblxyXG4gIG9uQ2hhbmdlSW1hZ2UoaW1hZ2VQYXRoLCBwYXJhZ3JhcGhJbmRleCkge1xyXG4gICAgZm9yIChsZXQgcGFyYWdyYXBoIG9mIHRoaXMuc2VjdGlvbkNvbnRlbnQucGFyYWdyYXBocykge1xyXG4gICAgICBwYXJhZ3JhcGguaXNDbGlja2VkID0gZmFsc2U7XHJcbiAgICB9XHJcbiAgICB0aGlzLnNlbGVjdGVkSW1hZ2UgPSBpbWFnZVBhdGg7XHJcbiAgICB0aGlzLnNlY3Rpb25Db250ZW50LnBhcmFncmFwaHNbIHBhcmFncmFwaEluZGV4IF0uaXNDbGlja2VkID0gdHJ1ZTtcclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cInZhbHVlLXByb3BcIiBbbmdDbGFzc109XCJ7J2ltYWdlLXRleHQtc29ydCc6IHNlY3Rpb25Db250ZW50LnBhcmFncmFwaFByb3BlcnRpZXMub25SaWdodFNpZGUgLCAndGV4dC1pbWFnZS1zb3J0JzogIXNlY3Rpb25Db250ZW50LnBhcmFncmFwaFByb3BlcnRpZXMub25SaWdodFNpZGUgLCdwYXJhZ3JhcGgtd2l0aC1jYXJkJzpzZWN0aW9uQ29udGVudC5wYXJhZ3JhcGhQcm9wZXJ0aWVzLndpdGhDYXJkIH1cIj5cclxuICAgIDxkaXYgY2xhc3M9XCJ0ZXh0LXNpZGVcIj5cclxuICAgICAgICA8c2VjdGlvbi10aXRsZSBbc2VjdGlvblRpdGxlXT1cInNlY3Rpb25Db250ZW50LnNlY3Rpb25UaXRsZVwiPlxyXG4gICAgICAgIDwvc2VjdGlvbi10aXRsZT5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwidmFsdWUtcHJvcC1pbWFnZVwiPlxyXG4gICAgICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJzZWxlY3RlZEltYWdlXCIgYWx0PVwiXCI+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cInBhcmFncmFwaC1pdGVtc1wiPlxyXG4gICAgICAgICAgICA8cCAqbmdGb3I9XCJsZXQgcGFyYWdyYXBoIG9mIHNlY3Rpb25Db250ZW50LnBhcmFncmFwaHM7IGxldCBqID0gaW5kZXhcIiBjbGFzcz1cInBhcmFncmFwaFwiIChjbGljayk9XCJvbkNoYW5nZUltYWdlKHBhcmFncmFwaC5pbWFnZVBhdGggLGopXCIgW25nQ2xhc3NdPVwieydzZWxlY3RlZC1wYXJhZ3JhcGgnOnBhcmFncmFwaC5pc0NsaWNrZWQsICdvbmUtcGFyYWdyYXBoJzpzZWN0aW9uQ29udGVudC5wYXJhZ3JhcGhzLmxlbmd0aCA9PSAxfVwiPlxyXG4gICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJ2YWx1ZS1wcm9wLWljb25cIj5cclxuICAgICAgICAgICAgICAgICAgICA8ZmEtaWNvbiBbaWNvbl09XCJwYXJhZ3JhcGguaWNvbk5hbWVcIj48L2ZhLWljb24+PC9zcGFuPlxyXG4gICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJwYXJhZ3JhcGgtdGV4dFwiPlxyXG4gICAgICAgICAgICAgICAgICAgIHt7cGFyYWdyYXBoLnRleHR9fVxyXG4gICAgICAgICAgICAgICAgPC9zcGFuPlxyXG4gICAgICAgICAgICA8L3A+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJpbWFnZS1idXR0b25zLXNpZGVcIj5cclxuICAgICAgICA8aW1nIGxvYWRpbmc9XCJsYXp5XCIgW3NyY109XCJzZWxlY3RlZEltYWdlXCIgYWx0PVwiXCI+XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+Il19
|