tango-app-ui-auth 3.1.5-dev → 3.1.6-dev
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/tango-auth/tango-auth.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-forgot-password/tango-auth-forgot-password.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-login/tango-auth-login.component.mjs +7 -7
- package/esm2022/lib/components/tango-auth-signup/step/calendly-modal/calendly-modal.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/step/modal-content/modal-content.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/step/services/conversion.service.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/step/step1/step1.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/step/step2/step2.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/step/step3/step3.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/tango-auth-signup.component.mjs +3 -3
- package/esm2022/lib/components/tango-auth-signup/vertical/vertical.component.mjs +3 -3
- package/esm2022/lib/guards/auth.guard.mjs +3 -3
- package/esm2022/lib/services/auth.service.mjs +3 -3
- package/esm2022/lib/tango-auth-routing.module.mjs +4 -4
- package/esm2022/lib/tango-auth.module.mjs +4 -4
- package/fesm2022/tango-app-ui-auth.mjs +50 -50
- package/fesm2022/tango-app-ui-auth.mjs.map +1 -1
- package/package.json +1 -1
package/esm2022/lib/components/tango-auth-signup/step/calendly-modal/calendly-modal.component.mjs
CHANGED
|
@@ -22,10 +22,10 @@ export class CalendlyModalComponent {
|
|
|
22
22
|
this.modalRef.close({ type: 'scheduled' });
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
26
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
25
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CalendlyModalComponent, deps: [{ token: i1.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
26
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: CalendlyModalComponent, selector: "lib-calendly-modal", inputs: { userData: "userData" }, ngImport: i0, template: "<div class=\"calendly-inline-widget\"></div>\r\n", styles: [".calendly-inline-widget{height:80dvh}\n"] });
|
|
27
27
|
}
|
|
28
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
28
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: CalendlyModalComponent, decorators: [{
|
|
29
29
|
type: Component,
|
|
30
30
|
args: [{ selector: 'lib-calendly-modal', template: "<div class=\"calendly-inline-widget\"></div>\r\n", styles: [".calendly-inline-widget{height:80dvh}\n"] }]
|
|
31
31
|
}], ctorParameters: () => [{ type: i1.NgbActiveModal }], propDecorators: { userData: [{
|
package/esm2022/lib/components/tango-auth-signup/step/modal-content/modal-content.component.mjs
CHANGED
|
@@ -32,10 +32,10 @@ export class ModalContentComponent {
|
|
|
32
32
|
passBack() {
|
|
33
33
|
this.activeModal.close(this.user);
|
|
34
34
|
}
|
|
35
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
36
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: ModalContentComponent, selector: "lib-modal-content", inputs: { user: "user", width: "width", height: "height" }, ngImport: i0, template: "<div >\r\n<div class=\"modal-header border-bottom-0\">\r\n <!-- <h4 class=\"modal-title\" id=\"modal-basic-title\">Simple modal</h4> -->\r\n <div class=\"col-12 text-end \">\r\n <div class=\"btn btn-sm btn-icon btn-active-color-primary\" data-bs-dismiss=\"modal\">\r\n <i (click)=\"activeModal.dismiss('Cross click')\" class=\"ki-duotone ki-cross fs-1\"><span class=\"path1\"></span><span\r\n class=\"path2\"></span></i>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-body pt-0\">\r\n <div class=\"row mx-5\">\r\n <div class=\"col-lg-6 col-md-6 col-sm-6 md-offset-3\">\r\n <div class=\"align-items-center border-0 mt-4\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"main fs-lg-1 text-gray-800 mb-2 \">Product Offerings</span>\r\n </h3>\r\n </div>\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('traffic')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.traffic\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.traffic\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Traffic\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.traffic\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Footfall Analysis.</li>\r\n <li>Bounced vs Engager Analysis</li>\r\n <li>Missed Opportunity Vs Conversion Rate.</li>\r\n <li>Footfall Image Directory by the hour.</li>\r\n <li>Infra tracking ticketing system.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('zone')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.zone\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.zone\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Zone\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.zone\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Heatmap Analysis.</li>\r\n <li>Concentration % of each of your zone.</li>\r\n <li>Customer trajectory during their visit to your store.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <!-- <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('revops')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.revops\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.revops\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Revops\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.revops\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Identifying missed opportunities across reasons like Pricing, Store, Product, Staff\r\n etc.</li>\r\n <li>Customer database solution for retargeting.</li>\r\n <li>POS integration to capture conversion.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div> -->\r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('sop')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.sop\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.sop\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango SOP\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.sop\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Daily store operation.</li>\r\n <li> Extensive summary of data points like store open and close time.\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('support')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.support\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.support\"><svg width=\"24\"\r\n height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Priority Support\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.support\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li> 24*7 CCTV monitoring of all the cameras in a single screen.</li>\r\n <li>Live and Recap video option for the entire day.\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"col-lg-6 col-md-6 col-sm-6 \">\r\n <div class=\"card-header\">\r\n <video class=\"video-width\" muted autoplay controls style=\"border-radius: 20px;\">\r\n <source src=\"https://tangoeye-dashboard-video.objectstore.e2enetworks.net/tango-main-video%201.mp4\"\r\n type=\"video/mp4\">\r\n <!-- https://tango-staticsite.s3.ap-south-1.amazonaws.com/Tango+Eye_720p_with+music_Trim.mp4\" -->\r\n </video>\r\n </div>\r\n <div class=\"card-header align-items-center border-0 mt-4\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"main fs-lg-1 text-gray-800\">Product Walk-Through</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-header align-items-center border-0 my-2 ms-6\" ><span\r\n class=\"sub\">We transform your existing CCTV cameras into a powerful store analytics tool.\r\n Our industry-first Al and computer vision technology help brands identify missed sale\r\n opportunities and focus on improving conversion rates across stores.</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".sub{color:#7e8299!important;font-weight:500;font-size:15px;line-height:25px}.main{font-weight:600!important;font-size:18px!important;line-height:22px;color:#13263c!important}::ng-deep .modal-content{border-radius:12px!important}@media (min-width: 320px) and (max-width: 1024px){.topbar{margin-top:3rem!important}.w-100{width:92%!important}.testrel{margin-left:4%}.imgsrc{width:48%;margin-top:5%;margin-left:37%}}.video-custom-tag{width:400px;height:400px;border-radius:40px;margin:0 20px}.font{font-family:Inter!important}.ul_style_none ul{list-style:none}.full-width-modal .modal-dialog{max-width:100%;width:100%}.full-width-modal .modal-content{width:100%}.video-width{width:350px}@media (min-width: 1920px) and (max-width: 2100px){::ng-deep .modal.show .modal-dialog{transform:none;margin-right:325px!important}::ng-deep .modal-lg,.modal-xl{--bs-modal-width: 1105px}.video-width{width:465px}}.close{position:absolute;right:10px;top:10px;z-index:1;opacity:.5;background-color:transparent;border:none;font-size:1.5rem;line-height:1;padding:.25rem .75rem}.close:hover{opacity:1}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
35
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ModalContentComponent, deps: [{ token: i1.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
36
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ModalContentComponent, selector: "lib-modal-content", inputs: { user: "user", width: "width", height: "height" }, ngImport: i0, template: "<div >\r\n<div class=\"modal-header border-bottom-0\">\r\n <!-- <h4 class=\"modal-title\" id=\"modal-basic-title\">Simple modal</h4> -->\r\n <div class=\"col-12 text-end \">\r\n <div class=\"btn btn-sm btn-icon btn-active-color-primary\" data-bs-dismiss=\"modal\">\r\n <i (click)=\"activeModal.dismiss('Cross click')\" class=\"ki-duotone ki-cross fs-1\"><span class=\"path1\"></span><span\r\n class=\"path2\"></span></i>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-body pt-0\">\r\n <div class=\"row mx-5\">\r\n <div class=\"col-lg-6 col-md-6 col-sm-6 md-offset-3\">\r\n <div class=\"align-items-center border-0 mt-4\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"main fs-lg-1 text-gray-800 mb-2 \">Product Offerings</span>\r\n </h3>\r\n </div>\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('traffic')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.traffic\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.traffic\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Traffic\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.traffic\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Footfall Analysis.</li>\r\n <li>Bounced vs Engager Analysis</li>\r\n <li>Missed Opportunity Vs Conversion Rate.</li>\r\n <li>Footfall Image Directory by the hour.</li>\r\n <li>Infra tracking ticketing system.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('zone')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.zone\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.zone\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Zone\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.zone\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Heatmap Analysis.</li>\r\n <li>Concentration % of each of your zone.</li>\r\n <li>Customer trajectory during their visit to your store.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <!-- <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('revops')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.revops\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.revops\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Revops\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.revops\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Identifying missed opportunities across reasons like Pricing, Store, Product, Staff\r\n etc.</li>\r\n <li>Customer database solution for retargeting.</li>\r\n <li>POS integration to capture conversion.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div> -->\r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('sop')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.sop\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.sop\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango SOP\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.sop\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Daily store operation.</li>\r\n <li> Extensive summary of data points like store open and close time.\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('support')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.support\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.support\"><svg width=\"24\"\r\n height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Priority Support\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.support\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li> 24*7 CCTV monitoring of all the cameras in a single screen.</li>\r\n <li>Live and Recap video option for the entire day.\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"col-lg-6 col-md-6 col-sm-6 \">\r\n <div class=\"card-header\">\r\n <video class=\"video-width\" muted autoplay controls style=\"border-radius: 20px;\">\r\n <source src=\"https://tangoeye-dashboard-video.objectstore.e2enetworks.net/tango-main-video%201.mp4\"\r\n type=\"video/mp4\">\r\n <!-- https://tango-staticsite.s3.ap-south-1.amazonaws.com/Tango+Eye_720p_with+music_Trim.mp4\" -->\r\n </video>\r\n </div>\r\n <div class=\"card-header align-items-center border-0 mt-4\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"main fs-lg-1 text-gray-800\">Product Walk-Through</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-header align-items-center border-0 my-2 ms-6\" ><span\r\n class=\"sub\">We transform your existing CCTV cameras into a powerful store analytics tool.\r\n Our industry-first Al and computer vision technology help brands identify missed sale\r\n opportunities and focus on improving conversion rates across stores.</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".sub{color:#7e8299!important;font-weight:500;font-size:15px;line-height:25px}.main{font-weight:600!important;font-size:18px!important;line-height:22px;color:#13263c!important}::ng-deep .modal-content{border-radius:12px!important}@media (min-width: 320px) and (max-width: 1024px){.topbar{margin-top:3rem!important}.w-100{width:92%!important}.testrel{margin-left:4%}.imgsrc{width:48%;margin-top:5%;margin-left:37%}}.video-custom-tag{width:400px;height:400px;border-radius:40px;margin:0 20px}.font{font-family:Inter!important}.ul_style_none ul{list-style:none}.full-width-modal .modal-dialog{max-width:100%;width:100%}.full-width-modal .modal-content{width:100%}.video-width{width:350px}@media (min-width: 1920px) and (max-width: 2100px){::ng-deep .modal.show .modal-dialog{transform:none;margin-right:325px!important}::ng-deep .modal-lg,.modal-xl{--bs-modal-width: 1105px}.video-width{width:465px}}.close{position:absolute;right:10px;top:10px;z-index:1;opacity:.5;background-color:transparent;border:none;font-size:1.5rem;line-height:1;padding:.25rem .75rem}.close:hover{opacity:1}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
37
37
|
}
|
|
38
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ModalContentComponent, decorators: [{
|
|
39
39
|
type: Component,
|
|
40
40
|
args: [{ selector: 'lib-modal-content', template: "<div >\r\n<div class=\"modal-header border-bottom-0\">\r\n <!-- <h4 class=\"modal-title\" id=\"modal-basic-title\">Simple modal</h4> -->\r\n <div class=\"col-12 text-end \">\r\n <div class=\"btn btn-sm btn-icon btn-active-color-primary\" data-bs-dismiss=\"modal\">\r\n <i (click)=\"activeModal.dismiss('Cross click')\" class=\"ki-duotone ki-cross fs-1\"><span class=\"path1\"></span><span\r\n class=\"path2\"></span></i>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"modal-body pt-0\">\r\n <div class=\"row mx-5\">\r\n <div class=\"col-lg-6 col-md-6 col-sm-6 md-offset-3\">\r\n <div class=\"align-items-center border-0 mt-4\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"main fs-lg-1 text-gray-800 mb-2 \">Product Offerings</span>\r\n </h3>\r\n </div>\r\n <div class=\"\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('traffic')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.traffic\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.traffic\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Traffic\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.traffic\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Footfall Analysis.</li>\r\n <li>Bounced vs Engager Analysis</li>\r\n <li>Missed Opportunity Vs Conversion Rate.</li>\r\n <li>Footfall Image Directory by the hour.</li>\r\n <li>Infra tracking ticketing system.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('zone')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.zone\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.zone\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Zone\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.zone\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Heatmap Analysis.</li>\r\n <li>Concentration % of each of your zone.</li>\r\n <li>Customer trajectory during their visit to your store.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n <!-- <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('revops')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.revops\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.revops\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango Revops\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.revops\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Identifying missed opportunities across reasons like Pricing, Store, Product, Staff\r\n etc.</li>\r\n <li>Customer database solution for retargeting.</li>\r\n <li>POS integration to capture conversion.</li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div> -->\r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('sop')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.sop\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.sop\"><svg width=\"24\" height=\"24\"\r\n viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Tango SOP\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.sop\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li>Daily store operation.</li>\r\n <li> Extensive summary of data points like store open and close time.\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n \r\n <div class=\"m-0\">\r\n <div class=\"d-flex align-items-center collapsible py-3 toggle mb-0\" data-bs-toggle=\"collapse\"\r\n data-bs-target=\"#kt_job_4_1\">\r\n <div class=\"btn btn-sm btn-icon mw-20px btn-active-color-primary me-5\"\r\n (click)=\"expandPlan('support')\">\r\n <span class=\"svg-icon svg-icon-primary svg-icon-1\" *ngIf=\"expandDetails.support\"><svg\r\n width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"6.0104\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n <span class=\"svg-icon svg-icon-1\" *ngIf=\"!expandDetails.support\"><svg width=\"24\"\r\n height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect opacity=\"0.3\" x=\"2\" y=\"2\" width=\"20\" height=\"20\" rx=\"5\" fill=\"currentColor\">\r\n </rect>\r\n <rect x=\"10.8891\" y=\"17.8033\" width=\"12\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(-90 10.8891 17.8033)\" fill=\"currentColor\"></rect>\r\n <rect x=\"6.01041\" y=\"10.9247\" width=\"12\" height=\"2\" rx=\"1\" fill=\"currentColor\">\r\n </rect>\r\n </svg>\r\n </span>\r\n </div>\r\n <h4 class=\"text-gray-700 fw-bold cursor-pointer mb-0\">\r\n Priority Support\r\n </h4>\r\n </div>\r\n <div id=\"kt_job_4_1\" class=\"collapse show fs-6 ms-1\" *ngIf=\"expandDetails.support\">\r\n <div class=\"mb-4 text-gray-700 sub\">\r\n <ul>\r\n <li> 24*7 CCTV monitoring of all the cameras in a single screen.</li>\r\n <li>Live and Recap video option for the entire day.\r\n </li>\r\n </ul>\r\n </div>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n <div class=\"col-lg-6 col-md-6 col-sm-6 \">\r\n <div class=\"card-header\">\r\n <video class=\"video-width\" muted autoplay controls style=\"border-radius: 20px;\">\r\n <source src=\"https://tangoeye-dashboard-video.objectstore.e2enetworks.net/tango-main-video%201.mp4\"\r\n type=\"video/mp4\">\r\n <!-- https://tango-staticsite.s3.ap-south-1.amazonaws.com/Tango+Eye_720p_with+music_Trim.mp4\" -->\r\n </video>\r\n </div>\r\n <div class=\"card-header align-items-center border-0 mt-4\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <span class=\"main fs-lg-1 text-gray-800\">Product Walk-Through</span>\r\n </h3>\r\n </div>\r\n <div class=\"card-header align-items-center border-0 my-2 ms-6\" ><span\r\n class=\"sub\">We transform your existing CCTV cameras into a powerful store analytics tool.\r\n Our industry-first Al and computer vision technology help brands identify missed sale\r\n opportunities and focus on improving conversion rates across stores.</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n", styles: [".sub{color:#7e8299!important;font-weight:500;font-size:15px;line-height:25px}.main{font-weight:600!important;font-size:18px!important;line-height:22px;color:#13263c!important}::ng-deep .modal-content{border-radius:12px!important}@media (min-width: 320px) and (max-width: 1024px){.topbar{margin-top:3rem!important}.w-100{width:92%!important}.testrel{margin-left:4%}.imgsrc{width:48%;margin-top:5%;margin-left:37%}}.video-custom-tag{width:400px;height:400px;border-radius:40px;margin:0 20px}.font{font-family:Inter!important}.ul_style_none ul{list-style:none}.full-width-modal .modal-dialog{max-width:100%;width:100%}.full-width-modal .modal-content{width:100%}.video-width{width:350px}@media (min-width: 1920px) and (max-width: 2100px){::ng-deep .modal.show .modal-dialog{transform:none;margin-right:325px!important}::ng-deep .modal-lg,.modal-xl{--bs-modal-width: 1105px}.video-width{width:465px}}.close{position:absolute;right:10px;top:10px;z-index:1;opacity:.5;background-color:transparent;border:none;font-size:1.5rem;line-height:1;padding:.25rem .75rem}.close:hover{opacity:1}\n"] }]
|
|
41
41
|
}], ctorParameters: () => [{ type: i1.NgbActiveModal }], propDecorators: { user: [{
|
|
@@ -15,10 +15,10 @@ export class ConversionService {
|
|
|
15
15
|
this.$stepper.emit(data);
|
|
16
16
|
console.log(data);
|
|
17
17
|
}
|
|
18
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
19
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
18
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ConversionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
19
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ConversionService, providedIn: 'root' });
|
|
20
20
|
}
|
|
21
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ConversionService, decorators: [{
|
|
22
22
|
type: Injectable,
|
|
23
23
|
args: [{
|
|
24
24
|
providedIn: 'root'
|
|
@@ -221,10 +221,10 @@ export class Step1Component {
|
|
|
221
221
|
k = event.charCode; // k = event.keyCode; (Both can be used)
|
|
222
222
|
return k == 8 || k == 32 || (k >= 48 && k <= 57);
|
|
223
223
|
}
|
|
224
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
225
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: Step1Component, selector: "lib-step1", ngImport: i0, template: "<div class=\"card mt-10 mx-15\">\r\n <div class=\"h-100 px-10 mx-5 my-7\">\r\n <!-- <div>\r\n <img class=\"bubble\" src=\"../../../../../../../assets/Icons/Signup-bubble-icon.svg\"\r\n alt=\"\" srcset=\"\"> -->\r\n <div class=\"mobileshow\">\r\n <h3 class=\"title1 pt-4\">AI co-pilot to boost your sales conversion</h3>\r\n <p class=\"subtext pb-4\">Join the leading global brands in understanding footfall and shopper behavior to\r\n boost\r\n sales.</p>\r\n\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/Lenskart-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/nykaa-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/giva-logo3.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/Duroflex-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/loccitone-logo.svg\" alt=\"\">\r\n </div>\r\n <div class=\"me-20\">\r\n <h4 class=\"icon-more\">30 +</h4>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-12 card-title\">\r\n <h6 class=\"card-label mb-7\">Create an Account</h6>\r\n <form [formGroup]=\"aboutForm\" novalidate=\"novalidate\">\r\n <div class=\"row px-0\">\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"Brand\" class=\"form-label\">Brand Name <span class=\"alert-required\">*</span></label>\r\n <input (blur)=\"onClientNameBlur()\" (input)=\"isClientNameTaken = 0\" formControlName=\"clientName\" type=\"type\" class=\"form-control\" id=\"Brand\" \r\n [ngClass]=\"{ 'is-invalid': aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('required') }\" autocomplete=\"off\" >\r\n \r\n \r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('minlength')\">\r\n Brand name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('maxlength')\">\r\n Brand name must be maximum of 100 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('required')\">\r\n Brand name is required\r\n </small>\r\n <small \r\n *ngIf=\"isClientNameTaken\">\r\n Brand Name already exists\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"row px-0\">\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"firstname\" class=\"form-label\">First Name <span class=\"alert-required\">*</span></label>\r\n <input formControlName=\"firstName\" type=\"type\" class=\"form-control\" id=\"firstname\" autocomplete=\"off\"\r\n [ngClass]=\"{ 'is-invalid': aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('required') }\">\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('minlength')\">\r\n First name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('maxlength')\">\r\n First name must be maximum of 50 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('required')\">\r\n First name is required\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"lastname\" class=\"form-label\">Last Name</label>\r\n <input formControlName=\"lastName\" type=\"type\" class=\"form-control\" id=\"lastname\" autocomplete=\"off\">\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('minlength')\">\r\n Last name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('maxlength')\">\r\n Last name must be maximum of 50 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('required')\">\r\n Last name is required\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Corporate Email <span class=\"alert-required\">*</span></label>\r\n <input (blur)=\"onEmailBlur()\" (input)=\"isEmailTaken = 0\" formControlName=\"corporateEmail\" type=\"email\" class=\"form-control\" id=\"email\" [ngClass]=\"{ 'is-invalid': aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('required') }\"\r\n autocomplete=\"off\">\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('minlength')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('maxlength')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('required')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('pattern')\">\r\n Enter valid email ID\r\n </small>\r\n <small \r\n *ngIf=\"isEmailTaken\">\r\n Email already exists\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n\r\n <label for=\"phonenumber\" class=\"form-label\">Phone number <span class=\"alert-required\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <!-- <div class=\"input-group mb-3\">\r\n <div class=\"input-group-append\"> -->\r\n <!-- <select\r\n class=\"form-select form-select-solid select2-hidden-accessible form-label text-dark fs-4\"\r\n name=\"dialCode\" #dialCode=\"ngModel\"\r\n [ngModelOptions]=\"{standalone: true}\" matNativeControl required\r\n [(ngModel)]=\"countryCodes\" (click)=\"chooseCountry(countryCodes)\">\r\n <option [value]=\"country.dial_code\" *ngFor=\"let country of countryCodeList\"><span\r\n class=\"fw-bolder text-dark ps-3\">\r\n {{ country.name }}</span><span class=\"text-muted\">({{ country.dial_code\r\n }})</span>\r\n </option>\r\n </select> -->\r\n <select formControlName=\"countryCode\" class=\"form-select ps-3 pe-8\" \r\n id=\"inputGroupSelect01\">\r\n <option *ngFor=\"let country of countryList\" class=\"mx-2\" [value]=\"country.phonecode\">{{country.name}}<span class=\"text-muted\">({{ country.phonecode\r\n }})</span></option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <!-- <input [value]=\"aboutForm.get('countryCode')?.value\" type=\"text\" [ngClass]=\"{ 'code-is-invalid': aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required') }\"\r\n class=\"form-control border-disabled\" readonly> -->\r\n <input (blur)=\"onMobileNumberBlur()\" (input)=\"isMobileTaken = 0\" formControlName=\"mobileNumber\" type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\" [ngClass]=\"{ ' is-invalid': aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required') }\"\r\n id=\"phonenumber\" autocomplete=\"off\" minlength=\"7\" maxlength=\"15\">\r\n </div>\r\n </div>\r\n <small \r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required')\">\r\n Phone number is required\r\n </small>\r\n <small *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('pattern')\">\r\n Enter a valid phone number\r\n </small>\r\n <small\r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('min')\">\r\n Enter a valid phone number\r\n </small>\r\n <small\r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('max')\">\r\n Enter a valid phone number\r\n </small>\r\n <small \r\n *ngIf=\"isMobileTaken\">\r\n Phone Number already exists\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"password\" class=\"form-label\">Password <span class=\"alert-required\">*</span></label>\r\n <div class=\"position-relative mb-3\">\r\n <input (input)=\"onPasswordChange($event)\" formControlName=\"password\" [type]=\"passwordShow ? 'text' : 'password'\" [ngClass]=\"{ 'is-invalid': aboutForm.get('password')?.touched && aboutForm.get('password')?.hasError('required') }\"\r\n class=\"form-control\" id=\"password\" autocomplete=\"new-password\">\r\n <span (click)=\"showPassword()\"\r\n class=\"btn btn-sm btn-icon position-absolute translate-middle top-50 end-0\"\r\n data-kt-password-meter-control=\"visibility\">\r\n <i *ngIf=\"passwordShow\" class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n <i *ngIf=\"!passwordShow\" class=\"fa fa-eye-slash\" aria-hidden=\"true\"></i>\r\n </span>\r\n </div>\r\n <div class=\"progressbar-wrapper mt-2\">\r\n <span [style.width]=\"passwordStrength\"\r\n [ngStyle]=\"{'background-color': passwordStrength === '0%' ? '' : (passwordStrength === '25%' ? 'red' : (passwordStrength === '50%' ? 'orange': (passwordStrength === '75%' ? 'yellow' : (passwordStrength === '100%' ? 'green' : '')))) }\"\r\n class=\"progressbar-inner\"></span>\r\n </div>\r\n <div class=\"password-note mt-2\">The password must contain atleast one capital letter and number.</div>\r\n <div>\r\n <small *ngIf=\"aboutForm.get('password')?.hasError('required') && aboutForm.get('password')?.touched\">Password is required</small>\r\n </div>\r\n <div >\r\n <small *ngIf=\"aboutForm.get('password')?.hasError('noSpaces') && aboutForm.get('password')?.touched\">Password cannot contain spaces.</small> \r\n </div>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"confirm\" class=\"form-label\">Confirm Password <span class=\"alert-required\">*</span></label>\r\n <div class=\"position-relative mb-3\">\r\n <input (input)=\"onConfirmPasswordChange($event)\" formControlName=\"confirmPassword\" [type]=\"confirmPasswordShow ? 'text' : 'password'\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': aboutForm.get('confirmPassword')?.touched && aboutForm.get('confirmPassword')?.hasError('required') }\"\r\n id=\"confirm\" autocomplete=\"off\">\r\n <span (click)=\"showConfirmPassword()\"\r\n class=\"btn btn-sm btn-icon position-absolute translate-middle top-50 end-0\"\r\n data-kt-password-meter-control=\"visibility\">\r\n <i *ngIf=\"confirmPasswordShow\" class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n <i *ngIf=\"!confirmPasswordShow\" class=\"fa fa-eye-slash\" aria-hidden=\"true\"></i>\r\n </span>\r\n </div>\r\n <div class=\"progressbar-wrapper mt-2\">\r\n <span [style.width]=\"confirmPasswordStrength\"\r\n [ngStyle]=\"{'background-color': confirmPasswordStrength === '0%' ? '' : (confirmPasswordStrength === '25%' ? 'red' : (confirmPasswordStrength === '50%' ? 'orange': (confirmPasswordStrength === '75%' ? 'yellow' : (confirmPasswordStrength === '100%' ? 'green' : '')))) }\"\r\n class=\"progressbar-inner\"></span>\r\n </div>\r\n <div class=\"password-note mt-2\">The password must contain atleast one capital letter and number.</div>\r\n <div>\r\n <small *ngIf=\"aboutForm.get('confirmPassword')?.hasError('required') && aboutForm.get('confirmPassword')?.touched\">Confirm password is required</small>\r\n <small \r\n *ngIf=\"aboutForm.get('confirmPassword')?.touched && aboutForm.get('confirmPassword')?.hasError('NotEqual') && !aboutForm.get('confirmPassword')?.hasError('required')\">Password\r\n does not match</small>\r\n <small *ngIf=\"aboutForm.get('confirmPassword')?.hasError('noSpaces') && !aboutForm.get('confirmPassword')?.hasError('NotEqual') && aboutForm.get('confirmPassword')?.touched\">Password cannot contain spaces.</small> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n <!-- <ng-container *ngIf=\"currentStep$.value == 1\"> -->\r\n <div class=\"text-end\">\r\n <button [disabled]=\"aboutForm.invalid || isMobileTaken || isEmailTaken || isClientNameTaken\" type=\"button\" class=\"btn btn-lg btn-primary\" (click)=\"nextStep()\">\r\n <span class=\"indicator-label px-5\">\r\n <ng-container>\r\n Next <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M7.5 15L12.5 10L7.5 5\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </ng-container>\r\n\r\n </span>\r\n </button>\r\n </div>\r\n <!-- </ng-container> -->\r\n </div>\r\n\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n <div class=\"mb-3 d-flex flex-column flex-md-row flex-md-stack pt-3 container-fluid\">\r\n <div class=\"text-gray-900 order-2 order-md-1 ms-10\">\r\n <span class=\"me-1 footer\">\u00A9 2024 </span>\r\n <a target=\"_blank\" href=\"https://tangoeye.ai\" class=\"footer\">Tango IT Solutions India Pvt Ltd</a>\r\n </div>\r\n <ul class=\"menu menu-gray-600 menu-hover-primary fw-semibold order-1 me-7\">\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/#aboutus\" class=\"menu-link px-5\">About us</a></li>\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/#contact\" class=\"menu-link px-5\">Contact Us</a></li>\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/privacy-policy-2/\" class=\"menu-link px-5\">Privacy & policy</a></li>\r\n </ul>\r\n </div>\r\n</div>", styles: [".logo{width:16%;height:73px!important;margin-top:150px;margin-left:44%}.heading{margin-left:41%}.title1{color:var(--Gray-700, #344054)!important;font-size:24px!important;font-weight:600!important;line-height:32px}.subtext{color:var(--Gray-400, #98A2B3)!important;font-size:18px!important;font-weight:500!important;line-height:28px}.submit{padding-bottom:2%}.point{background:#ddd;border-radius:2px;display:inline-block;height:5px;width:85px}.form-control{display:block;height:45px;padding:.5rem 1rem;font-size:1rem;font-weight:500;line-height:1}input,button,select,optgroup,textarea{margin:5px 0}.form-control{display:block;color:var(--Gray-500, #667085);font-size:16px;font-weight:400;line-height:24px;-webkit-appearance:none;appearance:none;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-select{font-size:1.1rem;font-weight:600;line-height:24px;height:45px;padding:.5rem 1rem;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important}.form-label{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.card-label{font-weight:600;font-size:20px}.me-n2{margin-right:3.5rem!important}.font{font-family:Inter!important}.phone{flex:0 0 auto;width:62.666667%}@media (min-width: 1024px) and (max-width: 1299px){.title1{text-shadow:1px 1px 1px #096dd7;font-weight:600;font-size:21px!important;line-height:34px;text-align:center;color:#464e5f}.subtext{font-family:Inter;font-size:18px;font-weight:600;line-height:37px;letter-spacing:0em;text-align:center;color:#7e8299}.imgsrc{width:100px}}@media (min-width: 1300px) and (max-width: 1400px){.title1{text-shadow:1px 1px 1px #096dd7;font-weight:600;font-size:21px!important;line-height:34px;text-align:center;color:#464e5f}.subtext{font-family:Inter;font-size:18px;font-weight:600;line-height:37px;letter-spacing:0em;text-align:center;color:#7e8299}.imgsrc{width:100px}}small{color:var(--Gray-500, #667085)!important;font-size:10px!important;font-style:normal;font-weight:400!important;line-height:normal}.border-new{border-radius:0 8px 8px 0!important;border-left:none!important}.border-disabled{padding:5px 0;min-width:auto;max-width:14.5%;border-radius:0!important;border-right:none!important;border-left:none!important}.select-radius{padding:5px 0 5px 15px;border-radius:8px 0 0 8px!important;border-right:none!important}.progressbar-wrapper{height:4px;width:100%;background-color:#f2f4f7;border-radius:4px;position:relative}.progressbar-inner{height:100%;position:absolute;border-radius:4px}small{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}.alert-required{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.mobile-is-invalid{border-radius:0 8px 8px 0!important;border-left:none!important}.code-is-invalid{padding:5px 0;max-width:14.5%;border-radius:0!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;border-right:none!important;border-left:none!important}.country-is-invalid{padding:5px 0 5px 15px;border-radius:8px 0 0 8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;border-right:none!important}.icon-more{font-size:24px;font-weight:600;line-height:32px;color:#7e8299}.password-note{color:var(--Gray-500, #667085);font-size:10px;font-weight:400;line-height:normal}.footer{color:#7e8299!important;font-size:16px!important;font-weight:500!important}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.translate-middle{transform:translate(-65%,-50%)!important}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
|
|
224
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Step1Component, deps: [{ token: i1.ConversionService }, { token: i2.FormBuilder }, { token: i3.AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
225
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: Step1Component, selector: "lib-step1", ngImport: i0, template: "<div class=\"card mt-10 mx-15\">\r\n <div class=\"h-100 px-10 mx-5 my-7\">\r\n <!-- <div>\r\n <img class=\"bubble\" src=\"../../../../../../../assets/Icons/Signup-bubble-icon.svg\"\r\n alt=\"\" srcset=\"\"> -->\r\n <div class=\"mobileshow\">\r\n <h3 class=\"title1 pt-4\">AI co-pilot to boost your sales conversion</h3>\r\n <p class=\"subtext pb-4\">Join the leading global brands in understanding footfall and shopper behavior to\r\n boost\r\n sales.</p>\r\n\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/Lenskart-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/nykaa-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/giva-logo3.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/Duroflex-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/loccitone-logo.svg\" alt=\"\">\r\n </div>\r\n <div class=\"me-20\">\r\n <h4 class=\"icon-more\">30 +</h4>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-12 card-title\">\r\n <h6 class=\"card-label mb-7\">Create an Account</h6>\r\n <form [formGroup]=\"aboutForm\" novalidate=\"novalidate\">\r\n <div class=\"row px-0\">\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"Brand\" class=\"form-label\">Brand Name <span class=\"alert-required\">*</span></label>\r\n <input (blur)=\"onClientNameBlur()\" (input)=\"isClientNameTaken = 0\" formControlName=\"clientName\" type=\"type\" class=\"form-control\" id=\"Brand\" \r\n [ngClass]=\"{ 'is-invalid': aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('required') }\" autocomplete=\"off\" >\r\n \r\n \r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('minlength')\">\r\n Brand name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('maxlength')\">\r\n Brand name must be maximum of 100 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('required')\">\r\n Brand name is required\r\n </small>\r\n <small \r\n *ngIf=\"isClientNameTaken\">\r\n Brand Name already exists\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"row px-0\">\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"firstname\" class=\"form-label\">First Name <span class=\"alert-required\">*</span></label>\r\n <input formControlName=\"firstName\" type=\"type\" class=\"form-control\" id=\"firstname\" autocomplete=\"off\"\r\n [ngClass]=\"{ 'is-invalid': aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('required') }\">\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('minlength')\">\r\n First name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('maxlength')\">\r\n First name must be maximum of 50 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('required')\">\r\n First name is required\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"lastname\" class=\"form-label\">Last Name</label>\r\n <input formControlName=\"lastName\" type=\"type\" class=\"form-control\" id=\"lastname\" autocomplete=\"off\">\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('minlength')\">\r\n Last name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('maxlength')\">\r\n Last name must be maximum of 50 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('required')\">\r\n Last name is required\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Corporate Email <span class=\"alert-required\">*</span></label>\r\n <input (blur)=\"onEmailBlur()\" (input)=\"isEmailTaken = 0\" formControlName=\"corporateEmail\" type=\"email\" class=\"form-control\" id=\"email\" [ngClass]=\"{ 'is-invalid': aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('required') }\"\r\n autocomplete=\"off\">\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('minlength')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('maxlength')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('required')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('pattern')\">\r\n Enter valid email ID\r\n </small>\r\n <small \r\n *ngIf=\"isEmailTaken\">\r\n Email already exists\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n\r\n <label for=\"phonenumber\" class=\"form-label\">Phone number <span class=\"alert-required\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <!-- <div class=\"input-group mb-3\">\r\n <div class=\"input-group-append\"> -->\r\n <!-- <select\r\n class=\"form-select form-select-solid select2-hidden-accessible form-label text-dark fs-4\"\r\n name=\"dialCode\" #dialCode=\"ngModel\"\r\n [ngModelOptions]=\"{standalone: true}\" matNativeControl required\r\n [(ngModel)]=\"countryCodes\" (click)=\"chooseCountry(countryCodes)\">\r\n <option [value]=\"country.dial_code\" *ngFor=\"let country of countryCodeList\"><span\r\n class=\"fw-bolder text-dark ps-3\">\r\n {{ country.name }}</span><span class=\"text-muted\">({{ country.dial_code\r\n }})</span>\r\n </option>\r\n </select> -->\r\n <select formControlName=\"countryCode\" class=\"form-select ps-3 pe-8\" \r\n id=\"inputGroupSelect01\">\r\n <option *ngFor=\"let country of countryList\" class=\"mx-2\" [value]=\"country.phonecode\">{{country.name}}<span class=\"text-muted\">({{ country.phonecode\r\n }})</span></option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <!-- <input [value]=\"aboutForm.get('countryCode')?.value\" type=\"text\" [ngClass]=\"{ 'code-is-invalid': aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required') }\"\r\n class=\"form-control border-disabled\" readonly> -->\r\n <input (blur)=\"onMobileNumberBlur()\" (input)=\"isMobileTaken = 0\" formControlName=\"mobileNumber\" type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\" [ngClass]=\"{ ' is-invalid': aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required') }\"\r\n id=\"phonenumber\" autocomplete=\"off\" minlength=\"7\" maxlength=\"15\">\r\n </div>\r\n </div>\r\n <small \r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required')\">\r\n Phone number is required\r\n </small>\r\n <small *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('pattern')\">\r\n Enter a valid phone number\r\n </small>\r\n <small\r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('min')\">\r\n Enter a valid phone number\r\n </small>\r\n <small\r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('max')\">\r\n Enter a valid phone number\r\n </small>\r\n <small \r\n *ngIf=\"isMobileTaken\">\r\n Phone Number already exists\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"password\" class=\"form-label\">Password <span class=\"alert-required\">*</span></label>\r\n <div class=\"position-relative mb-3\">\r\n <input (input)=\"onPasswordChange($event)\" formControlName=\"password\" [type]=\"passwordShow ? 'text' : 'password'\" [ngClass]=\"{ 'is-invalid': aboutForm.get('password')?.touched && aboutForm.get('password')?.hasError('required') }\"\r\n class=\"form-control\" id=\"password\" autocomplete=\"new-password\">\r\n <span (click)=\"showPassword()\"\r\n class=\"btn btn-sm btn-icon position-absolute translate-middle top-50 end-0\"\r\n data-kt-password-meter-control=\"visibility\">\r\n <i *ngIf=\"passwordShow\" class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n <i *ngIf=\"!passwordShow\" class=\"fa fa-eye-slash\" aria-hidden=\"true\"></i>\r\n </span>\r\n </div>\r\n <div class=\"progressbar-wrapper mt-2\">\r\n <span [style.width]=\"passwordStrength\"\r\n [ngStyle]=\"{'background-color': passwordStrength === '0%' ? '' : (passwordStrength === '25%' ? 'red' : (passwordStrength === '50%' ? 'orange': (passwordStrength === '75%' ? 'yellow' : (passwordStrength === '100%' ? 'green' : '')))) }\"\r\n class=\"progressbar-inner\"></span>\r\n </div>\r\n <div class=\"password-note mt-2\">The password must contain atleast one capital letter and number.</div>\r\n <div>\r\n <small *ngIf=\"aboutForm.get('password')?.hasError('required') && aboutForm.get('password')?.touched\">Password is required</small>\r\n </div>\r\n <div >\r\n <small *ngIf=\"aboutForm.get('password')?.hasError('noSpaces') && aboutForm.get('password')?.touched\">Password cannot contain spaces.</small> \r\n </div>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"confirm\" class=\"form-label\">Confirm Password <span class=\"alert-required\">*</span></label>\r\n <div class=\"position-relative mb-3\">\r\n <input (input)=\"onConfirmPasswordChange($event)\" formControlName=\"confirmPassword\" [type]=\"confirmPasswordShow ? 'text' : 'password'\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': aboutForm.get('confirmPassword')?.touched && aboutForm.get('confirmPassword')?.hasError('required') }\"\r\n id=\"confirm\" autocomplete=\"off\">\r\n <span (click)=\"showConfirmPassword()\"\r\n class=\"btn btn-sm btn-icon position-absolute translate-middle top-50 end-0\"\r\n data-kt-password-meter-control=\"visibility\">\r\n <i *ngIf=\"confirmPasswordShow\" class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n <i *ngIf=\"!confirmPasswordShow\" class=\"fa fa-eye-slash\" aria-hidden=\"true\"></i>\r\n </span>\r\n </div>\r\n <div class=\"progressbar-wrapper mt-2\">\r\n <span [style.width]=\"confirmPasswordStrength\"\r\n [ngStyle]=\"{'background-color': confirmPasswordStrength === '0%' ? '' : (confirmPasswordStrength === '25%' ? 'red' : (confirmPasswordStrength === '50%' ? 'orange': (confirmPasswordStrength === '75%' ? 'yellow' : (confirmPasswordStrength === '100%' ? 'green' : '')))) }\"\r\n class=\"progressbar-inner\"></span>\r\n </div>\r\n <div class=\"password-note mt-2\">The password must contain atleast one capital letter and number.</div>\r\n <div>\r\n <small *ngIf=\"aboutForm.get('confirmPassword')?.hasError('required') && aboutForm.get('confirmPassword')?.touched\">Confirm password is required</small>\r\n <small \r\n *ngIf=\"aboutForm.get('confirmPassword')?.touched && aboutForm.get('confirmPassword')?.hasError('NotEqual') && !aboutForm.get('confirmPassword')?.hasError('required')\">Password\r\n does not match</small>\r\n <small *ngIf=\"aboutForm.get('confirmPassword')?.hasError('noSpaces') && !aboutForm.get('confirmPassword')?.hasError('NotEqual') && aboutForm.get('confirmPassword')?.touched\">Password cannot contain spaces.</small> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n <!-- <ng-container *ngIf=\"currentStep$.value == 1\"> -->\r\n <div class=\"text-end\">\r\n <button [disabled]=\"aboutForm.invalid || isMobileTaken || isEmailTaken || isClientNameTaken\" type=\"button\" class=\"btn btn-lg btn-primary\" (click)=\"nextStep()\">\r\n <span class=\"indicator-label px-5\">\r\n <ng-container>\r\n Next <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M7.5 15L12.5 10L7.5 5\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </ng-container>\r\n\r\n </span>\r\n </button>\r\n </div>\r\n <!-- </ng-container> -->\r\n </div>\r\n\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n <div class=\"mb-3 d-flex flex-column flex-md-row flex-md-stack pt-3 container-fluid\">\r\n <div class=\"text-gray-900 order-2 order-md-1 ms-10\">\r\n <span class=\"me-1 footer\">\u00A9 2024 </span>\r\n <a target=\"_blank\" href=\"https://tangoeye.ai\" class=\"footer\">Tango IT Solutions India Pvt Ltd</a>\r\n </div>\r\n <ul class=\"menu menu-gray-600 menu-hover-primary fw-semibold order-1 me-7\">\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/#aboutus\" class=\"menu-link px-5\">About us</a></li>\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/#contact\" class=\"menu-link px-5\">Contact Us</a></li>\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/privacy-policy-2/\" class=\"menu-link px-5\">Privacy & policy</a></li>\r\n </ul>\r\n </div>\r\n</div>", styles: [".logo{width:16%;height:73px!important;margin-top:150px;margin-left:44%}.heading{margin-left:41%}.title1{color:var(--Gray-700, #344054)!important;font-size:24px!important;font-weight:600!important;line-height:32px}.subtext{color:var(--Gray-400, #98A2B3)!important;font-size:18px!important;font-weight:500!important;line-height:28px}.submit{padding-bottom:2%}.point{background:#ddd;border-radius:2px;display:inline-block;height:5px;width:85px}.form-control{display:block;height:45px;padding:.5rem 1rem;font-size:1rem;font-weight:500;line-height:1}input,button,select,optgroup,textarea{margin:5px 0}.form-control{display:block;color:var(--Gray-500, #667085);font-size:16px;font-weight:400;line-height:24px;-webkit-appearance:none;appearance:none;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-select{font-size:1.1rem;font-weight:600;line-height:24px;height:45px;padding:.5rem 1rem;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important}.form-label{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.card-label{font-weight:600;font-size:20px}.me-n2{margin-right:3.5rem!important}.font{font-family:Inter!important}.phone{flex:0 0 auto;width:62.666667%}@media (min-width: 1024px) and (max-width: 1299px){.title1{text-shadow:1px 1px 1px #096dd7;font-weight:600;font-size:21px!important;line-height:34px;text-align:center;color:#464e5f}.subtext{font-family:Inter;font-size:18px;font-weight:600;line-height:37px;letter-spacing:0em;text-align:center;color:#7e8299}.imgsrc{width:100px}}@media (min-width: 1300px) and (max-width: 1400px){.title1{text-shadow:1px 1px 1px #096dd7;font-weight:600;font-size:21px!important;line-height:34px;text-align:center;color:#464e5f}.subtext{font-family:Inter;font-size:18px;font-weight:600;line-height:37px;letter-spacing:0em;text-align:center;color:#7e8299}.imgsrc{width:100px}}small{color:var(--Gray-500, #667085)!important;font-size:10px!important;font-style:normal;font-weight:400!important;line-height:normal}.border-new{border-radius:0 8px 8px 0!important;border-left:none!important}.border-disabled{padding:5px 0;min-width:auto;max-width:14.5%;border-radius:0!important;border-right:none!important;border-left:none!important}.select-radius{padding:5px 0 5px 15px;border-radius:8px 0 0 8px!important;border-right:none!important}.progressbar-wrapper{height:4px;width:100%;background-color:#f2f4f7;border-radius:4px;position:relative}.progressbar-inner{height:100%;position:absolute;border-radius:4px}small{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}.alert-required{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.mobile-is-invalid{border-radius:0 8px 8px 0!important;border-left:none!important}.code-is-invalid{padding:5px 0;max-width:14.5%;border-radius:0!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;border-right:none!important;border-left:none!important}.country-is-invalid{padding:5px 0 5px 15px;border-radius:8px 0 0 8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;border-right:none!important}.icon-more{font-size:24px;font-weight:600;line-height:32px;color:#7e8299}.password-note{color:var(--Gray-500, #667085);font-size:10px;font-weight:400;line-height:normal}.footer{color:#7e8299!important;font-size:16px!important;font-weight:500!important}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.translate-middle{transform:translate(-65%,-50%)!important}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }] });
|
|
226
226
|
}
|
|
227
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
227
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: Step1Component, decorators: [{
|
|
228
228
|
type: Component,
|
|
229
229
|
args: [{ selector: 'lib-step1', template: "<div class=\"card mt-10 mx-15\">\r\n <div class=\"h-100 px-10 mx-5 my-7\">\r\n <!-- <div>\r\n <img class=\"bubble\" src=\"../../../../../../../assets/Icons/Signup-bubble-icon.svg\"\r\n alt=\"\" srcset=\"\"> -->\r\n <div class=\"mobileshow\">\r\n <h3 class=\"title1 pt-4\">AI co-pilot to boost your sales conversion</h3>\r\n <p class=\"subtext pb-4\">Join the leading global brands in understanding footfall and shopper behavior to\r\n boost\r\n sales.</p>\r\n\r\n\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/Lenskart-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/nykaa-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/giva-logo3.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/Duroflex-logo.svg\" alt=\"\">\r\n </div>\r\n <div>\r\n <img class=\"imgsrc\" src=\"./assets/tango/Icons/loccitone-logo.svg\" alt=\"\">\r\n </div>\r\n <div class=\"me-20\">\r\n <h4 class=\"icon-more\">30 +</h4>\r\n </div>\r\n\r\n </div>\r\n <div class=\"mt-12 card-title\">\r\n <h6 class=\"card-label mb-7\">Create an Account</h6>\r\n <form [formGroup]=\"aboutForm\" novalidate=\"novalidate\">\r\n <div class=\"row px-0\">\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"Brand\" class=\"form-label\">Brand Name <span class=\"alert-required\">*</span></label>\r\n <input (blur)=\"onClientNameBlur()\" (input)=\"isClientNameTaken = 0\" formControlName=\"clientName\" type=\"type\" class=\"form-control\" id=\"Brand\" \r\n [ngClass]=\"{ 'is-invalid': aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('required') }\" autocomplete=\"off\" >\r\n \r\n \r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('minlength')\">\r\n Brand name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('maxlength')\">\r\n Brand name must be maximum of 100 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('clientName')?.touched && aboutForm.get('clientName')?.hasError('required')\">\r\n Brand name is required\r\n </small>\r\n <small \r\n *ngIf=\"isClientNameTaken\">\r\n Brand Name already exists\r\n </small>\r\n </div>\r\n </div>\r\n <div class=\"row px-0\">\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"firstname\" class=\"form-label\">First Name <span class=\"alert-required\">*</span></label>\r\n <input formControlName=\"firstName\" type=\"type\" class=\"form-control\" id=\"firstname\" autocomplete=\"off\"\r\n [ngClass]=\"{ 'is-invalid': aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('required') }\">\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('minlength')\">\r\n First name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('maxlength')\">\r\n First name must be maximum of 50 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('firstName')?.touched && aboutForm.get('firstName')?.hasError('required')\">\r\n First name is required\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"lastname\" class=\"form-label\">Last Name</label>\r\n <input formControlName=\"lastName\" type=\"type\" class=\"form-control\" id=\"lastname\" autocomplete=\"off\">\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('minlength')\">\r\n Last name must be minimum of 3 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('maxlength')\">\r\n Last name must be maximum of 50 letters\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('lastName')?.touched && aboutForm.get('lastName')?.hasError('required')\">\r\n Last name is required\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Corporate Email <span class=\"alert-required\">*</span></label>\r\n <input (blur)=\"onEmailBlur()\" (input)=\"isEmailTaken = 0\" formControlName=\"corporateEmail\" type=\"email\" class=\"form-control\" id=\"email\" [ngClass]=\"{ 'is-invalid': aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('required') }\"\r\n autocomplete=\"off\">\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('minlength')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('maxlength')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('required')\">\r\n Enter a valid email\r\n </small>\r\n <small \r\n *ngIf=\"aboutForm.get('corporateEmail')?.touched && aboutForm.get('corporateEmail')?.hasError('pattern')\">\r\n Enter valid email ID\r\n </small>\r\n <small \r\n *ngIf=\"isEmailTaken\">\r\n Email already exists\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n\r\n <label for=\"phonenumber\" class=\"form-label\">Phone number <span class=\"alert-required\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <!-- <div class=\"input-group mb-3\">\r\n <div class=\"input-group-append\"> -->\r\n <!-- <select\r\n class=\"form-select form-select-solid select2-hidden-accessible form-label text-dark fs-4\"\r\n name=\"dialCode\" #dialCode=\"ngModel\"\r\n [ngModelOptions]=\"{standalone: true}\" matNativeControl required\r\n [(ngModel)]=\"countryCodes\" (click)=\"chooseCountry(countryCodes)\">\r\n <option [value]=\"country.dial_code\" *ngFor=\"let country of countryCodeList\"><span\r\n class=\"fw-bolder text-dark ps-3\">\r\n {{ country.name }}</span><span class=\"text-muted\">({{ country.dial_code\r\n }})</span>\r\n </option>\r\n </select> -->\r\n <select formControlName=\"countryCode\" class=\"form-select ps-3 pe-8\" \r\n id=\"inputGroupSelect01\">\r\n <option *ngFor=\"let country of countryList\" class=\"mx-2\" [value]=\"country.phonecode\">{{country.name}}<span class=\"text-muted\">({{ country.phonecode\r\n }})</span></option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <!-- <input [value]=\"aboutForm.get('countryCode')?.value\" type=\"text\" [ngClass]=\"{ 'code-is-invalid': aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required') }\"\r\n class=\"form-control border-disabled\" readonly> -->\r\n <input (blur)=\"onMobileNumberBlur()\" (input)=\"isMobileTaken = 0\" formControlName=\"mobileNumber\" type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\" [ngClass]=\"{ ' is-invalid': aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required') }\"\r\n id=\"phonenumber\" autocomplete=\"off\" minlength=\"7\" maxlength=\"15\">\r\n </div>\r\n </div>\r\n <small \r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('required')\">\r\n Phone number is required\r\n </small>\r\n <small *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('pattern')\">\r\n Enter a valid phone number\r\n </small>\r\n <small\r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('min')\">\r\n Enter a valid phone number\r\n </small>\r\n <small\r\n *ngIf=\"aboutForm.get('mobileNumber')?.touched && aboutForm.get('mobileNumber')?.hasError('max')\">\r\n Enter a valid phone number\r\n </small>\r\n <small \r\n *ngIf=\"isMobileTaken\">\r\n Phone Number already exists\r\n </small>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"password\" class=\"form-label\">Password <span class=\"alert-required\">*</span></label>\r\n <div class=\"position-relative mb-3\">\r\n <input (input)=\"onPasswordChange($event)\" formControlName=\"password\" [type]=\"passwordShow ? 'text' : 'password'\" [ngClass]=\"{ 'is-invalid': aboutForm.get('password')?.touched && aboutForm.get('password')?.hasError('required') }\"\r\n class=\"form-control\" id=\"password\" autocomplete=\"new-password\">\r\n <span (click)=\"showPassword()\"\r\n class=\"btn btn-sm btn-icon position-absolute translate-middle top-50 end-0\"\r\n data-kt-password-meter-control=\"visibility\">\r\n <i *ngIf=\"passwordShow\" class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n <i *ngIf=\"!passwordShow\" class=\"fa fa-eye-slash\" aria-hidden=\"true\"></i>\r\n </span>\r\n </div>\r\n <div class=\"progressbar-wrapper mt-2\">\r\n <span [style.width]=\"passwordStrength\"\r\n [ngStyle]=\"{'background-color': passwordStrength === '0%' ? '' : (passwordStrength === '25%' ? 'red' : (passwordStrength === '50%' ? 'orange': (passwordStrength === '75%' ? 'yellow' : (passwordStrength === '100%' ? 'green' : '')))) }\"\r\n class=\"progressbar-inner\"></span>\r\n </div>\r\n <div class=\"password-note mt-2\">The password must contain atleast one capital letter and number.</div>\r\n <div>\r\n <small *ngIf=\"aboutForm.get('password')?.hasError('required') && aboutForm.get('password')?.touched\">Password is required</small>\r\n </div>\r\n <div >\r\n <small *ngIf=\"aboutForm.get('password')?.hasError('noSpaces') && aboutForm.get('password')?.touched\">Password cannot contain spaces.</small> \r\n </div>\r\n </div>\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"confirm\" class=\"form-label\">Confirm Password <span class=\"alert-required\">*</span></label>\r\n <div class=\"position-relative mb-3\">\r\n <input (input)=\"onConfirmPasswordChange($event)\" formControlName=\"confirmPassword\" [type]=\"confirmPasswordShow ? 'text' : 'password'\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': aboutForm.get('confirmPassword')?.touched && aboutForm.get('confirmPassword')?.hasError('required') }\"\r\n id=\"confirm\" autocomplete=\"off\">\r\n <span (click)=\"showConfirmPassword()\"\r\n class=\"btn btn-sm btn-icon position-absolute translate-middle top-50 end-0\"\r\n data-kt-password-meter-control=\"visibility\">\r\n <i *ngIf=\"confirmPasswordShow\" class=\"fa fa-eye\" aria-hidden=\"true\"></i>\r\n <i *ngIf=\"!confirmPasswordShow\" class=\"fa fa-eye-slash\" aria-hidden=\"true\"></i>\r\n </span>\r\n </div>\r\n <div class=\"progressbar-wrapper mt-2\">\r\n <span [style.width]=\"confirmPasswordStrength\"\r\n [ngStyle]=\"{'background-color': confirmPasswordStrength === '0%' ? '' : (confirmPasswordStrength === '25%' ? 'red' : (confirmPasswordStrength === '50%' ? 'orange': (confirmPasswordStrength === '75%' ? 'yellow' : (confirmPasswordStrength === '100%' ? 'green' : '')))) }\"\r\n class=\"progressbar-inner\"></span>\r\n </div>\r\n <div class=\"password-note mt-2\">The password must contain atleast one capital letter and number.</div>\r\n <div>\r\n <small *ngIf=\"aboutForm.get('confirmPassword')?.hasError('required') && aboutForm.get('confirmPassword')?.touched\">Confirm password is required</small>\r\n <small \r\n *ngIf=\"aboutForm.get('confirmPassword')?.touched && aboutForm.get('confirmPassword')?.hasError('NotEqual') && !aboutForm.get('confirmPassword')?.hasError('required')\">Password\r\n does not match</small>\r\n <small *ngIf=\"aboutForm.get('confirmPassword')?.hasError('noSpaces') && !aboutForm.get('confirmPassword')?.hasError('NotEqual') && aboutForm.get('confirmPassword')?.touched\">Password cannot contain spaces.</small> \r\n\r\n </div>\r\n </div>\r\n </div>\r\n </form>\r\n <!-- <ng-container *ngIf=\"currentStep$.value == 1\"> -->\r\n <div class=\"text-end\">\r\n <button [disabled]=\"aboutForm.invalid || isMobileTaken || isEmailTaken || isClientNameTaken\" type=\"button\" class=\"btn btn-lg btn-primary\" (click)=\"nextStep()\">\r\n <span class=\"indicator-label px-5\">\r\n <ng-container>\r\n Next <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\"\r\n fill=\"none\">\r\n <path d=\"M7.5 15L12.5 10L7.5 5\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </ng-container>\r\n\r\n </span>\r\n </button>\r\n </div>\r\n <!-- </ng-container> -->\r\n </div>\r\n\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n <div class=\"mb-3 d-flex flex-column flex-md-row flex-md-stack pt-3 container-fluid\">\r\n <div class=\"text-gray-900 order-2 order-md-1 ms-10\">\r\n <span class=\"me-1 footer\">\u00A9 2024 </span>\r\n <a target=\"_blank\" href=\"https://tangoeye.ai\" class=\"footer\">Tango IT Solutions India Pvt Ltd</a>\r\n </div>\r\n <ul class=\"menu menu-gray-600 menu-hover-primary fw-semibold order-1 me-7\">\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/#aboutus\" class=\"menu-link px-5\">About us</a></li>\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/#contact\" class=\"menu-link px-5\">Contact Us</a></li>\r\n <li class=\"menu-item footer\"><a target=\"_blank\" href=\"https://tangoeye.ai/privacy-policy-2/\" class=\"menu-link px-5\">Privacy & policy</a></li>\r\n </ul>\r\n </div>\r\n</div>", styles: [".logo{width:16%;height:73px!important;margin-top:150px;margin-left:44%}.heading{margin-left:41%}.title1{color:var(--Gray-700, #344054)!important;font-size:24px!important;font-weight:600!important;line-height:32px}.subtext{color:var(--Gray-400, #98A2B3)!important;font-size:18px!important;font-weight:500!important;line-height:28px}.submit{padding-bottom:2%}.point{background:#ddd;border-radius:2px;display:inline-block;height:5px;width:85px}.form-control{display:block;height:45px;padding:.5rem 1rem;font-size:1rem;font-weight:500;line-height:1}input,button,select,optgroup,textarea{margin:5px 0}.form-control{display:block;color:var(--Gray-500, #667085);font-size:16px;font-weight:400;line-height:24px;-webkit-appearance:none;appearance:none;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-select{font-size:1.1rem;font-weight:600;line-height:24px;height:45px;padding:.5rem 1rem;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important}.form-label{color:var(--Gray-700, #344054);font-size:14px;font-style:normal;font-weight:500;line-height:20px}.card-label{font-weight:600;font-size:20px}.me-n2{margin-right:3.5rem!important}.font{font-family:Inter!important}.phone{flex:0 0 auto;width:62.666667%}@media (min-width: 1024px) and (max-width: 1299px){.title1{text-shadow:1px 1px 1px #096dd7;font-weight:600;font-size:21px!important;line-height:34px;text-align:center;color:#464e5f}.subtext{font-family:Inter;font-size:18px;font-weight:600;line-height:37px;letter-spacing:0em;text-align:center;color:#7e8299}.imgsrc{width:100px}}@media (min-width: 1300px) and (max-width: 1400px){.title1{text-shadow:1px 1px 1px #096dd7;font-weight:600;font-size:21px!important;line-height:34px;text-align:center;color:#464e5f}.subtext{font-family:Inter;font-size:18px;font-weight:600;line-height:37px;letter-spacing:0em;text-align:center;color:#7e8299}.imgsrc{width:100px}}small{color:var(--Gray-500, #667085)!important;font-size:10px!important;font-style:normal;font-weight:400!important;line-height:normal}.border-new{border-radius:0 8px 8px 0!important;border-left:none!important}.border-disabled{padding:5px 0;min-width:auto;max-width:14.5%;border-radius:0!important;border-right:none!important;border-left:none!important}.select-radius{padding:5px 0 5px 15px;border-radius:8px 0 0 8px!important;border-right:none!important}.progressbar-wrapper{height:4px;width:100%;background-color:#f2f4f7;border-radius:4px;position:relative}.progressbar-inner{height:100%;position:absolute;border-radius:4px}small{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.is-invalid{border-radius:8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;padding-right:calc(1.5em + .75rem)!important;background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzIyMDFfMjA5NTApIj4KPHBhdGggZD0iTTcuOTk5NjcgNS4zMzM5OFY4LjAwMDY1TTcuOTk5NjcgMTAuNjY3M0g4LjAwNjM0TTE0LjY2NjMgOC4wMDA2NUMxNC42NjYzIDExLjY4MjYgMTEuNjgxNiAxNC42NjczIDcuOTk5NjcgMTQuNjY3M0M0LjMxNzc4IDE0LjY2NzMgMS4zMzMwMSAxMS42ODI2IDEuMzMzMDEgOC4wMDA2NUMxLjMzMzAxIDQuMzE4NzUgNC4zMTc3OCAxLjMzMzk4IDcuOTk5NjcgMS4zMzM5OEMxMS42ODE2IDEuMzMzOTggMTQuNjY2MyA0LjMxODc1IDE0LjY2NjMgOC4wMDA2NVoiIHN0cm9rZT0iI0YwNDQzOCIgc3Ryb2tlLXdpZHRoPSIxLjMzMzMzIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8yMjAxXzIwOTUwIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJ3aGl0ZSIvPgo8L2NsaXBQYXRoPgo8L2RlZnM+Cjwvc3ZnPgo=)!important;background-repeat:no-repeat!important;background-position:right calc(.375em + .1875rem) center!important;background-size:calc(.75em + .375rem) calc(.75em + .375rem)!important}.alert-required{color:var(--Error-500, #F04438)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.mobile-is-invalid{border-radius:0 8px 8px 0!important;border-left:none!important}.code-is-invalid{padding:5px 0;max-width:14.5%;border-radius:0!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;border-right:none!important;border-left:none!important}.country-is-invalid{padding:5px 0 5px 15px;border-radius:8px 0 0 8px!important;border:1px solid var(--Error-300, #FDA29B)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;border-right:none!important}.icon-more{font-size:24px;font-weight:600;line-height:32px;color:#7e8299}.password-note{color:var(--Gray-500, #667085);font-size:10px;font-weight:400;line-height:normal}.footer{color:#7e8299!important;font-size:16px!important;font-weight:500!important}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.translate-middle{transform:translate(-65%,-50%)!important}\n"] }]
|
|
230
230
|
}], ctorParameters: () => [{ type: i1.ConversionService }, { type: i2.FormBuilder }, { type: i3.AuthService }, { type: i0.ChangeDetectorRef }] });
|