@jooler/jooler-websites-shared 0.0.150 → 0.0.152

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.
@@ -754,10 +754,10 @@ class ComingSoonComponent {
754
754
  }
755
755
  }
756
756
  ComingSoonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComingSoonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
757
- ComingSoonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ComingSoonComponent, selector: "coming-soon", inputs: { ctaText: "ctaText", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<div class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\"\n [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\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-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;height:100vh}.page .coming-soon{background:url(https://i.ibb.co/crKpSTb/box-left-side-design.png) left center no-repeat,url(https://i.ibb.co/pKTGF8D/coming-soon-right-top-bg.png) right top no-repeat,url(https://i.ibb.co/ckht99W/coming-soon-right-bottom-bg.png) right bottom no-repeat;background-size:2rem,13rem,10rem;position:absolute;top:15%;left:50%;transform:translate(-50%);background-color:#fff;padding:6rem 4rem;width:40%;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060}.page .coming-soon .title{color:#4d4d4d;font-weight:500;font-size:4rem;margin-bottom:.8rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem;margin-bottom:.3rem}.page .coming-soon .registration-field{display:flex;margin-bottom:.8rem}.page .coming-soon .registration-field .email-field{margin-right:.8rem}.page .coming-soon .registration-field .submit{color:#fff;background-color:#32353b}.page .coming-soon .registration-field .submit:hover{background-color:#494e57}.page .coming-soon .social-media-icons{font-size:2rem}.page .coming-soon .social-media-icons fa-icon{color:#4d4d4d;margin-right:1rem;cursor:pointer;transition:ease-in-out .2s}.page .coming-soon .social-media-icons .linkedin:hover{color:#0072b1}.page .coming-soon .social-media-icons .instagram:hover{color:#c92bb7}.page .coming-soon .social-media-icons .youtube:hover{color:red}\n"], dependencies: [{ kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SocialMediaIconsComponent, selector: "social-media-icons", inputs: ["color", "areIconsInFooter", "socialMediaLinks"] }] });
757
+ ComingSoonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ComingSoonComponent, selector: "coming-soon", inputs: { ctaText: "ctaText", socialMediaLinks: "socialMediaLinks" }, ngImport: i0, template: "<section class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\" [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\n</section>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;padding:20vh 0}.page .coming-soon{background:url(https://i.ibb.co/crKpSTb/box-left-side-design.png) left center no-repeat,url(https://i.ibb.co/pKTGF8D/coming-soon-right-top-bg.png) right top no-repeat,url(https://i.ibb.co/ckht99W/coming-soon-right-bottom-bg.png) right bottom no-repeat;background-size:2rem,13rem,10rem;margin:auto;background-color:#fff;padding:6rem 4rem;width:60rem;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060;display:flex;flex-direction:column;row-gap:1rem}.page .coming-soon .title{color:#155ed4;font-weight:500;font-size:4rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem}.page .coming-soon .registration-field{display:flex;flex-direction:row;column-gap:1rem}.page .coming-soon .registration-field .email-field{width:60%}.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .registration-field .submit{color:#fff;background-color:#32353b}.page .coming-soon .registration-field .submit:hover{background-color:#494e57}.page .coming-soon .social-media-icons{font-size:2rem}@media only screen and (max-width: 37.5em){.page .coming-soon{width:90%;text-align:center;background-size:2rem,7rem,7rem}.page .coming-soon .registration-field{flex-direction:column;row-gap:1rem}.page .coming-soon .registration-field .email-field,.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .social-media-icons{margin:auto}}\n"], dependencies: [{ kind: "component", type: i3$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: SocialMediaIconsComponent, selector: "social-media-icons", inputs: ["color", "areIconsInFooter", "socialMediaLinks"] }] });
758
758
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ComingSoonComponent, decorators: [{
759
759
  type: Component,
760
- args: [{ selector: 'coming-soon', template: "<div class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\"\n [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\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-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;height:100vh}.page .coming-soon{background:url(https://i.ibb.co/crKpSTb/box-left-side-design.png) left center no-repeat,url(https://i.ibb.co/pKTGF8D/coming-soon-right-top-bg.png) right top no-repeat,url(https://i.ibb.co/ckht99W/coming-soon-right-bottom-bg.png) right bottom no-repeat;background-size:2rem,13rem,10rem;position:absolute;top:15%;left:50%;transform:translate(-50%);background-color:#fff;padding:6rem 4rem;width:40%;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060}.page .coming-soon .title{color:#4d4d4d;font-weight:500;font-size:4rem;margin-bottom:.8rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem;margin-bottom:.3rem}.page .coming-soon .registration-field{display:flex;margin-bottom:.8rem}.page .coming-soon .registration-field .email-field{margin-right:.8rem}.page .coming-soon .registration-field .submit{color:#fff;background-color:#32353b}.page .coming-soon .registration-field .submit:hover{background-color:#494e57}.page .coming-soon .social-media-icons{font-size:2rem}.page .coming-soon .social-media-icons fa-icon{color:#4d4d4d;margin-right:1rem;cursor:pointer;transition:ease-in-out .2s}.page .coming-soon .social-media-icons .linkedin:hover{color:#0072b1}.page .coming-soon .social-media-icons .instagram:hover{color:#c92bb7}.page .coming-soon .social-media-icons .youtube:hover{color:red}\n"] }]
760
+ args: [{ selector: 'coming-soon', template: "<section class=\"page\">\n <div class=\"coming-soon\">\n <div class=\"title\">\n Coming Soon\n </div>\n <div class=\"subtitle\">\n {{ctaText}}\n </div>\n <form>\n <div class=\"registration-field\">\n <div class=\"email-field\">\n <input type=\"email\" placeholder=\"Email Address\">\n </div>\n <button mat-raised-button class=\"submit\" type=\"submit\">\n Submit\n </button>\n </div>\n </form>\n <div class=\"social-media-icons\">\n <social-media-icons [color]=\"'#4D4D4D'\" [areIconsInFooter]=\"false\" [socialMediaLinks]=\"socialMediaLinks\"></social-media-icons>\n </div>\n </div>\n</section>", styles: ["html{font-size:62.5%;scroll-behavior:smooth}@media only screen and (max-width: 112.5em){html{font-size:56.25%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}@media only screen and (min-width: 112.5em){html{font-size:75%}}app-root{font-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.page{width:100%;position:relative;padding:20vh 0}.page .coming-soon{background:url(https://i.ibb.co/crKpSTb/box-left-side-design.png) left center no-repeat,url(https://i.ibb.co/pKTGF8D/coming-soon-right-top-bg.png) right top no-repeat,url(https://i.ibb.co/ckht99W/coming-soon-right-bottom-bg.png) right bottom no-repeat;background-size:2rem,13rem,10rem;margin:auto;background-color:#fff;padding:6rem 4rem;width:60rem;border-radius:2.5rem;box-shadow:.2rem .2rem 7.4rem #00000060;display:flex;flex-direction:column;row-gap:1rem}.page .coming-soon .title{color:#155ed4;font-weight:500;font-size:4rem}.page .coming-soon .subtitle{color:#4d4d4d;font-weight:700;font-size:1.3rem}.page .coming-soon .registration-field{display:flex;flex-direction:row;column-gap:1rem}.page .coming-soon .registration-field .email-field{width:60%}.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .registration-field .submit{color:#fff;background-color:#32353b}.page .coming-soon .registration-field .submit:hover{background-color:#494e57}.page .coming-soon .social-media-icons{font-size:2rem}@media only screen and (max-width: 37.5em){.page .coming-soon{width:90%;text-align:center;background-size:2rem,7rem,7rem}.page .coming-soon .registration-field{flex-direction:column;row-gap:1rem}.page .coming-soon .registration-field .email-field,.page .coming-soon .registration-field .email-field input{width:100%}.page .coming-soon .social-media-icons{margin:auto}}\n"] }]
761
761
  }], propDecorators: { ctaText: [{
762
762
  type: Input
763
763
  }], socialMediaLinks: [{
@@ -874,15 +874,18 @@ class CustomTooltipComponent {
874
874
  onMouseEnter() {
875
875
  this.showDetails = true;
876
876
  }
877
+ onMouseClick() {
878
+ this.showDetails = !this.showDetails;
879
+ }
877
880
  onMouseLeave() {
878
881
  this.showDetails = false;
879
882
  }
880
883
  }
881
884
  CustomTooltipComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CustomTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
882
- CustomTooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CustomTooltipComponent, selector: "custom-tooltip", ngImport: i0, template: "<div (mouseleave)=\"onMouseLeave()\" class=\"icon\">\n <div (click)=\"onMouseEnter()\" (mouseenter)=\"onMouseEnter()\" class=\"icon-container\">\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\n </div>\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\n <ng-content></ng-content>\n </div>\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-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;display:inline-block;position:relative}.icon-shape{position:relative;z-index:-2}.tooltip-message-box{display:block;z-index:100;position:absolute;left:100%;top:-100%;transition:all .1s ease-in-out;z-index:1}.no-details{opacity:0;transform:scale(.1)}.details{opacity:1;transform:scale(1)}.icon-container{cursor:pointer;display:inline-block}\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"] }] });
885
+ CustomTooltipComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CustomTooltipComponent, selector: "custom-tooltip", ngImport: i0, template: "<div class=\"icon\">\n <div class=\"content\" (mouseleave)=\"onMouseLeave()\">\n <div (click)=\"onMouseClick()\" class=\"icon-container\" (mouseenter)=\"onMouseEnter()\">\n <div>\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\n </div>\n </div>\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\n <fa-icon icon=\"caret-left\"></fa-icon>\n <ng-content></ng-content>\n </div>\n </div>\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-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;position:relative;width:3rem}.icon .content{position:absolute;display:flex;flex-direction:row;top:0}.icon .icon-container{display:inline-block;height:-moz-fit-content;height:fit-content;cursor:pointer}.icon .icon-container .icon-shape{position:relative;z-index:-2}.icon .tooltip-message-box{align-self:center;display:flex;column-gap:0rem;z-index:100;transition:all .1s ease-in-out;z-index:1}.icon .tooltip-message-box fa-icon{font-size:2rem;margin-left:.5rem}.icon .no-details{opacity:0;transform:scale(0)}.icon .details{opacity:1;transform:scale(1)}\n"], dependencies: [{ kind: "component", type: i2.FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
883
886
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CustomTooltipComponent, decorators: [{
884
887
  type: Component,
885
- args: [{ selector: 'custom-tooltip', template: "<div (mouseleave)=\"onMouseLeave()\" class=\"icon\">\n <div (click)=\"onMouseEnter()\" (mouseenter)=\"onMouseEnter()\" class=\"icon-container\">\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\n </div>\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\n <ng-content></ng-content>\n </div>\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-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;display:inline-block;position:relative}.icon-shape{position:relative;z-index:-2}.tooltip-message-box{display:block;z-index:100;position:absolute;left:100%;top:-100%;transition:all .1s ease-in-out;z-index:1}.no-details{opacity:0;transform:scale(.1)}.details{opacity:1;transform:scale(1)}.icon-container{cursor:pointer;display:inline-block}\n"] }]
888
+ args: [{ selector: 'custom-tooltip', template: "<div class=\"icon\">\n <div class=\"content\" (mouseleave)=\"onMouseLeave()\">\n <div (click)=\"onMouseClick()\" class=\"icon-container\" (mouseenter)=\"onMouseEnter()\">\n <div>\n <fa-icon icon=\"info-circle\" class=\"icon-shape\"></fa-icon>\n </div>\n </div>\n <div class=\"tooltip-message-box\" [ngClass]=\"{'no-details' : !showDetails , 'details': showDetails}\">\n <fa-icon icon=\"caret-left\"></fa-icon>\n <ng-content></ng-content>\n </div>\n </div>\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-family:sans-serif;font-size:1.6rem}input{font-size:1.2rem;padding:.5rem}input:focus{outline:none}.icon{color:#32353b;position:relative;width:3rem}.icon .content{position:absolute;display:flex;flex-direction:row;top:0}.icon .icon-container{display:inline-block;height:-moz-fit-content;height:fit-content;cursor:pointer}.icon .icon-container .icon-shape{position:relative;z-index:-2}.icon .tooltip-message-box{align-self:center;display:flex;column-gap:0rem;z-index:100;transition:all .1s ease-in-out;z-index:1}.icon .tooltip-message-box fa-icon{font-size:2rem;margin-left:.5rem}.icon .no-details{opacity:0;transform:scale(0)}.icon .details{opacity:1;transform:scale(1)}\n"] }]
886
889
  }] });
887
890
 
888
891
  class FeatureSectionOneComponent {