simpo-component-library 0.0.3 → 0.0.4
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/hover-elements/hover-elements.component.mjs +1 -2
- package/esm2022/lib/sections/banner-section/banner-section.component.mjs +40 -16
- package/esm2022/lib/sections/faq-section/faq-section.component.mjs +42 -13
- package/esm2022/lib/sections/image-carousel-section/image-carousel-section.component.mjs +37 -6
- package/esm2022/lib/sections/image-grid-section/image-grid-section.component.mjs +39 -8
- package/esm2022/lib/sections/image-section/image-section.component.mjs +38 -5
- package/esm2022/lib/sections/navbar-section/navbar-section.component.mjs +24 -6
- package/esm2022/lib/sections/navbar-section/navbar-section.model.mjs +2 -0
- package/esm2022/lib/sections/service-section/service-section.component.mjs +38 -5
- package/esm2022/lib/sections/team-member-section/team-member-section.component.mjs +38 -5
- package/esm2022/lib/sections/testimonial-section/testimonial-section.component.mjs +36 -4
- package/esm2022/lib/sections/text-image-section/text-image-section.component.mjs +36 -3
- package/esm2022/lib/sections/text-section/text-section.component.mjs +36 -3
- package/esm2022/lib/sections/video-section/video-section.component.mjs +38 -6
- package/esm2022/public-api.mjs +3 -6
- package/fesm2022/simpo-component-library.mjs +546 -337
- package/fesm2022/simpo-component-library.mjs.map +1 -1
- package/lib/components/hover-elements/hover-elements.component.d.ts +1 -1
- package/lib/directive/background-directive.d.ts +1 -1
- package/lib/directive/button-directive.directive.d.ts +1 -1
- package/lib/sections/navbar-section/navbar-section.component.d.ts +8 -1
- package/lib/sections/navbar-section/navbar-section.model.d.ts +21 -0
- package/package.json +1 -1
- package/simpo-component-library-0.0.4.tgz +0 -0
- package/simpo-component-library-0.0.3.tgz +0 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as i1$2 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
4
|
import { Directive, Input, EventEmitter, Output, HostListener, Component, ViewChild } from '@angular/core';
|
|
@@ -8,19 +8,29 @@ import { SimpoElementsModule } from '@simpo-ui/elements';
|
|
|
8
8
|
import { SimpoComponentModule } from '@simpo-ui/components';
|
|
9
9
|
import * as i1$1 from '@angular/material/dialog';
|
|
10
10
|
import { MatDialogModule } from '@angular/material/dialog';
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import { ImageFit as ImageFit$1, ImageRatio as ImageRatio$1, contentAlignment as contentAlignment$1, AlignContent as AlignContent$1, BANNERALIGNMENT as BANNERALIGNMENT$1, FooterTypes as FooterTypes$1, TextPosition as TextPosition$1 } from '@simpo-ui/styles';
|
|
11
|
+
import { AnimationDirective as AnimationDirective$1 } from '@simpo-ui/directive/animation-directive';
|
|
12
|
+
import { BorderDirective as BorderDirective$1 } from '@simpo-ui/directive/border-directive';
|
|
13
|
+
import { OverlayDirective as OverlayDirective$1 } from '@simpo-ui/directive/overlay-directive';
|
|
14
|
+
import { BackgroundDirective as BackgroundDirective$1 } from '@simpo-ui/directive/background-directive';
|
|
16
15
|
import { ContentFitDirective as ContentFitDirective$1 } from '@simpo-ui/directive/content-fit-directive';
|
|
17
|
-
import {
|
|
16
|
+
import { ContainerFitDirective as ContainerFitDirective$1 } from '@simpo-ui/directive/container-fir.directive';
|
|
17
|
+
import { HoverDirective as HoverDirective$1 } from '@simpo-ui/directive/hover-element-directive';
|
|
18
|
+
import { BannerContentFitDirective as BannerContentFitDirective$1 } from '@simpo-ui/directive/banner-content-fit-directive';
|
|
19
|
+
import { CornerDirective as CornerDirective$1 } from '@simpo-ui/directive/corner-directive';
|
|
18
20
|
import { ColumnDirectiveDirective as ColumnDirectiveDirective$1 } from '@simpo-ui/directive/column-directive.directive';
|
|
19
21
|
import { ImageDirectiveDirective as ImageDirectiveDirective$1 } from '@simpo-ui/directive/image-directive.directive';
|
|
20
|
-
import {
|
|
22
|
+
import { simpoConetenAlignmentDirective as simpoConetenAlignmentDirective$1 } from '@simpo-ui/directive/content-alignment-directive';
|
|
23
|
+
import { PositionLayoutDirectiveDirective as PositionLayoutDirectiveDirective$1 } from '@simpo-ui/directive/position-layout-directive.directive';
|
|
24
|
+
import { SimpoFooterLayoutDirective as SimpoFooterLayoutDirective$1 } from '@simpo-ui/directive/footer-layout-directive';
|
|
25
|
+
import { ButtonDirectiveDirective as ButtonDirectiveDirective$1 } from '@simpo-ui/directive/button-directive.directive';
|
|
21
26
|
import { TextBackgroundDirectiveDirective as TextBackgroundDirectiveDirective$1 } from '@simpo-ui/directive/text-background-directive.directive';
|
|
22
|
-
import
|
|
23
|
-
import * as
|
|
27
|
+
import { SimpoButtonComponent as SimpoButtonComponent$1 } from '@simpo-ui/elements/simpo-button/simpo-button.component';
|
|
28
|
+
import * as i1 from '@simpo-ui/services/events.service';
|
|
29
|
+
import { MatIconModule } from '@angular/material/icon';
|
|
30
|
+
import { SociaIconsComponent as SociaIconsComponent$1 } from '@simpo-ui/elements/socia-icons/socia-icons.component';
|
|
31
|
+
import { FooterTypes as FooterTypes$1, ImageFit as ImageFit$1, ImageRatio as ImageRatio$1, TextPosition as TextPosition$1, contentAlignment as contentAlignment$1, AlignContent as AlignContent$1, BANNERALIGNMENT as BANNERALIGNMENT$1 } from '@simpo-ui/styles';
|
|
32
|
+
import * as i1$3 from '@angular/platform-browser';
|
|
33
|
+
import * as i2 from '@angular/material/button';
|
|
24
34
|
import { MatButtonModule } from '@angular/material/button';
|
|
25
35
|
|
|
26
36
|
/* eslint-disable @typescript-eslint/no-unused-vars */
|
|
@@ -537,7 +547,6 @@ class HoverElementsComponent {
|
|
|
537
547
|
constructor(_eventService) {
|
|
538
548
|
this._eventService = _eventService;
|
|
539
549
|
this.edit = new EventEmitter();
|
|
540
|
-
this.index = 1;
|
|
541
550
|
}
|
|
542
551
|
ngOnInit() {
|
|
543
552
|
}
|
|
@@ -564,7 +573,7 @@ class HoverElementsComponent {
|
|
|
564
573
|
this._eventService.addNewSectionClick.emit({ status: true, index: this.index, position: position, webCompName: this.data });
|
|
565
574
|
}
|
|
566
575
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HoverElementsComponent, deps: [{ token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
567
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: HoverElementsComponent, isStandalone: true, selector: "simpo-hover-elements", inputs: { data: "data", index: "index" }, outputs: { edit: "edit" }, ngImport: i0, template: "<mat-dialog-content class=\"mat-typography\">\r\n <div class=\"top-btn\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button class=\"add_btn_top\" (click)=\"addSection('ABOVE')\">Add Section +</button>\r\n </div>\r\n <section class=\"hover-tab\">\r\n <div class=\"tabs-section\">\r\n <div class=\"edit-tab\">\r\n <button (click)=\"editSection()\">\r\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g clip-path=\"url(#clip0_1076_52409)\">\r\n <path\r\n d=\"M2 11.4997V13.9997H4.5L11.8733 6.62638L9.37333 4.12638L2 11.4997ZM13.8067 4.69305C14.0667 4.43305 14.0667 4.01305 13.8067 3.75305L12.2467 2.19305C11.9867 1.93305 11.5667 1.93305 11.3067 2.19305L10.0867 3.41305L12.5867 5.91305L13.8067 4.69305Z\"\r\n fill=\"#0267c1\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1076_52409\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <span class=\"edit-text\">\r\n Edit\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button (click)=\"regenerateSection()\">\r\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M4.01108 19.9525C4.27565 20.0656 4.58327 19.9712 4.7378 19.7271L11.7691 8.55522C11.8829 8.3744 11.8898 8.14608 11.7868 7.95956C11.6838 7.77245 11.4869 7.65628 11.2735 7.65628H6.58085L8.32608 0.730146C8.39647 0.450341 8.25397 0.161357 7.98905 0.0474897C7.72585 -0.0657916 7.41628 0.0291694 7.26233 0.272919L0.231082 11.4448C0.117215 11.6256 0.11034 11.8539 0.213348 12.0405C0.316355 12.2276 0.513191 12.3437 0.726629 12.3437H5.41928L3.67405 19.2699C3.60366 19.5497 3.74612 19.8387 4.01108 19.9525Z\"\r\n fill=\"#0267c1\" />\r\n </svg>\r\n <span class=\"edit-text\">\r\n Regenerate\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer'\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button (click)=\"changeContent()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path stroke=\"#0267c1\" stroke-linecap=\"round\" stroke-width=\"1.5\" d=\"M11 12h7m-7-8h7m-7 4h7M2 16h16\">\r\n </path>\r\n <path stroke=\"#0267c1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"\r\n d=\"m2 12 .85714-2.28571M8 12l-.85714-2.28571m0 0L5 4 2.85714 9.71429m4.28572 0H2.85714\"></path>\r\n </svg>\r\n <span class=\"edit-text\">Change Content</span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer'\"></div>\r\n <div class=\"remainin-sections\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button class=\"copy\" (click)=\"copySection()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path\r\n d=\"M9 2c-1.10457 0-2 .89543-2 2v8c0 1.1046.89543 2 2 2h6c1.1046 0 2-.8954 2-2V6.41421c0-.53043-.2107-1.03914-.5858-1.41421L14 2.58579C13.6249 2.21071 13.1162 2 12.5858 2H9Z\">\r\n </path>\r\n <path d=\"M3 8c0-1.10457.89543-2 2-2v10h8c0 1.1046-.8954 2-2 2H5c-1.10457 0-2-.8954-2-2V8Z\"></path>\r\n </svg>\r\n </button>\r\n <button class=\"up-arrow\" (click)=\"moveUp()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M3.29289 9.70711c-.39052-.39053-.39052-1.02369 0-1.41422l6-6c.39053-.39052 1.02371-.39052 1.41421 0l6 6c.3905.39053.3905 1.02369 0 1.41422-.3905.39049-1.0237.39049-1.4142 0L11 5.41421V17c0 .5523-.4477 1-1 1-.55228 0-1-.4477-1-1V5.41421l-4.29289 4.2929c-.39053.39049-1.02369.39049-1.41422 0Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </button>\r\n <button class=\"up-arrow\" (click)=\"moveDown()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M16.7071 10.2929c.3905.3905.3905 1.0237 0 1.4142l-6 6c-.3905.3905-1.02368.3905-1.41421 0l-6-6c-.39052-.3905-.39052-1.0237 0-1.4142.39053-.39053 1.02369-.39053 1.41422 0L9 14.5858V3c0-.55228.44772-1 1-1 .5523 0 1 .44772 1 1v11.5858l4.2929-4.2929c.3905-.39053 1.0237-.39053 1.4142 0Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </button>\r\n <button class=\"up-arrow\" (click)=\"deleteSection()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M9 2c-.37877 0-.72503.214-.89443.55279L7.38197 4H4c-.55228 0-1 .44772-1 1s.44772 1 1 1v10c0 1.1046.89543 2 2 2h8c1.1046 0 2-.8954 2-2V6c.5523 0 1-.44772 1-1s-.4477-1-1-1h-3.382l-.7236-1.44721C11.725 2.214 11.3788 2 11 2H9ZM7 8c0-.55228.44772-1 1-1s1 .44772 1 1v6c0 .5523-.44772 1-1 1s-1-.4477-1-1V8Zm5-1c-.5523 0-1 .44772-1 1v6c0 .5523.4477 1 1 1s1-.4477 1-1V8c0-.55228-.4477-1-1-1Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n </section>\r\n <div class=\"bottom-btn\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button class=\"add_btn\" (click)=\"addSection('BELOW')\">Add Section +</button>\r\n </div>\r\n</mat-dialog-content>", styles: [".hover-tab{display:flex;justify-content:flex-end;align-items:center;position:absolute;right:30px;top:20px;height:auto}.bottom-btn{position:absolute;top:100%;z-index:1001;border-bottom:4px solid #0267c1;width:100%}.bottom-btn .add_btn{width:140px!important;height:36px;background-color:#0267c1;border-radius:4px;transform:translate(-50%,-50%);color:#fff;cursor:pointer;border:none;outline:none;position:absolute;top:100%;left:50%;box-shadow:#00000059 0 5px 15px}.add_btn_top{top:0!important;width:140px!important;height:36px;background-color:#0267c1;border-radius:4px;position:absolute;left:50%;transform:translate(-50%,-50%);color:#fff;cursor:pointer;border:none;outline:none;z-index:1001;box-shadow:#00000059 0 5px 15px}.top-btn{border-bottom:4px solid #0267c1}.tabs-section{width:auto;padding:15px 10px;box-shadow:#63636333 0 2px 8px;border-radius:6px;display:flex;align-items:center;height:60px;background-color:#fff}.edit-tab{display:flex;align-items:center;justify-content:center}.edit-tab button{border:none;outline:none;cursor:pointer;background-color:transparent;padding:0;display:flex;justify-content:center;align-items:center}.edit-text{font-size:14px;color:#0267c1;font-weight:500;position:relative;left:4px}.vr-line{border-left:1px solid #e8e8e8;height:25px;margin-left:14px}.regenerate{margin-left:10px;display:flex;justify-content:center;align-items:center}.regenerate button{border:none;outline:none;cursor:pointer;background-color:transparent;padding:0;display:flex;justify-content:center;align-items:center}.remainin-sections{margin-left:10px;display:flex;justify-content:center;align-items:center}.remainin-sections :is(.copy,.up-arrow){border:none;outline:none;cursor:pointer;background-color:transparent;padding:0}.remainin-sections :is(.copy:hover,.up-arrow:hover) svg{fill:#0267c1}.up-arrow{margin-left:10px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
576
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: HoverElementsComponent, isStandalone: true, selector: "simpo-hover-elements", inputs: { data: "data", index: "index" }, outputs: { edit: "edit" }, ngImport: i0, template: "<mat-dialog-content class=\"mat-typography\">\r\n <div class=\"top-btn\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button class=\"add_btn_top\" (click)=\"addSection('ABOVE')\">Add Section +</button>\r\n </div>\r\n <section class=\"hover-tab\">\r\n <div class=\"tabs-section\">\r\n <div class=\"edit-tab\">\r\n <button (click)=\"editSection()\">\r\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g clip-path=\"url(#clip0_1076_52409)\">\r\n <path\r\n d=\"M2 11.4997V13.9997H4.5L11.8733 6.62638L9.37333 4.12638L2 11.4997ZM13.8067 4.69305C14.0667 4.43305 14.0667 4.01305 13.8067 3.75305L12.2467 2.19305C11.9867 1.93305 11.5667 1.93305 11.3067 2.19305L10.0867 3.41305L12.5867 5.91305L13.8067 4.69305Z\"\r\n fill=\"#0267c1\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1076_52409\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <span class=\"edit-text\">\r\n Edit\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button (click)=\"regenerateSection()\">\r\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M4.01108 19.9525C4.27565 20.0656 4.58327 19.9712 4.7378 19.7271L11.7691 8.55522C11.8829 8.3744 11.8898 8.14608 11.7868 7.95956C11.6838 7.77245 11.4869 7.65628 11.2735 7.65628H6.58085L8.32608 0.730146C8.39647 0.450341 8.25397 0.161357 7.98905 0.0474897C7.72585 -0.0657916 7.41628 0.0291694 7.26233 0.272919L0.231082 11.4448C0.117215 11.6256 0.11034 11.8539 0.213348 12.0405C0.316355 12.2276 0.513191 12.3437 0.726629 12.3437H5.41928L3.67405 19.2699C3.60366 19.5497 3.74612 19.8387 4.01108 19.9525Z\"\r\n fill=\"#0267c1\" />\r\n </svg>\r\n <span class=\"edit-text\">\r\n Regenerate\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer'\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button (click)=\"changeContent()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path stroke=\"#0267c1\" stroke-linecap=\"round\" stroke-width=\"1.5\" d=\"M11 12h7m-7-8h7m-7 4h7M2 16h16\">\r\n </path>\r\n <path stroke=\"#0267c1\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"1.5\"\r\n d=\"m2 12 .85714-2.28571M8 12l-.85714-2.28571m0 0L5 4 2.85714 9.71429m4.28572 0H2.85714\"></path>\r\n </svg>\r\n <span class=\"edit-text\">Change Content</span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer'\"></div>\r\n <div class=\"remainin-sections\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button class=\"copy\" (click)=\"copySection()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path\r\n d=\"M9 2c-1.10457 0-2 .89543-2 2v8c0 1.1046.89543 2 2 2h6c1.1046 0 2-.8954 2-2V6.41421c0-.53043-.2107-1.03914-.5858-1.41421L14 2.58579C13.6249 2.21071 13.1162 2 12.5858 2H9Z\">\r\n </path>\r\n <path d=\"M3 8c0-1.10457.89543-2 2-2v10h8c0 1.1046-.8954 2-2 2H5c-1.10457 0-2-.8954-2-2V8Z\"></path>\r\n </svg>\r\n </button>\r\n <button class=\"up-arrow\" (click)=\"moveUp()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M3.29289 9.70711c-.39052-.39053-.39052-1.02369 0-1.41422l6-6c.39053-.39052 1.02371-.39052 1.41421 0l6 6c.3905.39053.3905 1.02369 0 1.41422-.3905.39049-1.0237.39049-1.4142 0L11 5.41421V17c0 .5523-.4477 1-1 1-.55228 0-1-.4477-1-1V5.41421l-4.29289 4.2929c-.39053.39049-1.02369.39049-1.41422 0Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </button>\r\n <button class=\"up-arrow\" (click)=\"moveDown()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M16.7071 10.2929c.3905.3905.3905 1.0237 0 1.4142l-6 6c-.3905.3905-1.02368.3905-1.41421 0l-6-6c-.39052-.3905-.39052-1.0237 0-1.4142.39053-.39053 1.02369-.39053 1.41422 0L9 14.5858V3c0-.55228.44772-1 1-1 .5523 0 1 .44772 1 1v11.5858l4.2929-4.2929c.3905-.39053 1.0237-.39053 1.4142 0Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </button>\r\n <button class=\"up-arrow\" (click)=\"deleteSection()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"#434443\" viewBox=\"0 0 18 18\" width=\"18\" height=\"18\"\r\n class=\"icon w-5 h-5\" aria-hidden=\"true\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M9 2c-.37877 0-.72503.214-.89443.55279L7.38197 4H4c-.55228 0-1 .44772-1 1s.44772 1 1 1v10c0 1.1046.89543 2 2 2h8c1.1046 0 2-.8954 2-2V6c.5523 0 1-.44772 1-1s-.4477-1-1-1h-3.382l-.7236-1.44721C11.725 2.214 11.3788 2 11 2H9ZM7 8c0-.55228.44772-1 1-1s1 .44772 1 1v6c0 .5523-.44772 1-1 1s-1-.4477-1-1V8Zm5-1c-.5523 0-1 .44772-1 1v6c0 .5523.4477 1 1 1s1-.4477 1-1V8c0-.55228-.4477-1-1-1Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </button>\r\n </div>\r\n </div>\r\n </section>\r\n <div class=\"bottom-btn\" *ngIf=\"data.sectionType != 'footer'\">\r\n <button class=\"add_btn\" (click)=\"addSection('BELOW')\">Add Section +</button>\r\n </div>\r\n</mat-dialog-content>", styles: [".hover-tab{display:flex;justify-content:flex-end;align-items:center;position:absolute;right:30px;top:20px;height:auto}.bottom-btn{position:absolute;top:100%;z-index:1001;border-bottom:4px solid #0267c1;width:100%}.bottom-btn .add_btn{width:140px!important;height:36px;background-color:#0267c1;border-radius:4px;transform:translate(-50%,-50%);color:#fff;cursor:pointer;border:none;outline:none;position:absolute;top:100%;left:50%;box-shadow:#00000059 0 5px 15px}.add_btn_top{top:0!important;width:140px!important;height:36px;background-color:#0267c1;border-radius:4px;position:absolute;left:50%;transform:translate(-50%,-50%);color:#fff;cursor:pointer;border:none;outline:none;z-index:1001;box-shadow:#00000059 0 5px 15px}.top-btn{border-bottom:4px solid #0267c1}.tabs-section{width:auto;padding:15px 10px;box-shadow:#63636333 0 2px 8px;border-radius:6px;display:flex;align-items:center;height:60px;background-color:#fff}.edit-tab{display:flex;align-items:center;justify-content:center}.edit-tab button{border:none;outline:none;cursor:pointer;background-color:transparent;padding:0;display:flex;justify-content:center;align-items:center}.edit-text{font-size:14px;color:#0267c1;font-weight:500;position:relative;left:4px}.vr-line{border-left:1px solid #e8e8e8;height:25px;margin-left:14px}.regenerate{margin-left:10px;display:flex;justify-content:center;align-items:center}.regenerate button{border:none;outline:none;cursor:pointer;background-color:transparent;padding:0;display:flex;justify-content:center;align-items:center}.remainin-sections{margin-left:10px;display:flex;justify-content:center;align-items:center}.remainin-sections :is(.copy,.up-arrow){border:none;outline:none;cursor:pointer;background-color:transparent;padding:0}.remainin-sections :is(.copy:hover,.up-arrow:hover) svg{fill:#0267c1}.up-arrow{margin-left:10px}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i1$1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
568
577
|
}
|
|
569
578
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HoverElementsComponent, decorators: [{
|
|
570
579
|
type: Component,
|
|
@@ -591,7 +600,7 @@ class TextSectionComponent {
|
|
|
591
600
|
this.showEditors = isShow;
|
|
592
601
|
}
|
|
593
602
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TextSectionComponent, deps: [{ token: i1$1.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
594
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TextSectionComponent, isStandalone: true, selector: "simpo-text-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"main-section\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"body-section\">\r\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <simpo-text-element [textData]=\"item.value\"></simpo-text-element>\r\n </div>\r\n <div class=\"d-grid gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\"\r\n [ngClass]=\"[\r\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\r\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\r\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\r\n ]\">\r\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [color]=\"styles?.background?.accentColor\" [sectionId]=\"data?.id\"></app-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 0}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.mt-15{margin-top:15px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
603
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TextSectionComponent, isStandalone: true, selector: "simpo-text-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"main-section\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"body-section\">\r\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <simpo-text-element [textData]=\"item.value\"></simpo-text-element>\r\n </div>\r\n <div class=\"d-grid gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\"\r\n [ngClass]=\"[\r\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\r\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\r\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\r\n ]\">\r\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [color]=\"styles?.background?.accentColor\" [sectionId]=\"data?.id\"></app-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 0}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.mt-15{margin-top:15px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatGridListModule }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: TextElementComponent, selector: "simpo-text-element", inputs: ["textData"] }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }, { kind: "ngmodule", type: MatDialogModule }] }); }
|
|
595
604
|
}
|
|
596
605
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TextSectionComponent, decorators: [{
|
|
597
606
|
type: Component,
|
|
@@ -602,8 +611,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
602
611
|
SimpoElementsModule,
|
|
603
612
|
SimpoComponentModule,
|
|
604
613
|
MatDialogModule,
|
|
614
|
+
SimpoButtonComponent$1,
|
|
615
|
+
AnimationDirective$1,
|
|
616
|
+
BorderDirective$1,
|
|
617
|
+
OverlayDirective$1,
|
|
618
|
+
BackgroundDirective$1,
|
|
619
|
+
ContentFitDirective$1,
|
|
620
|
+
ContainerFitDirective$1,
|
|
621
|
+
HoverDirective$1,
|
|
622
|
+
BannerContentFitDirective$1,
|
|
623
|
+
CornerDirective$1,
|
|
624
|
+
ColumnDirectiveDirective$1,
|
|
625
|
+
ImageDirectiveDirective$1,
|
|
626
|
+
simpoConetenAlignmentDirective$1,
|
|
627
|
+
PositionLayoutDirectiveDirective$1,
|
|
628
|
+
SimpoFooterLayoutDirective$1,
|
|
629
|
+
ButtonDirectiveDirective$1,
|
|
630
|
+
TextBackgroundDirectiveDirective$1,
|
|
605
631
|
SimpoButtonComponent$1
|
|
606
|
-
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"main-section\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"body-section\">\r\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <simpo-text-element [textData]=\"item.value\"></simpo-text-element>\r\n </div>\r\n <div class=\"d-grid gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\"\r\n [ngClass]=\"[\r\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\r\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\r\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\r\n ]\">\r\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [color]=\"styles?.background?.accentColor\" [sectionId]=\"data?.id\"></app-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 0}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.mt-15{margin-top:15px}\n"] }]
|
|
632
|
+
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"rowFlex\" [id]=\"data?.id\" [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"main-section\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"body-section\">\r\n <div [simpoAnimation]=\"styles?.animation\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <simpo-text-element [textData]=\"item.value\"></simpo-text-element>\r\n </div>\r\n <div class=\"d-grid gap-2 d-md-flex mt-15\" *ngIf=\"data?.action?.display\"\r\n [ngClass]=\"[\r\n styles?.layout?.align === 'left' ? 'justify-content-md-start' : '',\r\n styles?.layout?.align === 'center' ? 'justify-content-md-center' : '',\r\n styles?.layout?.align === 'right' ? 'justify-content-md-end' : ''\r\n ]\">\r\n <ng-container *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [color]=\"styles?.background?.accentColor\" [sectionId]=\"data?.id\"></app-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 0}.button-section{margin-top:15px}.clipPath{clip-path:polygon(0% 100%,50% 0%,100% 100%);height:100px;background-color:#00f}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.mt-15{margin-top:15px}\n"] }]
|
|
607
633
|
}], ctorParameters: () => [{ type: i1$1.MatDialog }], propDecorators: { data: [{
|
|
608
634
|
type: Input
|
|
609
635
|
}], index: [{
|
|
@@ -613,6 +639,247 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
613
639
|
args: ['mainContainer']
|
|
614
640
|
}] } });
|
|
615
641
|
|
|
642
|
+
class BannerSectionComponent {
|
|
643
|
+
constructor() {
|
|
644
|
+
this.showEditors = false;
|
|
645
|
+
}
|
|
646
|
+
ngOnInit() {
|
|
647
|
+
this.content = this.data?.content;
|
|
648
|
+
this.styles = this.data?.styles;
|
|
649
|
+
if (!this.styles || !this.content)
|
|
650
|
+
return;
|
|
651
|
+
// this.styles.layout.bannerImageDisplay = this.content.image.showImage;
|
|
652
|
+
}
|
|
653
|
+
showEditTabs(isShow) {
|
|
654
|
+
this.showEditors = isShow;
|
|
655
|
+
}
|
|
656
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: BannerSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
657
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: BannerSectionComponent, isStandalone: true, selector: "simpo-banner-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\">\r\n <div class=\"col-10 col-sm-8 col-lg-6\" *ngIf=\"content?.image?.showImage\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column justify-content-start gap-15\" [id]=\"data?.id\" [simpoContentAlignment]=\"styles?.contentAlignment\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px}.gap-15{gap:15px}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }, { kind: "ngmodule", type:
|
|
658
|
+
// StyleDirectivesModule,
|
|
659
|
+
MatGridListModule }, { kind: "directive", type: AnimationDirective$1, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective$1, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective$1, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective$1, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective$1, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective$1, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: CornerDirective$1, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ImageDirectiveDirective$1, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: simpoConetenAlignmentDirective$1, selector: "[simpoContentAlignment]", inputs: ["simpoContentAlignment"] }, { kind: "directive", type: PositionLayoutDirectiveDirective$1, selector: "[simpoPositionLayoutDirective]", inputs: ["simpoPositionLayoutDirective"] }] }); }
|
|
660
|
+
}
|
|
661
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: BannerSectionComponent, decorators: [{
|
|
662
|
+
type: Component,
|
|
663
|
+
args: [{ selector: 'simpo-banner-section', standalone: true, imports: [
|
|
664
|
+
SimpoElementsModule,
|
|
665
|
+
CommonModule,
|
|
666
|
+
SimpoComponentModule,
|
|
667
|
+
// StyleDirectivesModule,
|
|
668
|
+
MatGridListModule,
|
|
669
|
+
SimpoButtonComponent$1,
|
|
670
|
+
AnimationDirective$1,
|
|
671
|
+
BorderDirective$1,
|
|
672
|
+
OverlayDirective$1,
|
|
673
|
+
BackgroundDirective$1,
|
|
674
|
+
ContentFitDirective$1,
|
|
675
|
+
ContainerFitDirective$1,
|
|
676
|
+
HoverDirective$1,
|
|
677
|
+
BannerContentFitDirective$1,
|
|
678
|
+
CornerDirective$1,
|
|
679
|
+
ColumnDirectiveDirective$1,
|
|
680
|
+
ImageDirectiveDirective$1,
|
|
681
|
+
simpoConetenAlignmentDirective$1,
|
|
682
|
+
PositionLayoutDirectiveDirective$1,
|
|
683
|
+
SimpoFooterLayoutDirective$1,
|
|
684
|
+
ButtonDirectiveDirective$1,
|
|
685
|
+
TextBackgroundDirectiveDirective$1
|
|
686
|
+
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\">\r\n <div class=\"col-10 col-sm-8 col-lg-6\" *ngIf=\"content?.image?.showImage\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column justify-content-start gap-15\" [id]=\"data?.id\" [simpoContentAlignment]=\"styles?.contentAlignment\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px}.gap-15{gap:15px}\n"] }]
|
|
687
|
+
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
688
|
+
type: Input
|
|
689
|
+
}], index: [{
|
|
690
|
+
type: Input
|
|
691
|
+
}] } });
|
|
692
|
+
|
|
693
|
+
class HeadingElementComponent {
|
|
694
|
+
constructor() {
|
|
695
|
+
this.data = '';
|
|
696
|
+
}
|
|
697
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HeadingElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
698
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: HeadingElementComponent, isStandalone: true, selector: "simpo-heading-element", inputs: { data: "data" }, ngImport: i0, template: "<h2 class=\"heading-large\" [innerHtml]=\"data\"></h2>\n", styles: [""] }); }
|
|
699
|
+
}
|
|
700
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HeadingElementComponent, decorators: [{
|
|
701
|
+
type: Component,
|
|
702
|
+
args: [{ selector: 'simpo-heading-element', standalone: true, imports: [], template: "<h2 class=\"heading-large\" [innerHtml]=\"data\"></h2>\n" }]
|
|
703
|
+
}], propDecorators: { data: [{
|
|
704
|
+
type: Input
|
|
705
|
+
}] } });
|
|
706
|
+
|
|
707
|
+
class FaqSectionComponent {
|
|
708
|
+
constructor() {
|
|
709
|
+
this.showEditors = false;
|
|
710
|
+
}
|
|
711
|
+
ngOnInit() {
|
|
712
|
+
this.content = this.data?.content;
|
|
713
|
+
this.style = this.data?.styles;
|
|
714
|
+
}
|
|
715
|
+
showEditTabs(isShow) {
|
|
716
|
+
this.showEditors = isShow;
|
|
717
|
+
}
|
|
718
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FaqSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
719
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: FaqSectionComponent, isStandalone: true, selector: "simpo-faq-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid flex-col\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoAnimation]=\"style?.animation\" [simpoLayout]=\"style?.layout\">\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"mb-2\">\n <simpo-heading-element [data]=\"text.value\"></simpo-heading-element>\n </div>\n\n <div *ngFor=\"let itemData of content?.listItem?.data;let i = index\" class=\"data\">\n <p class=\"heading-medium\" data-toggle=\"collapse\" [attr.data-target]=\"'#collapse-' + i\">\n {{itemData.inputText[0].value}}</p>\n <div class=\"body-desc desc collapse multi-collapse\" [attr.id]=\"'collapse-' + i\">{{itemData.inputText[1].value}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".mb-2{margin-bottom:2.5rem!important}.data{display:flex;flex-direction:column;gap:1rem;padding-top:2.5rem;padding-bottom:2.5rem;box-shadow:#11182733 0 -1px inset;cursor:pointer}.flex-col{display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{height:auto;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: HeadingElementComponent, selector: "simpo-heading-element", inputs: ["data"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ContentFitDirective$1, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "ngmodule", type:
|
|
720
|
+
// StyleDirectivesModule,
|
|
721
|
+
SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }, { kind: "directive", type: AnimationDirective$1, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective$1, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective$1, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective$1, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: HoverDirective$1, selector: "[simpoHover]", outputs: ["hovering"] }] }); }
|
|
722
|
+
}
|
|
723
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FaqSectionComponent, decorators: [{
|
|
724
|
+
type: Component,
|
|
725
|
+
args: [{ selector: 'simpo-faq-section', standalone: true, imports: [
|
|
726
|
+
SimpoElementsModule,
|
|
727
|
+
CommonModule,
|
|
728
|
+
ContentFitDirective$1,
|
|
729
|
+
// StyleDirectivesModule,
|
|
730
|
+
SimpoComponentModule,
|
|
731
|
+
SimpoButtonComponent$1,
|
|
732
|
+
AnimationDirective$1,
|
|
733
|
+
BorderDirective$1,
|
|
734
|
+
OverlayDirective$1,
|
|
735
|
+
BackgroundDirective$1,
|
|
736
|
+
ContentFitDirective$1,
|
|
737
|
+
ContainerFitDirective$1,
|
|
738
|
+
HoverDirective$1,
|
|
739
|
+
BannerContentFitDirective$1,
|
|
740
|
+
CornerDirective$1,
|
|
741
|
+
ColumnDirectiveDirective$1,
|
|
742
|
+
ImageDirectiveDirective$1,
|
|
743
|
+
simpoConetenAlignmentDirective$1,
|
|
744
|
+
PositionLayoutDirectiveDirective$1,
|
|
745
|
+
SimpoFooterLayoutDirective$1,
|
|
746
|
+
ButtonDirectiveDirective$1,
|
|
747
|
+
TextBackgroundDirectiveDirective$1
|
|
748
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid flex-col\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoAnimation]=\"style?.animation\" [simpoLayout]=\"style?.layout\">\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"mb-2\">\n <simpo-heading-element [data]=\"text.value\"></simpo-heading-element>\n </div>\n\n <div *ngFor=\"let itemData of content?.listItem?.data;let i = index\" class=\"data\">\n <p class=\"heading-medium\" data-toggle=\"collapse\" [attr.data-target]=\"'#collapse-' + i\">\n {{itemData.inputText[0].value}}</p>\n <div class=\"body-desc desc collapse multi-collapse\" [attr.id]=\"'collapse-' + i\">{{itemData.inputText[1].value}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".mb-2{margin-bottom:2.5rem!important}.data{display:flex;flex-direction:column;gap:1rem;padding-top:2.5rem;padding-bottom:2.5rem;box-shadow:#11182733 0 -1px inset;cursor:pointer}.flex-col{display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{height:auto;position:relative}\n"] }]
|
|
749
|
+
}], propDecorators: { data: [{
|
|
750
|
+
type: Input
|
|
751
|
+
}], index: [{
|
|
752
|
+
type: Input
|
|
753
|
+
}] } });
|
|
754
|
+
|
|
755
|
+
class SociaIconsComponent {
|
|
756
|
+
constructor() { }
|
|
757
|
+
ngOnInit() {
|
|
758
|
+
}
|
|
759
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SociaIconsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
760
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: SociaIconsComponent, isStandalone: true, selector: "simpo-socia-icons", inputs: { socialIconData: "socialIconData", color: "color" }, ngImport: i0, template: "<div *ngIf=\"socialIconData?.type == 'FACEBOOK'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10.4375 21.8784C5.65941 21.1274 2 16.9877 2 12 2 6.48086 6.48086 2 12 2c5.5191 0 10 4.48086 10 10 0 4.9877-3.6594 9.1274-8.4375 9.8784v-6.9878h2.3301L16.3359 12h-2.7734v-1.8758c0-.79084.3874-1.5617 1.6296-1.5617h1.261V6.10156s-1.1443-.19531-2.2385-.19531c-2.2842 0-3.7771 1.38438-3.7771 3.89063V12H7.89844v2.8906h2.53906v6.9878Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TWITTER'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M13.6756 10.6218 20.2324 3h-1.5537l-5.6933 6.61788L8.43817 3H3.1935l6.8763 10.0074L3.1935 21h1.55384l6.01226-6.9887L15.5618 21h5.2447l-7.1313-10.3782h.0004Zm-2.1282 2.4738-.6967-.9965-5.54349-7.92939h2.38662l4.47367 6.39919.6967.9966 5.8152 8.318h-2.3866l-4.7454-6.7875v-.0004Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'LINKEDIN'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M19.5565 2C20.9051 2 22 3.09492 22 4.44352V19.5565C22 20.9051 20.9051 22 19.5565 22H4.44352C3.09492 22 2 20.9051 2 19.5565V4.44352C2 3.09492 3.09488 2 4.44352 2H19.5565ZM8.26801 18.5343V9.71723H5.33676v8.81707h2.93125Zm10.56789 0v-5.0562c0-2.7083-1.446-3.96822-3.3742-3.96822-1.5549 0-2.2513.85512-2.6413 1.45572V9.71723H9.88988c.03887.82737 0 8.81707 0 8.81707h2.93052v-4.9241c0-.2636.0189-.527.0966-.7154.2115-.5264.694-1.0716 1.5037-1.0716 1.0599 0 1.4846.8088 1.4846 1.9936v4.7175h2.9306ZM6.82219 5.4657c-1.00289 0-1.65813.65934-1.65813 1.52352 0 .84601.63532 1.52351 1.61934 1.52351 1.02207 0 1.67719-.6775 1.67719-1.52351-.01895-.86297-.63442-1.52164-1.6384-1.52352Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'YOUTUBE'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M21.0053 5.6191c.5996.6477.7946 2.11879.7946 2.11879S22 9.46405 22 11.1908v1.618c0 1.7268-.2001 3.453-.2001 3.453s-.1956 1.4705-.7946 2.1169c-.6859.7654-1.4461.8449-1.8754.8897-.0469.0049-.0899.0094-.1283.0143-2.799.2145-7.0016.222-7.0016.222s-5.20038-.0507-6.80025-.2145c-.07572-.0151-.16746-.0268-.27131-.0402-.50666-.0651-1.3018-.1673-1.93375-.8719-.59957-.6465-.79463-2.1169-.79463-2.1169S2 14.5356 2 12.8082v-1.618c0-1.72615.20006-3.45231.20006-3.45231s.19569-1.47109.79463-2.11879c.68895-.76815 1.4516-.84541 1.88002-.88881.04511-.00457.08651-.00876.12373-.01335C7.79681 4.5 11.995 4.5 11.995 4.5h.0094s4.1982 0 6.9972.21694c.0372.00459.0786.00879.1238.01336.4285.0434 1.1916.12069 1.8799.8888Zm-5.251 6.3832-6.25196 3.7512V8.25117l6.25196 3.75113Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'INSTAGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M12 2c5.5191 0 10 4.48086 10 10 0 5.5191-4.4809 10-10 10-5.51914 0-10-4.4809-10-10C2 6.48086 6.48086 2 12 2Zm0 3.75c-1.6974 0-1.9102.00719-2.57688.03762-.66523.03035-1.11957.13601-1.51714.29051-.41098.15972-.75953.37343-1.107.72089-.34746.34746-.56117.69602-.72089 1.107-.1545.39753-.26012.85187-.29051 1.5171C5.75719 10.0898 5.75 10.3026 5.75 12s.00719 1.9102.03758 2.5769c.03039.6652.13601 1.1195.29051 1.5171.15972.411.37343.7595.72089 1.107.34747.3475.69602.5612 1.107.7209.39757.1545.85191.2601 1.51714.2905.66668.0304.87948.0376 2.57688.0376s1.9102-.0072 2.5769-.0376c.6652-.0304 1.1195-.136 1.5171-.2905.411-.1597.7595-.3734 1.107-.7209.3475-.3475.5612-.696.7209-1.107.1545-.3976.2601-.8519.2905-1.5171.0304-.6667.0376-.8795.0376-2.5769 0-1.6974-.0072-1.9102-.0376-2.57688-.0304-.66523-.136-1.11957-.2905-1.5171-.1597-.41098-.3734-.75954-.7209-1.107s-.696-.56117-1.107-.72089c-.3976-.1545-.8519-.26016-1.5171-.29051C13.9102 5.75719 13.6974 5.75 12 5.75Zm0 1.12613c1.6688 0 1.8665.00637 2.5255.03645.6094.02781.9403.12961 1.1606.21519.2917.11336.4999.24883.7186.46754.2187.21867.3542.42692.4675.71864.0856.22023.1874.55113.2152 1.1605.0301.65905.0365.85675.0365 2.52555s-.0064 1.8665-.0365 2.5255c-.0278.6094-.1296.9403-.2152 1.1606-.1133.2917-.2488.4999-.4675.7186-.2187.2187-.4269.3542-.7186.4675-.2203.0856-.5512.1874-1.1606.2152-.6589.0301-.8566.0365-2.5255.0365s-1.8666-.0064-2.52555-.0365c-.60937-.0278-.94027-.1296-1.1605-.2152-.29176-.1133-.49997-.2488-.71868-.4675-.21871-.2187-.35414-.4269-.4675-.7186-.08558-.2203-.18742-.5512-.21523-1.1606-.03008-.659-.03641-.8567-.03641-2.5255s.00633-1.8665.03641-2.52555c.02781-.60937.12965-.94027.21523-1.1605.11336-.29172.24879-.49997.4675-.71864.21871-.21871.42692-.35418.71868-.46754.22023-.08558.55113-.18738 1.1605-.21519.65905-.03008.85675-.03645 2.52555-.03645Zm0 1.91442c-1.7725 0-3.20945 1.43695-3.20945 3.20945S10.2275 15.2095 12 15.2095s3.2095-1.437 3.2095-3.2095c0-1.7725-1.437-3.20945-3.2095-3.20945Zm0 5.29275c-1.1506 0-2.08332-.9327-2.08332-2.0833 0-1.1506.93272-2.08332 2.08332-2.08332S14.0833 10.8494 14.0833 12 13.1506 14.0833 12 14.0833Zm4.0863-5.41955c0 .41422-.3358.74996-.7501.74996-.4141 0-.7499-.33574-.7499-.74996s.3358-.75.7499-.75c.4143 0 .7501.33578.7501.75Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TELEGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M22 12c0 5.5229-4.4771 10-10 10-5.52285 0-10-4.4771-10-10C2 6.47715 6.47715 2 12 2c5.5229 0 10 4.47715 10 10Zm-9.6417-2.61755c-.9726.40455-2.91653 1.24185-5.83173 2.51195-.47339.1883-.72136.3725-.74394.5525-.03815.3044.34296.4242.86192.5874.0706.0222.14374.0452.21872.0695.51059.166 1.19741.3602 1.55446.3679.32388.007.68537-.1265 1.08446-.4006 2.72381-1.8386 4.12981-2.7679 4.21801-2.788.0623-.0141.1486-.0319.2071.0201.0585.052.0527.1504.0465.1768-.0377.1609-1.5335 1.5516-2.3077 2.2714-.2415.2244-.4127.3836-.4477.42-.0784.0814-.1583.1584-.2351.2325-.4743.4572-.83.8001.0197 1.3601.4084.2691.7352.4917 1.0612.7137.356.2424.7111.4842 1.1705.7854.117.0767.2288.1564.3377.234.4143.2954.7865.5608 1.2464.5184.2672-.0245.5432-.2758.6834-1.0252.3313-1.771.9825-5.6083 1.133-7.18949.0132-.13853-.0034-.31583-.0167-.39367-.0134-.07782-.0412-.18872-.1424-.2708-.1198-.09722-.3048-.11772-.3875-.11627-.3761.00663-.9531.20728-3.7303 1.36238Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'THREADS'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M12.1482 21.6888h-.0058c-2.89118-.0194-5.1138-.9727-6.60781-2.833-1.32737-1.6568-2.01334-3.9608-2.03659-6.848v-.0136c.02325-2.88921.70922-5.19128 2.03853-6.84806C7.0286 3.28395 9.25316 2.33057 12.1424 2.31119h.0116c2.2168.0155 4.0712.5852 5.511 1.6936 1.3545 1.04252 2.3079 2.52685 2.833 4.41423l-1.6471.45925c-.8914-3.19731-3.1469-4.83085-6.7047-4.85604-2.34853.01744-4.12546.75573-5.28037 2.19355C5.7865 7.56253 5.22842 9.50804 5.20711 12c.02131 2.492.57939 4.4375 1.66066 5.7842 1.15491 1.4398 2.93184 2.1781 5.28043 2.1936 2.118-.0155 3.519-.5097 4.6836-1.651 1.3293-1.3022 1.306-2.9008.8797-3.8736-.25-.5736-.7054-1.0503-1.3196-1.4126-.155 1.0909-.5019 1.9746-1.0367 2.6412-.7151.8894-1.7285 1.3758-3.0113 1.4455-.9708.0523-1.9068-.1763-2.63149-.6472-.85843-.5561-1.36031-1.4049-1.41457-2.3931-.05232-.9612.32942-1.8448 1.07352-2.4881.71114-.6143 1.71104-.9747 2.89304-1.0425.8701-.0485 1.6859-.0097 2.4377.1143-.1007-.5988-.3022-1.07546-.6045-1.41844-.4147-.47282-1.0561-.7131-1.9049-.71891h-.0232c-.6821 0-1.6084.18796-2.19743 1.06577l-1.41844-.95145c.7906-1.17428 2.07337-1.82149 3.61587-1.82149h.0349c2.5791.0155 4.1158 1.59478 4.2689 4.35032.0872.0368.1744.0755.2596.1143 1.2034.5658 2.0831 1.4223 2.5462 2.4784.6434 1.4707.7035 3.8678-1.2498 5.7803-1.494 1.4611-3.3058 2.1219-5.8753 2.1393h-.0058Zm.81-9.4388c-.1958 0-.3934.0058-.5969.0174-1.4824.0833-2.40667.7635-2.3544 1.7304.0543 1.0135 1.1724 1.4844 2.2479 1.4262.9882-.0523 2.2749-.4379 2.4919-2.9957-.5464-.1183-1.1452-.1783-1.7885-.1783Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
761
|
+
}
|
|
762
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SociaIconsComponent, decorators: [{
|
|
763
|
+
type: Component,
|
|
764
|
+
args: [{ selector: 'simpo-socia-icons', standalone: true, imports: [
|
|
765
|
+
CommonModule
|
|
766
|
+
], template: "<div *ngIf=\"socialIconData?.type == 'FACEBOOK'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10.4375 21.8784C5.65941 21.1274 2 16.9877 2 12 2 6.48086 6.48086 2 12 2c5.5191 0 10 4.48086 10 10 0 4.9877-3.6594 9.1274-8.4375 9.8784v-6.9878h2.3301L16.3359 12h-2.7734v-1.8758c0-.79084.3874-1.5617 1.6296-1.5617h1.261V6.10156s-1.1443-.19531-2.2385-.19531c-2.2842 0-3.7771 1.38438-3.7771 3.89063V12H7.89844v2.8906h2.53906v6.9878Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TWITTER'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M13.6756 10.6218 20.2324 3h-1.5537l-5.6933 6.61788L8.43817 3H3.1935l6.8763 10.0074L3.1935 21h1.55384l6.01226-6.9887L15.5618 21h5.2447l-7.1313-10.3782h.0004Zm-2.1282 2.4738-.6967-.9965-5.54349-7.92939h2.38662l4.47367 6.39919.6967.9966 5.8152 8.318h-2.3866l-4.7454-6.7875v-.0004Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'LINKEDIN'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M19.5565 2C20.9051 2 22 3.09492 22 4.44352V19.5565C22 20.9051 20.9051 22 19.5565 22H4.44352C3.09492 22 2 20.9051 2 19.5565V4.44352C2 3.09492 3.09488 2 4.44352 2H19.5565ZM8.26801 18.5343V9.71723H5.33676v8.81707h2.93125Zm10.56789 0v-5.0562c0-2.7083-1.446-3.96822-3.3742-3.96822-1.5549 0-2.2513.85512-2.6413 1.45572V9.71723H9.88988c.03887.82737 0 8.81707 0 8.81707h2.93052v-4.9241c0-.2636.0189-.527.0966-.7154.2115-.5264.694-1.0716 1.5037-1.0716 1.0599 0 1.4846.8088 1.4846 1.9936v4.7175h2.9306ZM6.82219 5.4657c-1.00289 0-1.65813.65934-1.65813 1.52352 0 .84601.63532 1.52351 1.61934 1.52351 1.02207 0 1.67719-.6775 1.67719-1.52351-.01895-.86297-.63442-1.52164-1.6384-1.52352Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'YOUTUBE'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M21.0053 5.6191c.5996.6477.7946 2.11879.7946 2.11879S22 9.46405 22 11.1908v1.618c0 1.7268-.2001 3.453-.2001 3.453s-.1956 1.4705-.7946 2.1169c-.6859.7654-1.4461.8449-1.8754.8897-.0469.0049-.0899.0094-.1283.0143-2.799.2145-7.0016.222-7.0016.222s-5.20038-.0507-6.80025-.2145c-.07572-.0151-.16746-.0268-.27131-.0402-.50666-.0651-1.3018-.1673-1.93375-.8719-.59957-.6465-.79463-2.1169-.79463-2.1169S2 14.5356 2 12.8082v-1.618c0-1.72615.20006-3.45231.20006-3.45231s.19569-1.47109.79463-2.11879c.68895-.76815 1.4516-.84541 1.88002-.88881.04511-.00457.08651-.00876.12373-.01335C7.79681 4.5 11.995 4.5 11.995 4.5h.0094s4.1982 0 6.9972.21694c.0372.00459.0786.00879.1238.01336.4285.0434 1.1916.12069 1.8799.8888Zm-5.251 6.3832-6.25196 3.7512V8.25117l6.25196 3.75113Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'INSTAGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M12 2c5.5191 0 10 4.48086 10 10 0 5.5191-4.4809 10-10 10-5.51914 0-10-4.4809-10-10C2 6.48086 6.48086 2 12 2Zm0 3.75c-1.6974 0-1.9102.00719-2.57688.03762-.66523.03035-1.11957.13601-1.51714.29051-.41098.15972-.75953.37343-1.107.72089-.34746.34746-.56117.69602-.72089 1.107-.1545.39753-.26012.85187-.29051 1.5171C5.75719 10.0898 5.75 10.3026 5.75 12s.00719 1.9102.03758 2.5769c.03039.6652.13601 1.1195.29051 1.5171.15972.411.37343.7595.72089 1.107.34747.3475.69602.5612 1.107.7209.39757.1545.85191.2601 1.51714.2905.66668.0304.87948.0376 2.57688.0376s1.9102-.0072 2.5769-.0376c.6652-.0304 1.1195-.136 1.5171-.2905.411-.1597.7595-.3734 1.107-.7209.3475-.3475.5612-.696.7209-1.107.1545-.3976.2601-.8519.2905-1.5171.0304-.6667.0376-.8795.0376-2.5769 0-1.6974-.0072-1.9102-.0376-2.57688-.0304-.66523-.136-1.11957-.2905-1.5171-.1597-.41098-.3734-.75954-.7209-1.107s-.696-.56117-1.107-.72089c-.3976-.1545-.8519-.26016-1.5171-.29051C13.9102 5.75719 13.6974 5.75 12 5.75Zm0 1.12613c1.6688 0 1.8665.00637 2.5255.03645.6094.02781.9403.12961 1.1606.21519.2917.11336.4999.24883.7186.46754.2187.21867.3542.42692.4675.71864.0856.22023.1874.55113.2152 1.1605.0301.65905.0365.85675.0365 2.52555s-.0064 1.8665-.0365 2.5255c-.0278.6094-.1296.9403-.2152 1.1606-.1133.2917-.2488.4999-.4675.7186-.2187.2187-.4269.3542-.7186.4675-.2203.0856-.5512.1874-1.1606.2152-.6589.0301-.8566.0365-2.5255.0365s-1.8666-.0064-2.52555-.0365c-.60937-.0278-.94027-.1296-1.1605-.2152-.29176-.1133-.49997-.2488-.71868-.4675-.21871-.2187-.35414-.4269-.4675-.7186-.08558-.2203-.18742-.5512-.21523-1.1606-.03008-.659-.03641-.8567-.03641-2.5255s.00633-1.8665.03641-2.52555c.02781-.60937.12965-.94027.21523-1.1605.11336-.29172.24879-.49997.4675-.71864.21871-.21871.42692-.35418.71868-.46754.22023-.08558.55113-.18738 1.1605-.21519.65905-.03008.85675-.03645 2.52555-.03645Zm0 1.91442c-1.7725 0-3.20945 1.43695-3.20945 3.20945S10.2275 15.2095 12 15.2095s3.2095-1.437 3.2095-3.2095c0-1.7725-1.437-3.20945-3.2095-3.20945Zm0 5.29275c-1.1506 0-2.08332-.9327-2.08332-2.0833 0-1.1506.93272-2.08332 2.08332-2.08332S14.0833 10.8494 14.0833 12 13.1506 14.0833 12 14.0833Zm4.0863-5.41955c0 .41422-.3358.74996-.7501.74996-.4141 0-.7499-.33574-.7499-.74996s.3358-.75.7499-.75c.4143 0 .7501.33578.7501.75Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TELEGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M22 12c0 5.5229-4.4771 10-10 10-5.52285 0-10-4.4771-10-10C2 6.47715 6.47715 2 12 2c5.5229 0 10 4.47715 10 10Zm-9.6417-2.61755c-.9726.40455-2.91653 1.24185-5.83173 2.51195-.47339.1883-.72136.3725-.74394.5525-.03815.3044.34296.4242.86192.5874.0706.0222.14374.0452.21872.0695.51059.166 1.19741.3602 1.55446.3679.32388.007.68537-.1265 1.08446-.4006 2.72381-1.8386 4.12981-2.7679 4.21801-2.788.0623-.0141.1486-.0319.2071.0201.0585.052.0527.1504.0465.1768-.0377.1609-1.5335 1.5516-2.3077 2.2714-.2415.2244-.4127.3836-.4477.42-.0784.0814-.1583.1584-.2351.2325-.4743.4572-.83.8001.0197 1.3601.4084.2691.7352.4917 1.0612.7137.356.2424.7111.4842 1.1705.7854.117.0767.2288.1564.3377.234.4143.2954.7865.5608 1.2464.5184.2672-.0245.5432-.2758.6834-1.0252.3313-1.771.9825-5.6083 1.133-7.18949.0132-.13853-.0034-.31583-.0167-.39367-.0134-.07782-.0412-.18872-.1424-.2708-.1198-.09722-.3048-.11772-.3875-.11627-.3761.00663-.9531.20728-3.7303 1.36238Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'THREADS'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M12.1482 21.6888h-.0058c-2.89118-.0194-5.1138-.9727-6.60781-2.833-1.32737-1.6568-2.01334-3.9608-2.03659-6.848v-.0136c.02325-2.88921.70922-5.19128 2.03853-6.84806C7.0286 3.28395 9.25316 2.33057 12.1424 2.31119h.0116c2.2168.0155 4.0712.5852 5.511 1.6936 1.3545 1.04252 2.3079 2.52685 2.833 4.41423l-1.6471.45925c-.8914-3.19731-3.1469-4.83085-6.7047-4.85604-2.34853.01744-4.12546.75573-5.28037 2.19355C5.7865 7.56253 5.22842 9.50804 5.20711 12c.02131 2.492.57939 4.4375 1.66066 5.7842 1.15491 1.4398 2.93184 2.1781 5.28043 2.1936 2.118-.0155 3.519-.5097 4.6836-1.651 1.3293-1.3022 1.306-2.9008.8797-3.8736-.25-.5736-.7054-1.0503-1.3196-1.4126-.155 1.0909-.5019 1.9746-1.0367 2.6412-.7151.8894-1.7285 1.3758-3.0113 1.4455-.9708.0523-1.9068-.1763-2.63149-.6472-.85843-.5561-1.36031-1.4049-1.41457-2.3931-.05232-.9612.32942-1.8448 1.07352-2.4881.71114-.6143 1.71104-.9747 2.89304-1.0425.8701-.0485 1.6859-.0097 2.4377.1143-.1007-.5988-.3022-1.07546-.6045-1.41844-.4147-.47282-1.0561-.7131-1.9049-.71891h-.0232c-.6821 0-1.6084.18796-2.19743 1.06577l-1.41844-.95145c.7906-1.17428 2.07337-1.82149 3.61587-1.82149h.0349c2.5791.0155 4.1158 1.59478 4.2689 4.35032.0872.0368.1744.0755.2596.1143 1.2034.5658 2.0831 1.4223 2.5462 2.4784.6434 1.4707.7035 3.8678-1.2498 5.7803-1.494 1.4611-3.3058 2.1219-5.8753 2.1393h-.0058Zm.81-9.4388c-.1958 0-.3934.0058-.5969.0174-1.4824.0833-2.40667.7635-2.3544 1.7304.0543 1.0135 1.1724 1.4844 2.2479 1.4262.9882-.0523 2.2749-.4379 2.4919-2.9957-.5464-.1183-1.1452-.1783-1.7885-.1783Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>" }]
|
|
767
|
+
}], ctorParameters: () => [], propDecorators: { socialIconData: [{
|
|
768
|
+
type: Input
|
|
769
|
+
}], color: [{
|
|
770
|
+
type: Input
|
|
771
|
+
}] } });
|
|
772
|
+
|
|
773
|
+
class SimpoFooterLayoutDirective {
|
|
774
|
+
constructor(el, eventService) {
|
|
775
|
+
this.el = el;
|
|
776
|
+
this.eventService = eventService;
|
|
777
|
+
}
|
|
778
|
+
ngOnInit() {
|
|
779
|
+
this.appply();
|
|
780
|
+
}
|
|
781
|
+
ngOnChanges() {
|
|
782
|
+
this.appply();
|
|
783
|
+
}
|
|
784
|
+
appply() {
|
|
785
|
+
applySpacing(this.el.nativeElement, this.layout?.spacing);
|
|
786
|
+
}
|
|
787
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SimpoFooterLayoutDirective, deps: [{ token: i0.ElementRef }, { token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
788
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: SimpoFooterLayoutDirective, isStandalone: true, selector: "[simpoFooterLayout]", inputs: { layout: ["simpoFooterLayout", "layout"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
789
|
+
}
|
|
790
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SimpoFooterLayoutDirective, decorators: [{
|
|
791
|
+
type: Directive,
|
|
792
|
+
args: [{
|
|
793
|
+
selector: '[simpoFooterLayout]',
|
|
794
|
+
standalone: true,
|
|
795
|
+
}]
|
|
796
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.EventsService }], propDecorators: { layout: [{
|
|
797
|
+
type: Input,
|
|
798
|
+
args: ['simpoFooterLayout']
|
|
799
|
+
}] } });
|
|
800
|
+
|
|
801
|
+
class FooterSectionComponent {
|
|
802
|
+
constructor() {
|
|
803
|
+
this.color = '#ffffff';
|
|
804
|
+
this.footerTypes = FooterTypes$1;
|
|
805
|
+
this.showEditors = false;
|
|
806
|
+
}
|
|
807
|
+
ngOnInit() {
|
|
808
|
+
this.style = this.data?.styles;
|
|
809
|
+
this.content = this.data?.content;
|
|
810
|
+
}
|
|
811
|
+
showEditTabs(isShow) {
|
|
812
|
+
this.showEditors = isShow;
|
|
813
|
+
}
|
|
814
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FooterSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
815
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: FooterSectionComponent, isStandalone: true, selector: "simpo-footer-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-5\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-0\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3 mt-4 mt-lg-0\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-4\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-2\">\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-end align-items-lg-end pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-end\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-end\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4\">\r\n <div class=\"d-flex align-items-start align-items-lg-end flex-column flex-lg-colum gap-lg-0 gap-3\r\n align-items-end\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-start align-items-lg-start pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-start\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-start\">\r\n <div class=\"d-flex align-items-start align-items-lg-start flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-center\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-center\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3 col-lg-6\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5 col-lg-6\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-0 mt-5 col-lg-6 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-column flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-5 mt-5 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</section>\r\n", styles: [".container-fluid{margin-top:101px;color:#000!important}.card{background-color:#f8f9fb!important}p{font-size:calc(12px + (14 - 12) * ((100vw - 360px) / (1600 - 360)))!important;display:fkex}h3{font-size:calc(24px + (30 - 24) * ((100vw - 360px) / (1600 - 360)))!important}.social{font-size:21px!important}.color-text{color:#757575!important}footer{color:#caced1!important}li{margin-top:20px;margin-bottom:20px}.Careers{cursor:pointer;color:#1e88e5}.row-1{background-color:#1e242a!important}.row-2{background-color:#28323c!important}.made-with{text-align:end}@media only screen and (max-width : 475px){.made-with{text-align:start}.button-display{margin-left:0!important}}.button-display{display:flex;gap:10px}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "component", type: SociaIconsComponent, selector: "simpo-socia-icons", inputs: ["socialIconData", "color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: SimpoFooterLayoutDirective, selector: "[simpoFooterLayout]", inputs: ["simpoFooterLayout"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
816
|
+
}
|
|
817
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FooterSectionComponent, decorators: [{
|
|
818
|
+
type: Component,
|
|
819
|
+
args: [{ selector: 'simpo-footer-section', standalone: true, imports: [
|
|
820
|
+
SimpoElementsModule,
|
|
821
|
+
CommonModule,
|
|
822
|
+
ContentFitDirective$1,
|
|
823
|
+
StyleDirectivesModule,
|
|
824
|
+
SimpoComponentModule,
|
|
825
|
+
SimpoButtonComponent$1,
|
|
826
|
+
SociaIconsComponent$1
|
|
827
|
+
], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-5\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-0\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3 mt-4 mt-lg-0\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-4\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-2\">\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-end align-items-lg-end pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-end\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-end\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4\">\r\n <div class=\"d-flex align-items-start align-items-lg-end flex-column flex-lg-colum gap-lg-0 gap-3\r\n align-items-end\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-start align-items-lg-start pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-start\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-start\">\r\n <div class=\"d-flex align-items-start align-items-lg-start flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-center\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-center\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3 col-lg-6\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5 col-lg-6\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-0 mt-5 col-lg-6 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-column flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-5 mt-5 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</section>\r\n", styles: [".container-fluid{margin-top:101px;color:#000!important}.card{background-color:#f8f9fb!important}p{font-size:calc(12px + (14 - 12) * ((100vw - 360px) / (1600 - 360)))!important;display:fkex}h3{font-size:calc(24px + (30 - 24) * ((100vw - 360px) / (1600 - 360)))!important}.social{font-size:21px!important}.color-text{color:#757575!important}footer{color:#caced1!important}li{margin-top:20px;margin-bottom:20px}.Careers{cursor:pointer;color:#1e88e5}.row-1{background-color:#1e242a!important}.row-2{background-color:#28323c!important}.made-with{text-align:end}@media only screen and (max-width : 475px){.made-with{text-align:start}.button-display{margin-left:0!important}}.button-display{display:flex;gap:10px}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"] }]
|
|
828
|
+
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
829
|
+
type: Input
|
|
830
|
+
}], index: [{
|
|
831
|
+
type: Input
|
|
832
|
+
}] } });
|
|
833
|
+
|
|
834
|
+
class ImageCarouselSectionComponent {
|
|
835
|
+
constructor() {
|
|
836
|
+
this.screenWidth = 0;
|
|
837
|
+
this.getScreenSize();
|
|
838
|
+
}
|
|
839
|
+
ngOnInit() {
|
|
840
|
+
this.content = this.data?.content;
|
|
841
|
+
this.style = this.data?.styles;
|
|
842
|
+
}
|
|
843
|
+
getScreenSize(event) {
|
|
844
|
+
this.screenWidth = window.innerWidth;
|
|
845
|
+
}
|
|
846
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageCarouselSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
847
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ImageCarouselSectionComponent, isStandalone: true, selector: "simpo-image-carousel-section", inputs: { data: "data", index: "index" }, host: { listeners: { "window:resize": "getScreenSize($event)" } }, ngImport: i0, template: "<section class=\"container-fluid\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\">\n <div class=\"row\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"carouselExampleCaptions\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#carouselExampleCaptions\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\">\n <div class=\"row\">\n <div class=\"col d-flex\" *ngIf=\"screenWidth >= 475\">\n <img class=\"d-block position-relative\"style=\"width: 20%; left: -20px\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block image-height-80vh\"style=\"width: 60%;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block position-relative\" style=\"width: 20%; right: -20px;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n <div class=\"col d-flex\" *ngIf=\"screenWidth < 475\">\n <img class=\"d-block w-100 image-height-40vh\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n </div>\n </div>\n </div>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-prev\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-next\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n</section>", styles: [".mb-1{margin-bottom:1.5rem!important}.previous-icon{width:65px;height:65px}.image-height-80vh{height:80vh;object-fit:cover}.image-height-40vh{height:40vh}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: BackgroundDirective$1, selector: "[simpoBackground]", inputs: ["simpoBackground"] }] }); }
|
|
848
|
+
}
|
|
849
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageCarouselSectionComponent, decorators: [{
|
|
850
|
+
type: Component,
|
|
851
|
+
args: [{ selector: 'simpo-image-carousel-section', standalone: true, imports: [
|
|
852
|
+
SimpoElementsModule,
|
|
853
|
+
CommonModule,
|
|
854
|
+
ColumnDirectiveDirective$1,
|
|
855
|
+
// StyleDirectivesModule,
|
|
856
|
+
SimpoButtonComponent$1,
|
|
857
|
+
AnimationDirective$1,
|
|
858
|
+
BorderDirective$1,
|
|
859
|
+
OverlayDirective$1,
|
|
860
|
+
BackgroundDirective$1,
|
|
861
|
+
ContentFitDirective$1,
|
|
862
|
+
ContainerFitDirective$1,
|
|
863
|
+
HoverDirective$1,
|
|
864
|
+
BannerContentFitDirective$1,
|
|
865
|
+
CornerDirective$1,
|
|
866
|
+
ColumnDirectiveDirective$1,
|
|
867
|
+
ImageDirectiveDirective$1,
|
|
868
|
+
simpoConetenAlignmentDirective$1,
|
|
869
|
+
PositionLayoutDirectiveDirective$1,
|
|
870
|
+
SimpoFooterLayoutDirective$1,
|
|
871
|
+
ButtonDirectiveDirective$1,
|
|
872
|
+
TextBackgroundDirectiveDirective$1
|
|
873
|
+
], template: "<section class=\"container-fluid\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\">\n <div class=\"row\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"carouselExampleCaptions\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#carouselExampleCaptions\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\">\n <div class=\"row\">\n <div class=\"col d-flex\" *ngIf=\"screenWidth >= 475\">\n <img class=\"d-block position-relative\"style=\"width: 20%; left: -20px\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block image-height-80vh\"style=\"width: 60%;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block position-relative\" style=\"width: 20%; right: -20px;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n <div class=\"col d-flex\" *ngIf=\"screenWidth < 475\">\n <img class=\"d-block w-100 image-height-40vh\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n </div>\n </div>\n </div>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-prev\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-next\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n</section>", styles: [".mb-1{margin-bottom:1.5rem!important}.previous-icon{width:65px;height:65px}.image-height-80vh{height:80vh;object-fit:cover}.image-height-40vh{height:40vh}\n"] }]
|
|
874
|
+
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
875
|
+
type: Input
|
|
876
|
+
}], index: [{
|
|
877
|
+
type: Input
|
|
878
|
+
}], getScreenSize: [{
|
|
879
|
+
type: HostListener,
|
|
880
|
+
args: ['window:resize', ['$event']]
|
|
881
|
+
}] } });
|
|
882
|
+
|
|
616
883
|
class CornerDirective {
|
|
617
884
|
constructor(el, eventService) {
|
|
618
885
|
this.el = el;
|
|
@@ -750,300 +1017,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
750
1017
|
type: Input
|
|
751
1018
|
}] } });
|
|
752
1019
|
|
|
753
|
-
class
|
|
754
|
-
constructor(
|
|
755
|
-
this.el = el;
|
|
1020
|
+
class ImageGridSectionComponent {
|
|
1021
|
+
constructor(eventService) {
|
|
756
1022
|
this.eventService = eventService;
|
|
1023
|
+
this._mainContainer = null;
|
|
1024
|
+
this.showEditors = false;
|
|
757
1025
|
}
|
|
758
|
-
|
|
759
|
-
this.
|
|
760
|
-
|
|
761
|
-
ngOnDestroy() {
|
|
762
|
-
if (this.contentAlignmentSubscription) {
|
|
763
|
-
this.contentAlignmentSubscription.unsubscribe();
|
|
764
|
-
}
|
|
765
|
-
}
|
|
766
|
-
changeAlignmentCheck() {
|
|
767
|
-
this.contentAlignmentSubscription = this.eventService.contentAlignmentChangeCheck.subscribe((res) => {
|
|
768
|
-
if (this.el.nativeElement.id === res.id) {
|
|
769
|
-
this.contentAlignmentData = res.data;
|
|
770
|
-
this.applyContentAlignment();
|
|
771
|
-
}
|
|
772
|
-
});
|
|
773
|
-
}
|
|
774
|
-
applyContentAlignment() {
|
|
775
|
-
this.removeAllClassIfPresent();
|
|
776
|
-
if (this.contentAlignmentData) {
|
|
777
|
-
this.el.nativeElement.classList.add(contentAlignment$1[this.contentAlignmentData]);
|
|
778
|
-
}
|
|
1026
|
+
ngOnInit() {
|
|
1027
|
+
this.content = this.data?.content;
|
|
1028
|
+
this.style = this.data?.styles;
|
|
779
1029
|
}
|
|
780
|
-
|
|
781
|
-
this.
|
|
782
|
-
this.el.nativeElement.classList.remove(contentAlignment$1[AlignContent$1.Image_CENTER]);
|
|
783
|
-
this.el.nativeElement.classList.remove(contentAlignment$1[AlignContent$1.Image_TOP]);
|
|
1030
|
+
showEditTabs(isShow) {
|
|
1031
|
+
this.showEditors = isShow;
|
|
784
1032
|
}
|
|
785
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type:
|
|
786
|
-
static { this.ɵ
|
|
787
|
-
}
|
|
788
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: simpoConetenAlignmentDirective, decorators: [{
|
|
789
|
-
type: Directive,
|
|
790
|
-
args: [{
|
|
791
|
-
selector: '[simpoContentAlignment]',
|
|
792
|
-
standalone: true,
|
|
793
|
-
}]
|
|
794
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.EventsService }], propDecorators: { contentAlignmentData: [{
|
|
795
|
-
type: Input,
|
|
796
|
-
args: ['simpoContentAlignment']
|
|
797
|
-
}] } });
|
|
798
|
-
|
|
799
|
-
class PositionLayoutDirectiveDirective {
|
|
800
|
-
constructor(el, eventService) {
|
|
801
|
-
this.el = el;
|
|
802
|
-
this.eventService = eventService;
|
|
803
|
-
this.positionLayoutChangeCheck();
|
|
804
|
-
}
|
|
805
|
-
ngOnChanges() {
|
|
806
|
-
this.changePositionLayout();
|
|
807
|
-
}
|
|
808
|
-
ngOnDestroy() {
|
|
809
|
-
if (this.positionLayoutSubscription) {
|
|
810
|
-
this.positionLayoutSubscription.unsubscribe();
|
|
811
|
-
}
|
|
812
|
-
}
|
|
813
|
-
changePositionLayout() {
|
|
814
|
-
this.removeAllClassIfPresent();
|
|
815
|
-
this.el.nativeElement.classList.add(BANNERALIGNMENT$1[this.positionLayout?.value]);
|
|
816
|
-
}
|
|
817
|
-
removeAllClassIfPresent() {
|
|
818
|
-
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.left);
|
|
819
|
-
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.right);
|
|
820
|
-
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.top);
|
|
821
|
-
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.bottom);
|
|
822
|
-
}
|
|
823
|
-
positionLayoutChangeCheck() {
|
|
824
|
-
this.positionLayoutSubscription = this.eventService.postionLayoutChangeChecks.subscribe((res) => {
|
|
825
|
-
if (this.el.nativeElement.id === res.id) {
|
|
826
|
-
this.positionLayout = res.data;
|
|
827
|
-
this.changePositionLayout();
|
|
828
|
-
}
|
|
829
|
-
});
|
|
830
|
-
}
|
|
831
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: PositionLayoutDirectiveDirective, deps: [{ token: i0.ElementRef }, { token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
832
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: PositionLayoutDirectiveDirective, isStandalone: true, selector: "[simpoPositionLayoutDirective]", inputs: { positionLayout: ["simpoPositionLayoutDirective", "positionLayout"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
833
|
-
}
|
|
834
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: PositionLayoutDirectiveDirective, decorators: [{
|
|
835
|
-
type: Directive,
|
|
836
|
-
args: [{
|
|
837
|
-
selector: '[simpoPositionLayoutDirective]',
|
|
838
|
-
standalone: true
|
|
839
|
-
}]
|
|
840
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.EventsService }], propDecorators: { positionLayout: [{
|
|
841
|
-
type: Input,
|
|
842
|
-
args: ['simpoPositionLayoutDirective']
|
|
843
|
-
}] } });
|
|
844
|
-
|
|
845
|
-
class BannerSectionComponent {
|
|
846
|
-
constructor() {
|
|
847
|
-
this.showEditors = false;
|
|
848
|
-
}
|
|
849
|
-
ngOnInit() {
|
|
850
|
-
this.content = this.data?.content;
|
|
851
|
-
this.styles = this.data?.styles;
|
|
852
|
-
if (!this.styles || !this.content)
|
|
853
|
-
return;
|
|
854
|
-
// this.styles.layout.bannerImageDisplay = this.content.image.showImage;
|
|
855
|
-
}
|
|
856
|
-
showEditTabs(isShow) {
|
|
857
|
-
this.showEditors = isShow;
|
|
858
|
-
}
|
|
859
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: BannerSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
860
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: BannerSectionComponent, isStandalone: true, selector: "simpo-banner-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\">\r\n <div class=\"col-10 col-sm-8 col-lg-6\" *ngIf=\"content?.image?.showImage\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column justify-content-start gap-15\" [id]=\"data?.id\" [simpoContentAlignment]=\"styles?.contentAlignment\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px}.gap-15{gap:15px}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: simpoConetenAlignmentDirective, selector: "[simpoContentAlignment]", inputs: ["simpoContentAlignment"] }, { kind: "directive", type: PositionLayoutDirectiveDirective, selector: "[simpoPositionLayoutDirective]", inputs: ["simpoPositionLayoutDirective"] }, { kind: "ngmodule", type: MatGridListModule }] }); }
|
|
861
|
-
}
|
|
862
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: BannerSectionComponent, decorators: [{
|
|
863
|
-
type: Component,
|
|
864
|
-
args: [{ selector: 'simpo-banner-section', standalone: true, imports: [
|
|
865
|
-
SimpoElementsModule,
|
|
866
|
-
CommonModule,
|
|
867
|
-
SimpoComponentModule,
|
|
868
|
-
StyleDirectivesModule,
|
|
869
|
-
MatGridListModule,
|
|
870
|
-
SimpoButtonComponent$1
|
|
871
|
-
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\"\r\n [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\">\r\n <div class=\"col-10 col-sm-8 col-lg-6\" *ngIf=\"content?.image?.showImage\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column justify-content-start gap-15\" [id]=\"data?.id\" [simpoContentAlignment]=\"styles?.contentAlignment\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px}.gap-15{gap:15px}\n"] }]
|
|
872
|
-
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
873
|
-
type: Input
|
|
874
|
-
}], index: [{
|
|
875
|
-
type: Input
|
|
876
|
-
}] } });
|
|
877
|
-
|
|
878
|
-
class HeadingElementComponent {
|
|
879
|
-
constructor() {
|
|
880
|
-
this.data = '';
|
|
881
|
-
}
|
|
882
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HeadingElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
883
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: HeadingElementComponent, isStandalone: true, selector: "simpo-heading-element", inputs: { data: "data" }, ngImport: i0, template: "<h2 class=\"heading-large\" [innerHtml]=\"data\"></h2>\n", styles: [""] }); }
|
|
884
|
-
}
|
|
885
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HeadingElementComponent, decorators: [{
|
|
886
|
-
type: Component,
|
|
887
|
-
args: [{ selector: 'simpo-heading-element', standalone: true, imports: [], template: "<h2 class=\"heading-large\" [innerHtml]=\"data\"></h2>\n" }]
|
|
888
|
-
}], propDecorators: { data: [{
|
|
889
|
-
type: Input
|
|
890
|
-
}] } });
|
|
891
|
-
|
|
892
|
-
class FaqSectionComponent {
|
|
893
|
-
constructor() {
|
|
894
|
-
this.showEditors = false;
|
|
895
|
-
}
|
|
896
|
-
ngOnInit() {
|
|
897
|
-
this.content = this.data?.content;
|
|
898
|
-
this.style = this.data?.styles;
|
|
899
|
-
}
|
|
900
|
-
showEditTabs(isShow) {
|
|
901
|
-
this.showEditors = isShow;
|
|
902
|
-
}
|
|
903
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FaqSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
904
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: FaqSectionComponent, isStandalone: true, selector: "simpo-faq-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid flex-col\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoAnimation]=\"style?.animation\" [simpoLayout]=\"style?.layout\">\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"mb-2\">\n <simpo-heading-element [data]=\"text.value\"></simpo-heading-element>\n </div>\n\n <div *ngFor=\"let itemData of content?.listItem?.data;let i = index\" class=\"data\">\n <p class=\"heading-medium\" data-toggle=\"collapse\" [attr.data-target]=\"'#collapse-' + i\">\n {{itemData.inputText[0].value}}</p>\n <div class=\"body-desc desc collapse multi-collapse\" [attr.id]=\"'collapse-' + i\">{{itemData.inputText[1].value}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".mb-2{margin-bottom:2.5rem!important}.data{display:flex;flex-direction:column;gap:1rem;padding-top:2.5rem;padding-bottom:2.5rem;box-shadow:#11182733 0 -1px inset;cursor:pointer}.flex-col{display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{height:auto;position:relative}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: HeadingElementComponent, selector: "simpo-heading-element", inputs: ["data"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ContentFitDirective$1, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
905
|
-
}
|
|
906
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FaqSectionComponent, decorators: [{
|
|
907
|
-
type: Component,
|
|
908
|
-
args: [{ selector: 'simpo-faq-section', standalone: true, imports: [
|
|
909
|
-
SimpoElementsModule,
|
|
910
|
-
CommonModule,
|
|
911
|
-
ContentFitDirective$1,
|
|
912
|
-
StyleDirectivesModule,
|
|
913
|
-
SimpoComponentModule
|
|
914
|
-
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid flex-col\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoAnimation]=\"style?.animation\" [simpoLayout]=\"style?.layout\">\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"mb-2\">\n <simpo-heading-element [data]=\"text.value\"></simpo-heading-element>\n </div>\n\n <div *ngFor=\"let itemData of content?.listItem?.data;let i = index\" class=\"data\">\n <p class=\"heading-medium\" data-toggle=\"collapse\" [attr.data-target]=\"'#collapse-' + i\">\n {{itemData.inputText[0].value}}</p>\n <div class=\"body-desc desc collapse multi-collapse\" [attr.id]=\"'collapse-' + i\">{{itemData.inputText[1].value}}\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".mb-2{margin-bottom:2.5rem!important}.data{display:flex;flex-direction:column;gap:1rem;padding-top:2.5rem;padding-bottom:2.5rem;box-shadow:#11182733 0 -1px inset;cursor:pointer}.flex-col{display:block!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{height:auto;position:relative}\n"] }]
|
|
915
|
-
}], propDecorators: { data: [{
|
|
916
|
-
type: Input
|
|
917
|
-
}], index: [{
|
|
918
|
-
type: Input
|
|
919
|
-
}] } });
|
|
920
|
-
|
|
921
|
-
class SociaIconsComponent {
|
|
922
|
-
constructor() { }
|
|
923
|
-
ngOnInit() {
|
|
924
|
-
}
|
|
925
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SociaIconsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
926
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: SociaIconsComponent, isStandalone: true, selector: "simpo-socia-icons", inputs: { socialIconData: "socialIconData", color: "color" }, ngImport: i0, template: "<div *ngIf=\"socialIconData?.type == 'FACEBOOK'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10.4375 21.8784C5.65941 21.1274 2 16.9877 2 12 2 6.48086 6.48086 2 12 2c5.5191 0 10 4.48086 10 10 0 4.9877-3.6594 9.1274-8.4375 9.8784v-6.9878h2.3301L16.3359 12h-2.7734v-1.8758c0-.79084.3874-1.5617 1.6296-1.5617h1.261V6.10156s-1.1443-.19531-2.2385-.19531c-2.2842 0-3.7771 1.38438-3.7771 3.89063V12H7.89844v2.8906h2.53906v6.9878Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TWITTER'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M13.6756 10.6218 20.2324 3h-1.5537l-5.6933 6.61788L8.43817 3H3.1935l6.8763 10.0074L3.1935 21h1.55384l6.01226-6.9887L15.5618 21h5.2447l-7.1313-10.3782h.0004Zm-2.1282 2.4738-.6967-.9965-5.54349-7.92939h2.38662l4.47367 6.39919.6967.9966 5.8152 8.318h-2.3866l-4.7454-6.7875v-.0004Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'LINKEDIN'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M19.5565 2C20.9051 2 22 3.09492 22 4.44352V19.5565C22 20.9051 20.9051 22 19.5565 22H4.44352C3.09492 22 2 20.9051 2 19.5565V4.44352C2 3.09492 3.09488 2 4.44352 2H19.5565ZM8.26801 18.5343V9.71723H5.33676v8.81707h2.93125Zm10.56789 0v-5.0562c0-2.7083-1.446-3.96822-3.3742-3.96822-1.5549 0-2.2513.85512-2.6413 1.45572V9.71723H9.88988c.03887.82737 0 8.81707 0 8.81707h2.93052v-4.9241c0-.2636.0189-.527.0966-.7154.2115-.5264.694-1.0716 1.5037-1.0716 1.0599 0 1.4846.8088 1.4846 1.9936v4.7175h2.9306ZM6.82219 5.4657c-1.00289 0-1.65813.65934-1.65813 1.52352 0 .84601.63532 1.52351 1.61934 1.52351 1.02207 0 1.67719-.6775 1.67719-1.52351-.01895-.86297-.63442-1.52164-1.6384-1.52352Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'YOUTUBE'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M21.0053 5.6191c.5996.6477.7946 2.11879.7946 2.11879S22 9.46405 22 11.1908v1.618c0 1.7268-.2001 3.453-.2001 3.453s-.1956 1.4705-.7946 2.1169c-.6859.7654-1.4461.8449-1.8754.8897-.0469.0049-.0899.0094-.1283.0143-2.799.2145-7.0016.222-7.0016.222s-5.20038-.0507-6.80025-.2145c-.07572-.0151-.16746-.0268-.27131-.0402-.50666-.0651-1.3018-.1673-1.93375-.8719-.59957-.6465-.79463-2.1169-.79463-2.1169S2 14.5356 2 12.8082v-1.618c0-1.72615.20006-3.45231.20006-3.45231s.19569-1.47109.79463-2.11879c.68895-.76815 1.4516-.84541 1.88002-.88881.04511-.00457.08651-.00876.12373-.01335C7.79681 4.5 11.995 4.5 11.995 4.5h.0094s4.1982 0 6.9972.21694c.0372.00459.0786.00879.1238.01336.4285.0434 1.1916.12069 1.8799.8888Zm-5.251 6.3832-6.25196 3.7512V8.25117l6.25196 3.75113Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'INSTAGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M12 2c5.5191 0 10 4.48086 10 10 0 5.5191-4.4809 10-10 10-5.51914 0-10-4.4809-10-10C2 6.48086 6.48086 2 12 2Zm0 3.75c-1.6974 0-1.9102.00719-2.57688.03762-.66523.03035-1.11957.13601-1.51714.29051-.41098.15972-.75953.37343-1.107.72089-.34746.34746-.56117.69602-.72089 1.107-.1545.39753-.26012.85187-.29051 1.5171C5.75719 10.0898 5.75 10.3026 5.75 12s.00719 1.9102.03758 2.5769c.03039.6652.13601 1.1195.29051 1.5171.15972.411.37343.7595.72089 1.107.34747.3475.69602.5612 1.107.7209.39757.1545.85191.2601 1.51714.2905.66668.0304.87948.0376 2.57688.0376s1.9102-.0072 2.5769-.0376c.6652-.0304 1.1195-.136 1.5171-.2905.411-.1597.7595-.3734 1.107-.7209.3475-.3475.5612-.696.7209-1.107.1545-.3976.2601-.8519.2905-1.5171.0304-.6667.0376-.8795.0376-2.5769 0-1.6974-.0072-1.9102-.0376-2.57688-.0304-.66523-.136-1.11957-.2905-1.5171-.1597-.41098-.3734-.75954-.7209-1.107s-.696-.56117-1.107-.72089c-.3976-.1545-.8519-.26016-1.5171-.29051C13.9102 5.75719 13.6974 5.75 12 5.75Zm0 1.12613c1.6688 0 1.8665.00637 2.5255.03645.6094.02781.9403.12961 1.1606.21519.2917.11336.4999.24883.7186.46754.2187.21867.3542.42692.4675.71864.0856.22023.1874.55113.2152 1.1605.0301.65905.0365.85675.0365 2.52555s-.0064 1.8665-.0365 2.5255c-.0278.6094-.1296.9403-.2152 1.1606-.1133.2917-.2488.4999-.4675.7186-.2187.2187-.4269.3542-.7186.4675-.2203.0856-.5512.1874-1.1606.2152-.6589.0301-.8566.0365-2.5255.0365s-1.8666-.0064-2.52555-.0365c-.60937-.0278-.94027-.1296-1.1605-.2152-.29176-.1133-.49997-.2488-.71868-.4675-.21871-.2187-.35414-.4269-.4675-.7186-.08558-.2203-.18742-.5512-.21523-1.1606-.03008-.659-.03641-.8567-.03641-2.5255s.00633-1.8665.03641-2.52555c.02781-.60937.12965-.94027.21523-1.1605.11336-.29172.24879-.49997.4675-.71864.21871-.21871.42692-.35418.71868-.46754.22023-.08558.55113-.18738 1.1605-.21519.65905-.03008.85675-.03645 2.52555-.03645Zm0 1.91442c-1.7725 0-3.20945 1.43695-3.20945 3.20945S10.2275 15.2095 12 15.2095s3.2095-1.437 3.2095-3.2095c0-1.7725-1.437-3.20945-3.2095-3.20945Zm0 5.29275c-1.1506 0-2.08332-.9327-2.08332-2.0833 0-1.1506.93272-2.08332 2.08332-2.08332S14.0833 10.8494 14.0833 12 13.1506 14.0833 12 14.0833Zm4.0863-5.41955c0 .41422-.3358.74996-.7501.74996-.4141 0-.7499-.33574-.7499-.74996s.3358-.75.7499-.75c.4143 0 .7501.33578.7501.75Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TELEGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M22 12c0 5.5229-4.4771 10-10 10-5.52285 0-10-4.4771-10-10C2 6.47715 6.47715 2 12 2c5.5229 0 10 4.47715 10 10Zm-9.6417-2.61755c-.9726.40455-2.91653 1.24185-5.83173 2.51195-.47339.1883-.72136.3725-.74394.5525-.03815.3044.34296.4242.86192.5874.0706.0222.14374.0452.21872.0695.51059.166 1.19741.3602 1.55446.3679.32388.007.68537-.1265 1.08446-.4006 2.72381-1.8386 4.12981-2.7679 4.21801-2.788.0623-.0141.1486-.0319.2071.0201.0585.052.0527.1504.0465.1768-.0377.1609-1.5335 1.5516-2.3077 2.2714-.2415.2244-.4127.3836-.4477.42-.0784.0814-.1583.1584-.2351.2325-.4743.4572-.83.8001.0197 1.3601.4084.2691.7352.4917 1.0612.7137.356.2424.7111.4842 1.1705.7854.117.0767.2288.1564.3377.234.4143.2954.7865.5608 1.2464.5184.2672-.0245.5432-.2758.6834-1.0252.3313-1.771.9825-5.6083 1.133-7.18949.0132-.13853-.0034-.31583-.0167-.39367-.0134-.07782-.0412-.18872-.1424-.2708-.1198-.09722-.3048-.11772-.3875-.11627-.3761.00663-.9531.20728-3.7303 1.36238Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'THREADS'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M12.1482 21.6888h-.0058c-2.89118-.0194-5.1138-.9727-6.60781-2.833-1.32737-1.6568-2.01334-3.9608-2.03659-6.848v-.0136c.02325-2.88921.70922-5.19128 2.03853-6.84806C7.0286 3.28395 9.25316 2.33057 12.1424 2.31119h.0116c2.2168.0155 4.0712.5852 5.511 1.6936 1.3545 1.04252 2.3079 2.52685 2.833 4.41423l-1.6471.45925c-.8914-3.19731-3.1469-4.83085-6.7047-4.85604-2.34853.01744-4.12546.75573-5.28037 2.19355C5.7865 7.56253 5.22842 9.50804 5.20711 12c.02131 2.492.57939 4.4375 1.66066 5.7842 1.15491 1.4398 2.93184 2.1781 5.28043 2.1936 2.118-.0155 3.519-.5097 4.6836-1.651 1.3293-1.3022 1.306-2.9008.8797-3.8736-.25-.5736-.7054-1.0503-1.3196-1.4126-.155 1.0909-.5019 1.9746-1.0367 2.6412-.7151.8894-1.7285 1.3758-3.0113 1.4455-.9708.0523-1.9068-.1763-2.63149-.6472-.85843-.5561-1.36031-1.4049-1.41457-2.3931-.05232-.9612.32942-1.8448 1.07352-2.4881.71114-.6143 1.71104-.9747 2.89304-1.0425.8701-.0485 1.6859-.0097 2.4377.1143-.1007-.5988-.3022-1.07546-.6045-1.41844-.4147-.47282-1.0561-.7131-1.9049-.71891h-.0232c-.6821 0-1.6084.18796-2.19743 1.06577l-1.41844-.95145c.7906-1.17428 2.07337-1.82149 3.61587-1.82149h.0349c2.5791.0155 4.1158 1.59478 4.2689 4.35032.0872.0368.1744.0755.2596.1143 1.2034.5658 2.0831 1.4223 2.5462 2.4784.6434 1.4707.7035 3.8678-1.2498 5.7803-1.494 1.4611-3.3058 2.1219-5.8753 2.1393h-.0058Zm.81-9.4388c-.1958 0-.3934.0058-.5969.0174-1.4824.0833-2.40667.7635-2.3544 1.7304.0543 1.0135 1.1724 1.4844 2.2479 1.4262.9882-.0523 2.2749-.4379 2.4919-2.9957-.5464-.1183-1.1452-.1783-1.7885-.1783Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
927
|
-
}
|
|
928
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SociaIconsComponent, decorators: [{
|
|
929
|
-
type: Component,
|
|
930
|
-
args: [{ selector: 'simpo-socia-icons', standalone: true, imports: [
|
|
931
|
-
CommonModule
|
|
932
|
-
], template: "<div *ngIf=\"socialIconData?.type == 'FACEBOOK'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M10.4375 21.8784C5.65941 21.1274 2 16.9877 2 12 2 6.48086 6.48086 2 12 2c5.5191 0 10 4.48086 10 10 0 4.9877-3.6594 9.1274-8.4375 9.8784v-6.9878h2.3301L16.3359 12h-2.7734v-1.8758c0-.79084.3874-1.5617 1.6296-1.5617h1.261V6.10156s-1.1443-.19531-2.2385-.19531c-2.2842 0-3.7771 1.38438-3.7771 3.89063V12H7.89844v2.8906h2.53906v6.9878Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TWITTER'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M13.6756 10.6218 20.2324 3h-1.5537l-5.6933 6.61788L8.43817 3H3.1935l6.8763 10.0074L3.1935 21h1.55384l6.01226-6.9887L15.5618 21h5.2447l-7.1313-10.3782h.0004Zm-2.1282 2.4738-.6967-.9965-5.54349-7.92939h2.38662l4.47367 6.39919.6967.9966 5.8152 8.318h-2.3866l-4.7454-6.7875v-.0004Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'LINKEDIN'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M19.5565 2C20.9051 2 22 3.09492 22 4.44352V19.5565C22 20.9051 20.9051 22 19.5565 22H4.44352C3.09492 22 2 20.9051 2 19.5565V4.44352C2 3.09492 3.09488 2 4.44352 2H19.5565ZM8.26801 18.5343V9.71723H5.33676v8.81707h2.93125Zm10.56789 0v-5.0562c0-2.7083-1.446-3.96822-3.3742-3.96822-1.5549 0-2.2513.85512-2.6413 1.45572V9.71723H9.88988c.03887.82737 0 8.81707 0 8.81707h2.93052v-4.9241c0-.2636.0189-.527.0966-.7154.2115-.5264.694-1.0716 1.5037-1.0716 1.0599 0 1.4846.8088 1.4846 1.9936v4.7175h2.9306ZM6.82219 5.4657c-1.00289 0-1.65813.65934-1.65813 1.52352 0 .84601.63532 1.52351 1.61934 1.52351 1.02207 0 1.67719-.6775 1.67719-1.52351-.01895-.86297-.63442-1.52164-1.6384-1.52352Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'YOUTUBE'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M21.0053 5.6191c.5996.6477.7946 2.11879.7946 2.11879S22 9.46405 22 11.1908v1.618c0 1.7268-.2001 3.453-.2001 3.453s-.1956 1.4705-.7946 2.1169c-.6859.7654-1.4461.8449-1.8754.8897-.0469.0049-.0899.0094-.1283.0143-2.799.2145-7.0016.222-7.0016.222s-5.20038-.0507-6.80025-.2145c-.07572-.0151-.16746-.0268-.27131-.0402-.50666-.0651-1.3018-.1673-1.93375-.8719-.59957-.6465-.79463-2.1169-.79463-2.1169S2 14.5356 2 12.8082v-1.618c0-1.72615.20006-3.45231.20006-3.45231s.19569-1.47109.79463-2.11879c.68895-.76815 1.4516-.84541 1.88002-.88881.04511-.00457.08651-.00876.12373-.01335C7.79681 4.5 11.995 4.5 11.995 4.5h.0094s4.1982 0 6.9972.21694c.0372.00459.0786.00879.1238.01336.4285.0434 1.1916.12069 1.8799.8888Zm-5.251 6.3832-6.25196 3.7512V8.25117l6.25196 3.75113Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'INSTAGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M12 2c5.5191 0 10 4.48086 10 10 0 5.5191-4.4809 10-10 10-5.51914 0-10-4.4809-10-10C2 6.48086 6.48086 2 12 2Zm0 3.75c-1.6974 0-1.9102.00719-2.57688.03762-.66523.03035-1.11957.13601-1.51714.29051-.41098.15972-.75953.37343-1.107.72089-.34746.34746-.56117.69602-.72089 1.107-.1545.39753-.26012.85187-.29051 1.5171C5.75719 10.0898 5.75 10.3026 5.75 12s.00719 1.9102.03758 2.5769c.03039.6652.13601 1.1195.29051 1.5171.15972.411.37343.7595.72089 1.107.34747.3475.69602.5612 1.107.7209.39757.1545.85191.2601 1.51714.2905.66668.0304.87948.0376 2.57688.0376s1.9102-.0072 2.5769-.0376c.6652-.0304 1.1195-.136 1.5171-.2905.411-.1597.7595-.3734 1.107-.7209.3475-.3475.5612-.696.7209-1.107.1545-.3976.2601-.8519.2905-1.5171.0304-.6667.0376-.8795.0376-2.5769 0-1.6974-.0072-1.9102-.0376-2.57688-.0304-.66523-.136-1.11957-.2905-1.5171-.1597-.41098-.3734-.75954-.7209-1.107s-.696-.56117-1.107-.72089c-.3976-.1545-.8519-.26016-1.5171-.29051C13.9102 5.75719 13.6974 5.75 12 5.75Zm0 1.12613c1.6688 0 1.8665.00637 2.5255.03645.6094.02781.9403.12961 1.1606.21519.2917.11336.4999.24883.7186.46754.2187.21867.3542.42692.4675.71864.0856.22023.1874.55113.2152 1.1605.0301.65905.0365.85675.0365 2.52555s-.0064 1.8665-.0365 2.5255c-.0278.6094-.1296.9403-.2152 1.1606-.1133.2917-.2488.4999-.4675.7186-.2187.2187-.4269.3542-.7186.4675-.2203.0856-.5512.1874-1.1606.2152-.6589.0301-.8566.0365-2.5255.0365s-1.8666-.0064-2.52555-.0365c-.60937-.0278-.94027-.1296-1.1605-.2152-.29176-.1133-.49997-.2488-.71868-.4675-.21871-.2187-.35414-.4269-.4675-.7186-.08558-.2203-.18742-.5512-.21523-1.1606-.03008-.659-.03641-.8567-.03641-2.5255s.00633-1.8665.03641-2.52555c.02781-.60937.12965-.94027.21523-1.1605.11336-.29172.24879-.49997.4675-.71864.21871-.21871.42692-.35418.71868-.46754.22023-.08558.55113-.18738 1.1605-.21519.65905-.03008.85675-.03645 2.52555-.03645Zm0 1.91442c-1.7725 0-3.20945 1.43695-3.20945 3.20945S10.2275 15.2095 12 15.2095s3.2095-1.437 3.2095-3.2095c0-1.7725-1.437-3.20945-3.2095-3.20945Zm0 5.29275c-1.1506 0-2.08332-.9327-2.08332-2.0833 0-1.1506.93272-2.08332 2.08332-2.08332S14.0833 10.8494 14.0833 12 13.1506 14.0833 12 14.0833Zm4.0863-5.41955c0 .41422-.3358.74996-.7501.74996-.4141 0-.7499-.33574-.7499-.74996s.3358-.75.7499-.75c.4143 0 .7501.33578.7501.75Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'TELEGRAM'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path fill-rule=\"evenodd\"\r\n d=\"M22 12c0 5.5229-4.4771 10-10 10-5.52285 0-10-4.4771-10-10C2 6.47715 6.47715 2 12 2c5.5229 0 10 4.47715 10 10Zm-9.6417-2.61755c-.9726.40455-2.91653 1.24185-5.83173 2.51195-.47339.1883-.72136.3725-.74394.5525-.03815.3044.34296.4242.86192.5874.0706.0222.14374.0452.21872.0695.51059.166 1.19741.3602 1.55446.3679.32388.007.68537-.1265 1.08446-.4006 2.72381-1.8386 4.12981-2.7679 4.21801-2.788.0623-.0141.1486-.0319.2071.0201.0585.052.0527.1504.0465.1768-.0377.1609-1.5335 1.5516-2.3077 2.2714-.2415.2244-.4127.3836-.4477.42-.0784.0814-.1583.1584-.2351.2325-.4743.4572-.83.8001.0197 1.3601.4084.2691.7352.4917 1.0612.7137.356.2424.7111.4842 1.1705.7854.117.0767.2288.1564.3377.234.4143.2954.7865.5608 1.2464.5184.2672-.0245.5432-.2758.6834-1.0252.3313-1.771.9825-5.6083 1.133-7.18949.0132-.13853-.0034-.31583-.0167-.39367-.0134-.07782-.0412-.18872-.1424-.2708-.1198-.09722-.3048-.11772-.3875-.11627-.3761.00663-.9531.20728-3.7303 1.36238Z\"\r\n clip-rule=\"evenodd\"></path>\r\n </svg>\r\n </a>\r\n</div>\r\n<div *ngIf=\"socialIconData?.type === 'THREADS'\">\r\n <a [href]=\"socialIconData?.link\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentColor\" viewBox=\"0 0 24 24\" width=\"34\" height=\"34\"\r\n class=\"icon w-8 h-8\" aria-hidden=\"true\" [style.color]=\"color\">\r\n <path\r\n d=\"M12.1482 21.6888h-.0058c-2.89118-.0194-5.1138-.9727-6.60781-2.833-1.32737-1.6568-2.01334-3.9608-2.03659-6.848v-.0136c.02325-2.88921.70922-5.19128 2.03853-6.84806C7.0286 3.28395 9.25316 2.33057 12.1424 2.31119h.0116c2.2168.0155 4.0712.5852 5.511 1.6936 1.3545 1.04252 2.3079 2.52685 2.833 4.41423l-1.6471.45925c-.8914-3.19731-3.1469-4.83085-6.7047-4.85604-2.34853.01744-4.12546.75573-5.28037 2.19355C5.7865 7.56253 5.22842 9.50804 5.20711 12c.02131 2.492.57939 4.4375 1.66066 5.7842 1.15491 1.4398 2.93184 2.1781 5.28043 2.1936 2.118-.0155 3.519-.5097 4.6836-1.651 1.3293-1.3022 1.306-2.9008.8797-3.8736-.25-.5736-.7054-1.0503-1.3196-1.4126-.155 1.0909-.5019 1.9746-1.0367 2.6412-.7151.8894-1.7285 1.3758-3.0113 1.4455-.9708.0523-1.9068-.1763-2.63149-.6472-.85843-.5561-1.36031-1.4049-1.41457-2.3931-.05232-.9612.32942-1.8448 1.07352-2.4881.71114-.6143 1.71104-.9747 2.89304-1.0425.8701-.0485 1.6859-.0097 2.4377.1143-.1007-.5988-.3022-1.07546-.6045-1.41844-.4147-.47282-1.0561-.7131-1.9049-.71891h-.0232c-.6821 0-1.6084.18796-2.19743 1.06577l-1.41844-.95145c.7906-1.17428 2.07337-1.82149 3.61587-1.82149h.0349c2.5791.0155 4.1158 1.59478 4.2689 4.35032.0872.0368.1744.0755.2596.1143 1.2034.5658 2.0831 1.4223 2.5462 2.4784.6434 1.4707.7035 3.8678-1.2498 5.7803-1.494 1.4611-3.3058 2.1219-5.8753 2.1393h-.0058Zm.81-9.4388c-.1958 0-.3934.0058-.5969.0174-1.4824.0833-2.40667.7635-2.3544 1.7304.0543 1.0135 1.1724 1.4844 2.2479 1.4262.9882-.0523 2.2749-.4379 2.4919-2.9957-.5464-.1183-1.1452-.1783-1.7885-.1783Z\">\r\n </path>\r\n </svg>\r\n </a>\r\n</div>" }]
|
|
933
|
-
}], ctorParameters: () => [], propDecorators: { socialIconData: [{
|
|
934
|
-
type: Input
|
|
935
|
-
}], color: [{
|
|
936
|
-
type: Input
|
|
937
|
-
}] } });
|
|
938
|
-
|
|
939
|
-
class SimpoFooterLayoutDirective {
|
|
940
|
-
constructor(el, eventService) {
|
|
941
|
-
this.el = el;
|
|
942
|
-
this.eventService = eventService;
|
|
943
|
-
}
|
|
944
|
-
ngOnInit() {
|
|
945
|
-
this.appply();
|
|
946
|
-
}
|
|
947
|
-
ngOnChanges() {
|
|
948
|
-
this.appply();
|
|
949
|
-
}
|
|
950
|
-
appply() {
|
|
951
|
-
applySpacing(this.el.nativeElement, this.layout?.spacing);
|
|
952
|
-
}
|
|
953
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SimpoFooterLayoutDirective, deps: [{ token: i0.ElementRef }, { token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
954
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: SimpoFooterLayoutDirective, isStandalone: true, selector: "[simpoFooterLayout]", inputs: { layout: ["simpoFooterLayout", "layout"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
955
|
-
}
|
|
956
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SimpoFooterLayoutDirective, decorators: [{
|
|
957
|
-
type: Directive,
|
|
958
|
-
args: [{
|
|
959
|
-
selector: '[simpoFooterLayout]',
|
|
960
|
-
standalone: true,
|
|
961
|
-
}]
|
|
962
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.EventsService }], propDecorators: { layout: [{
|
|
963
|
-
type: Input,
|
|
964
|
-
args: ['simpoFooterLayout']
|
|
965
|
-
}] } });
|
|
966
|
-
|
|
967
|
-
class FooterSectionComponent {
|
|
968
|
-
constructor() {
|
|
969
|
-
this.color = '#ffffff';
|
|
970
|
-
this.footerTypes = FooterTypes$1;
|
|
971
|
-
this.showEditors = false;
|
|
972
|
-
}
|
|
973
|
-
ngOnInit() {
|
|
974
|
-
this.style = this.data?.styles;
|
|
975
|
-
this.content = this.data?.content;
|
|
976
|
-
}
|
|
977
|
-
showEditTabs(isShow) {
|
|
978
|
-
this.showEditors = isShow;
|
|
979
|
-
}
|
|
980
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FooterSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
981
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: FooterSectionComponent, isStandalone: true, selector: "simpo-footer-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-5\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-0\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3 mt-4 mt-lg-0\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-4\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-2\">\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-end align-items-lg-end pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-end\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-end\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4\">\r\n <div class=\"d-flex align-items-start align-items-lg-end flex-column flex-lg-colum gap-lg-0 gap-3\r\n align-items-end\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-start align-items-lg-start pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-start\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-start\">\r\n <div class=\"d-flex align-items-start align-items-lg-start flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-center\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-center\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3 col-lg-6\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5 col-lg-6\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-0 mt-5 col-lg-6 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-column flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-5 mt-5 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</section>\r\n", styles: [".container-fluid{margin-top:101px;color:#000!important}.card{background-color:#f8f9fb!important}p{font-size:calc(12px + (14 - 12) * ((100vw - 360px) / (1600 - 360)))!important;display:fkex}h3{font-size:calc(24px + (30 - 24) * ((100vw - 360px) / (1600 - 360)))!important}.social{font-size:21px!important}.color-text{color:#757575!important}footer{color:#caced1!important}li{margin-top:20px;margin-bottom:20px}.Careers{cursor:pointer;color:#1e88e5}.row-1{background-color:#1e242a!important}.row-2{background-color:#28323c!important}.made-with{text-align:end}@media only screen and (max-width : 475px){.made-with{text-align:start}.button-display{margin-left:0!important}}.button-display{display:flex;gap:10px}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "component", type: SociaIconsComponent, selector: "simpo-socia-icons", inputs: ["socialIconData", "color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: SimpoFooterLayoutDirective, selector: "[simpoFooterLayout]", inputs: ["simpoFooterLayout"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
982
|
-
}
|
|
983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: FooterSectionComponent, decorators: [{
|
|
984
|
-
type: Component,
|
|
985
|
-
args: [{ selector: 'simpo-footer-section', standalone: true, imports: [
|
|
986
|
-
SimpoElementsModule,
|
|
987
|
-
CommonModule,
|
|
988
|
-
ContentFitDirective$1,
|
|
989
|
-
StyleDirectivesModule,
|
|
990
|
-
SimpoComponentModule,
|
|
991
|
-
SimpoButtonComponent$1,
|
|
992
|
-
SociaIconsComponent$1
|
|
993
|
-
], template: "<section class=\"total-container\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\">\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-5\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-0\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SPLIT_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-start align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3 mt-4 mt-lg-0\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-4 mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-4 mt-4\"\r\n [ngStyle]=\"{'margin-left': content?.socialLinks?.display ? '20px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-2\">\r\n <div class=\"body-desc mt-lg-5 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-end align-items-lg-end pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-end\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-end\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4\">\r\n <div class=\"d-flex align-items-start align-items-lg-end flex-column flex-lg-colum gap-lg-0 gap-3\r\n align-items-end\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_LEFT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-start align-items-lg-start pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-start\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-start\">\r\n <div class=\"d-flex align-items-start align-items-lg-start flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.STACKED_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-colum flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-grow align-items-center\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-5 mt-5 text-start\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-grow mt-lg-0 mt-lg-3 mt-4 align-items-center\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-colum gap-lg-0 gap-3 align-items-start justify-content-between\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-5 mt-2\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\"\r\n class=\"button-display mt-lg-5 mt-0 d-flex align-items-end\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small text-end\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_RIGHT\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-row flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3 col-lg-6\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5 col-lg-6\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-0 mt-5 col-lg-6 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <footer *ngIf=\"style?.footerType === footerTypes.SIMPLE_DETAILS_CENTER\"\r\n #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\r\n <div style=\"padding-left: 1.5rem;padding-right:1.5rem\" [simpoFooterLayout]=\"style?.layout\">\r\n <div\r\n class=\"d-flex flex-lg-column flex-column justify-content-between align-items-center align-items-lg-center pt-5 pb-5\">\r\n <div class=\"d-flex flex-column flex-lg-row flex-grow align-items-center gap-lg-3\">\r\n <div class=\"heading-medium\">\r\n <ng-container *ngIf=\"content?.siteNameAndLogo != 'custom'\">\r\n <span>\r\n <span></span>\r\n <b>{{content?.siteName?.value}}</b>\r\n </span>\r\n </ng-container>\r\n <ng-container *ngIf=\"content?.siteNameAndLogo === 'custom'\">\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-medium\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b\r\n [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div class=\"body-desc mt-lg-0 mt-5\" *ngIf=\"content?.additionalDetails?.value != ''\">\r\n {{content?.additionalDetails?.value}}\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column flex-lg-row align-items-center gap-lg-3 flex-grow mt-lg-5 mt-5 justify-content-lg-end\">\r\n <div class=\"d-flex align-items-center align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-lg-0 mt-4\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;top: 4px;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display mt-lg-0 mt-4\"\r\n [ngStyle]=\"{'margin': content?.socialLinks?.display ? '10px' : ''}\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"made-with mt-4 mt-lg-0\" *ngIf=\"content?.displayBranding\">\r\n <div class=\"heading-small\">Made with <a class=\"heading-small\" href=\"https://simpo.ai\"\r\n style=\"text-decoration: underline;\">Simpo</a></div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </footer>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n</section>\r\n", styles: [".container-fluid{margin-top:101px;color:#000!important}.card{background-color:#f8f9fb!important}p{font-size:calc(12px + (14 - 12) * ((100vw - 360px) / (1600 - 360)))!important;display:fkex}h3{font-size:calc(24px + (30 - 24) * ((100vw - 360px) / (1600 - 360)))!important}.social{font-size:21px!important}.color-text{color:#757575!important}footer{color:#caced1!important}li{margin-top:20px;margin-bottom:20px}.Careers{cursor:pointer;color:#1e88e5}.row-1{background-color:#1e242a!important}.row-2{background-color:#28323c!important}.made-with{text-align:end}@media only screen and (max-width : 475px){.made-with{text-align:start}.button-display{margin-left:0!important}}.button-display{display:flex;gap:10px}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}\n"] }]
|
|
994
|
-
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
995
|
-
type: Input
|
|
996
|
-
}], index: [{
|
|
997
|
-
type: Input
|
|
998
|
-
}] } });
|
|
999
|
-
|
|
1000
|
-
class ImageCarouselSectionComponent {
|
|
1001
|
-
constructor() {
|
|
1002
|
-
this.screenWidth = 0;
|
|
1003
|
-
this.getScreenSize();
|
|
1004
|
-
}
|
|
1005
|
-
ngOnInit() {
|
|
1006
|
-
this.content = this.data?.content;
|
|
1007
|
-
this.style = this.data?.styles;
|
|
1008
|
-
}
|
|
1009
|
-
getScreenSize(event) {
|
|
1010
|
-
this.screenWidth = window.innerWidth;
|
|
1011
|
-
}
|
|
1012
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageCarouselSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1013
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ImageCarouselSectionComponent, isStandalone: true, selector: "simpo-image-carousel-section", inputs: { data: "data", index: "index" }, host: { listeners: { "window:resize": "getScreenSize($event)" } }, ngImport: i0, template: "<section class=\"container-fluid\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\">\n <div class=\"row\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"carouselExampleCaptions\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#carouselExampleCaptions\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\">\n <div class=\"row\">\n <div class=\"col d-flex\" *ngIf=\"screenWidth >= 475\">\n <img class=\"d-block position-relative\"style=\"width: 20%; left: -20px\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block image-height-80vh\"style=\"width: 60%;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block position-relative\" style=\"width: 20%; right: -20px;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n <div class=\"col d-flex\" *ngIf=\"screenWidth < 475\">\n <img class=\"d-block w-100 image-height-40vh\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n </div>\n </div>\n </div>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-prev\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-next\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n</section>", styles: [".mb-1{margin-bottom:1.5rem!important}.previous-icon{width:65px;height:65px}.image-height-80vh{height:80vh;object-fit:cover}.image-height-40vh{height:40vh}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }] }); }
|
|
1014
|
-
}
|
|
1015
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageCarouselSectionComponent, decorators: [{
|
|
1016
|
-
type: Component,
|
|
1017
|
-
args: [{ selector: 'simpo-image-carousel-section', standalone: true, imports: [
|
|
1018
|
-
SimpoElementsModule,
|
|
1019
|
-
CommonModule,
|
|
1020
|
-
ColumnDirectiveDirective$1,
|
|
1021
|
-
StyleDirectivesModule,
|
|
1022
|
-
], template: "<section class=\"container-fluid\" [id]=\"data?.id\" [simpoBackground]=\"style?.background\">\n <div class=\"row\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"carouselExampleCaptions\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#carouselExampleCaptions\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\">\n <div class=\"row\">\n <div class=\"col d-flex\" *ngIf=\"screenWidth >= 475\">\n <img class=\"d-block position-relative\"style=\"width: 20%; left: -20px\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block image-height-80vh\"style=\"width: 60%;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n <img class=\"d-block position-relative\" style=\"width: 20%; right: -20px;\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n <div class=\"col d-flex\" *ngIf=\"screenWidth < 475\">\n <img class=\"d-block w-100 image-height-40vh\" [src]=\"img.image.url\" [alt]=\"img.image.altText\">\n </div>\n </div>\n </div>\n </div>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-prev\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a *ngIf=\"screenWidth > 475\" class=\"carousel-control-next\" data-bs-target=\"#carouselExampleCaptions\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n</section>", styles: [".mb-1{margin-bottom:1.5rem!important}.previous-icon{width:65px;height:65px}.image-height-80vh{height:80vh;object-fit:cover}.image-height-40vh{height:40vh}\n"] }]
|
|
1023
|
-
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
1024
|
-
type: Input
|
|
1025
|
-
}], index: [{
|
|
1026
|
-
type: Input
|
|
1027
|
-
}], getScreenSize: [{
|
|
1028
|
-
type: HostListener,
|
|
1029
|
-
args: ['window:resize', ['$event']]
|
|
1030
|
-
}] } });
|
|
1031
|
-
|
|
1032
|
-
class ImageGridSectionComponent {
|
|
1033
|
-
constructor(eventService) {
|
|
1034
|
-
this.eventService = eventService;
|
|
1035
|
-
this._mainContainer = null;
|
|
1036
|
-
this.showEditors = false;
|
|
1037
|
-
}
|
|
1038
|
-
ngOnInit() {
|
|
1039
|
-
this.content = this.data?.content;
|
|
1040
|
-
this.style = this.data?.styles;
|
|
1041
|
-
}
|
|
1042
|
-
showEditTabs(isShow) {
|
|
1043
|
-
this.showEditors = isShow;
|
|
1044
|
-
}
|
|
1045
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageGridSectionComponent, deps: [{ token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1046
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ImageGridSectionComponent, isStandalone: true, selector: "simpo-image-grid-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\"\n [ngStyle]=\"style?.removeGaps && style?.fullWidth ? {'padding': '0px'} : style?.removeGaps ? {'padding': '0px 15px'} : style?.fullWidth ? {'padding': '0px'} : {}\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n\n <div class=\"main-image-section\" [simpoColumnDirective]=\"style?.size\" [id]=\"data?.id\"\n *ngFor=\"let img of content?.listItem?.data\"\n [ngStyle]=\"style?.removeGaps ? {'padding': '0px', 'margin': '0px'} : {}\">\n <div class=\"image-section\">\n <img [simpoImageDirective]=\"style?.image\" [simpoCorner]=\"style?.corners\" [id]=\"data?.id\"\n [src]=\"img.image.url\" [alt]=\"img.image.altText\" />\n </div>\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.main-image-section{margin-bottom:1.5rem}.image-section,.image-section img{width:100%}.mb-1{margin-bottom:1.5rem!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: ColumnDirectiveDirective$1, selector: "[simpoColumnDirective]", inputs: ["simpoColumnDirective"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1033
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageGridSectionComponent, deps: [{ token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1034
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ImageGridSectionComponent, isStandalone: true, selector: "simpo-image-grid-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\"\n [ngStyle]=\"style?.removeGaps && style?.fullWidth ? {'padding': '0px'} : style?.removeGaps ? {'padding': '0px 15px'} : style?.fullWidth ? {'padding': '0px'} : {}\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n\n <div class=\"main-image-section\" [simpoColumnDirective]=\"style?.size\" [id]=\"data?.id\"\n *ngFor=\"let img of content?.listItem?.data\"\n [ngStyle]=\"style?.removeGaps ? {'padding': '0px', 'margin': '0px'} : {}\">\n <div class=\"image-section\">\n <img [simpoImageDirective]=\"style?.image\" [simpoCorner]=\"style?.corners\" [id]=\"data?.id\"\n [src]=\"img.image.url\" [alt]=\"img.image.altText\" />\n </div>\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.main-image-section{margin-bottom:1.5rem}.image-section,.image-section img{width:100%}.mb-1{margin-bottom:1.5rem!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: ColumnDirectiveDirective$1, selector: "[simpoColumnDirective]", inputs: ["simpoColumnDirective"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1047
1035
|
}
|
|
1048
1036
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageGridSectionComponent, decorators: [{
|
|
1049
1037
|
type: Component,
|
|
@@ -1054,9 +1042,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1054
1042
|
StyleDirectivesModule,
|
|
1055
1043
|
ImageDirectiveDirective$1,
|
|
1056
1044
|
ContentFitDirective$1,
|
|
1057
|
-
StyleDirectivesModule,
|
|
1058
|
-
|
|
1059
|
-
|
|
1045
|
+
// StyleDirectivesModule,
|
|
1046
|
+
SimpoButtonComponent$1,
|
|
1047
|
+
SimpoComponentModule,
|
|
1048
|
+
AnimationDirective$1,
|
|
1049
|
+
BorderDirective$1,
|
|
1050
|
+
OverlayDirective$1,
|
|
1051
|
+
BackgroundDirective$1,
|
|
1052
|
+
ContentFitDirective$1,
|
|
1053
|
+
ContainerFitDirective$1,
|
|
1054
|
+
HoverDirective$1,
|
|
1055
|
+
BannerContentFitDirective$1,
|
|
1056
|
+
CornerDirective$1,
|
|
1057
|
+
ColumnDirectiveDirective$1,
|
|
1058
|
+
ImageDirectiveDirective$1,
|
|
1059
|
+
simpoConetenAlignmentDirective$1,
|
|
1060
|
+
PositionLayoutDirectiveDirective$1,
|
|
1061
|
+
SimpoFooterLayoutDirective$1,
|
|
1062
|
+
ButtonDirectiveDirective$1,
|
|
1063
|
+
TextBackgroundDirectiveDirective$1
|
|
1064
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\"\n [ngStyle]=\"style?.removeGaps && style?.fullWidth ? {'padding': '0px'} : style?.removeGaps ? {'padding': '0px 15px'} : style?.fullWidth ? {'padding': '0px'} : {}\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n\n <div class=\"main-image-section\" [simpoColumnDirective]=\"style?.size\" [id]=\"data?.id\"\n *ngFor=\"let img of content?.listItem?.data\"\n [ngStyle]=\"style?.removeGaps ? {'padding': '0px', 'margin': '0px'} : {}\">\n <div class=\"image-section\">\n <img [simpoImageDirective]=\"style?.image\" [simpoCorner]=\"style?.corners\" [id]=\"data?.id\"\n [src]=\"img.image.url\" [alt]=\"img.image.altText\" />\n </div>\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.main-image-section{margin-bottom:1.5rem}.image-section,.image-section img{width:100%}.mb-1{margin-bottom:1.5rem!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"] }]
|
|
1060
1065
|
}], ctorParameters: () => [{ type: i1.EventsService }], propDecorators: { data: [{
|
|
1061
1066
|
type: Input
|
|
1062
1067
|
}], index: [{
|
|
@@ -1079,7 +1084,7 @@ class ImageSectionComponent {
|
|
|
1079
1084
|
this.showEditors = isShow;
|
|
1080
1085
|
}
|
|
1081
1086
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1082
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ImageSectionComponent, isStandalone: true, selector: "simpo-image-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\n class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid main-section\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\"\n [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"image-section\" [ngStyle]=\"style?.fullWidth ? {'padding': '0px', 'margin': '0px'} : {}\">\n <img [ngClass]=\"{'h-80': style?.layout?.fit === 'content', 'image': style?.layout?.fit === 'screen'}\"\n [src]=\"content?.image?.url\" [alt]=\"content?.image?.altText\" [simpoCorner]=\"style?.corners\"\n [id]=\"data?.id\" />\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".image{width:100%}.main-section{width:100%;height:100%!important;display:block!important}.h-80{width:100%;height:80vh}.mb-1{margin-bottom:1.5rem!important}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1087
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ImageSectionComponent, isStandalone: true, selector: "simpo-image-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\n class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid main-section\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\"\n [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"image-section\" [ngStyle]=\"style?.fullWidth ? {'padding': '0px', 'margin': '0px'} : {}\">\n <img [ngClass]=\"{'h-80': style?.layout?.fit === 'content', 'image': style?.layout?.fit === 'screen'}\"\n [src]=\"content?.image?.url\" [alt]=\"content?.image?.altText\" [simpoCorner]=\"style?.corners\"\n [id]=\"data?.id\" />\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".image{width:100%}.main-section{width:100%;height:100%!important;display:block!important}.h-80{width:100%;height:80vh}.mb-1{margin-bottom:1.5rem!important}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1083
1088
|
}
|
|
1084
1089
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ImageSectionComponent, decorators: [{
|
|
1085
1090
|
type: Component,
|
|
@@ -1090,7 +1095,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1090
1095
|
StyleDirectivesModule,
|
|
1091
1096
|
ContentFitDirective$1,
|
|
1092
1097
|
SimpoComponentModule,
|
|
1093
|
-
|
|
1098
|
+
SimpoButtonComponent$1,
|
|
1099
|
+
SimpoComponentModule,
|
|
1100
|
+
AnimationDirective$1,
|
|
1101
|
+
BorderDirective$1,
|
|
1102
|
+
OverlayDirective$1,
|
|
1103
|
+
BackgroundDirective$1,
|
|
1104
|
+
ContentFitDirective$1,
|
|
1105
|
+
ContainerFitDirective$1,
|
|
1106
|
+
HoverDirective$1,
|
|
1107
|
+
BannerContentFitDirective$1,
|
|
1108
|
+
CornerDirective$1,
|
|
1109
|
+
ColumnDirectiveDirective$1,
|
|
1110
|
+
ImageDirectiveDirective$1,
|
|
1111
|
+
simpoConetenAlignmentDirective$1,
|
|
1112
|
+
PositionLayoutDirectiveDirective$1,
|
|
1113
|
+
SimpoFooterLayoutDirective$1,
|
|
1114
|
+
ButtonDirectiveDirective$1,
|
|
1115
|
+
TextBackgroundDirectiveDirective$1
|
|
1116
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\n class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid main-section\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\"\n [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"image-section\" [ngStyle]=\"style?.fullWidth ? {'padding': '0px', 'margin': '0px'} : {}\">\n <img [ngClass]=\"{'h-80': style?.layout?.fit === 'content', 'image': style?.layout?.fit === 'screen'}\"\n [src]=\"content?.image?.url\" [alt]=\"content?.image?.altText\" [simpoCorner]=\"style?.corners\"\n [id]=\"data?.id\" />\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".image{width:100%}.main-section{width:100%;height:100%!important;display:block!important}.h-80{width:100%;height:80vh}.mb-1{margin-bottom:1.5rem!important}.total-container{height:auto;position:relative}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"] }]
|
|
1094
1117
|
}], propDecorators: { data: [{
|
|
1095
1118
|
type: Input
|
|
1096
1119
|
}], index: [{
|
|
@@ -1107,7 +1130,7 @@ class BelowImageCardComponent {
|
|
|
1107
1130
|
// }
|
|
1108
1131
|
}
|
|
1109
1132
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: BelowImageCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1110
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: BelowImageCardComponent, isStandalone: true, selector: "simpo-below-image-card", inputs: { data: "data", styles: "styles", content: "content", componentId: "componentId", button: "button" }, ngImport: i0, template: "<div>\n <img [src]=\"data.image.url\" [alt]=\"data.image.altText\" [simpoImageDirective]=\"styles?.image\"\n [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" class=\"w-100\" *ngIf=\"content.display.showImage\">\n <div class=\"ptb-1\">\n <div class=\"heading-medium mb-1\" [innerHtml]=\"data.inputText[0].value\" *ngIf=\"content.display.showHeading\"></div>\n <div class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.display.showContent\"></div>\n <div *ngIf=\"content.display.showLink && content.display.linkType === 'Button'\">\n <app-button-element [buttonContent]=\"data.button\" [buttonStyle]=\"button?.styles\" [sectionId]=\"componentId\"\n [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n </div>\n</div>\n", styles: [".w-100{width:100%}.ptb-1{padding-top:1.5rem;padding-bottom:1.5rem}.mb-1{margin-bottom:1rem!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1133
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: BelowImageCardComponent, isStandalone: true, selector: "simpo-below-image-card", inputs: { data: "data", styles: "styles", content: "content", componentId: "componentId", button: "button" }, ngImport: i0, template: "<div>\n <img [src]=\"data.image.url\" [alt]=\"data.image.altText\" [simpoImageDirective]=\"styles?.image\"\n [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" class=\"w-100\" *ngIf=\"content.display.showImage\">\n <div class=\"ptb-1\">\n <div class=\"heading-medium mb-1\" [innerHtml]=\"data.inputText[0].value\" *ngIf=\"content.display.showHeading\"></div>\n <div class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.display.showContent\"></div>\n <div *ngIf=\"content.display.showLink && content.display.linkType === 'Button'\">\n <app-button-element [buttonContent]=\"data.button\" [buttonStyle]=\"button?.styles\" [sectionId]=\"componentId\"\n [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n </div>\n</div>\n", styles: [".w-100{width:100%}.ptb-1{padding-top:1.5rem;padding-bottom:1.5rem}.mb-1{margin-bottom:1rem!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ImageDirectiveDirective$1, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: CornerDirective$1, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }] }); }
|
|
1111
1134
|
}
|
|
1112
1135
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: BelowImageCardComponent, decorators: [{
|
|
1113
1136
|
type: Component,
|
|
@@ -1132,7 +1155,7 @@ class TopOfImageCardComponent {
|
|
|
1132
1155
|
console.log(this.button);
|
|
1133
1156
|
}
|
|
1134
1157
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TopOfImageCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1135
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TopOfImageCardComponent, isStandalone: true, selector: "simpo-top-of-image-card", inputs: { data: "data", styles: "styles", content: "content", componentId: "componentId", button: "button" }, ngImport: i0, template: "<!-- <div style=\"position: relative;\">\n\n <img [src]=\"data.image.url\" [alt]=\"data.image.altText\" [simpoImageDirective]=\"styles?.image\"\n [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" class=\"w-100\" *ngIf=\"content.showImage\">\n\n <div class=\"content\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" [simpoTextBackgroundDirective]=\"styles?.textBackground\">\n <div style=\"color: white;\" class=\"heading-medium mb-1\" [innerHtml]=\"data.inputText[0].value\"\n *ngIf=\"content.showHeading\"></div>\n <div style=\"color: white;\" class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.showContent\">\n </div>\n <app-button-element [buttonData]=\"data?.button\" [sectionId]=\"componentId\" [buttonStyle]=\"styles?.button\" [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n</div>\n -->\n <div class=\"top-container\" [ngStyle]=\"{'background-image' : content.display.showImage ? 'url('+data.image.url+')' : ''}\"\n [simpoCorner]=\"styles?.corners\" [id]=\"componentId\">\n <div [simpoImageDirective]=\"styles?.image\" [id]=\"componentId\" *ngIf=\"content.display.showImage\"></div>\n <div class=\"content\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" [simpoTextBackgroundDirective]=\"content.display.showImage ? styles?.textBackground : ''\">\n <div class=\"heading-medium mb-1 lh-40\" [innerHtml]=\"data.inputText[0].value\"\n *ngIf=\"content.display.showHeading\"></div>\n <div class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.display.showContent\">\n </div>\n <div *ngIf=\"content.display.showLink && content.display.linkType === 'Button'\">\n <app-button-element [buttonContent]=\"data.button\" [buttonStyle]=\"button?.styles\" [sectionId]=\"componentId\" [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n </div>\n</div>\n\n", styles: [".w-100{width:100%}.mb-1{margin-bottom:1rem!important}.content{padding:3rem 1.5rem 1.5rem;min-height:256px;display:flex;flex-direction:column;justify-content:end}.top-container{background-position:center center;background-size:cover}.lh-40{line-height:40px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1158
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TopOfImageCardComponent, isStandalone: true, selector: "simpo-top-of-image-card", inputs: { data: "data", styles: "styles", content: "content", componentId: "componentId", button: "button" }, ngImport: i0, template: "<!-- <div style=\"position: relative;\">\n\n <img [src]=\"data.image.url\" [alt]=\"data.image.altText\" [simpoImageDirective]=\"styles?.image\"\n [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" class=\"w-100\" *ngIf=\"content.showImage\">\n\n <div class=\"content\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" [simpoTextBackgroundDirective]=\"styles?.textBackground\">\n <div style=\"color: white;\" class=\"heading-medium mb-1\" [innerHtml]=\"data.inputText[0].value\"\n *ngIf=\"content.showHeading\"></div>\n <div style=\"color: white;\" class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.showContent\">\n </div>\n <app-button-element [buttonData]=\"data?.button\" [sectionId]=\"componentId\" [buttonStyle]=\"styles?.button\" [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n</div>\n -->\n <div class=\"top-container\" [ngStyle]=\"{'background-image' : content.display.showImage ? 'url('+data.image.url+')' : ''}\"\n [simpoCorner]=\"styles?.corners\" [id]=\"componentId\">\n <div [simpoImageDirective]=\"styles?.image\" [id]=\"componentId\" *ngIf=\"content.display.showImage\"></div>\n <div class=\"content\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" [simpoTextBackgroundDirective]=\"content.display.showImage ? styles?.textBackground : ''\">\n <div class=\"heading-medium mb-1 lh-40\" [innerHtml]=\"data.inputText[0].value\"\n *ngIf=\"content.display.showHeading\"></div>\n <div class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.display.showContent\">\n </div>\n <div *ngIf=\"content.display.showLink && content.display.linkType === 'Button'\">\n <app-button-element [buttonContent]=\"data.button\" [buttonStyle]=\"button?.styles\" [sectionId]=\"componentId\" [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n </div>\n</div>\n\n", styles: [".w-100{width:100%}.mb-1{margin-bottom:1rem!important}.content{padding:3rem 1.5rem 1.5rem;min-height:256px;display:flex;flex-direction:column;justify-content:end}.top-container{background-position:center center;background-size:cover}.lh-40{line-height:40px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: ImageDirectiveDirective$1, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: CornerDirective$1, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: TextBackgroundDirectiveDirective$1, selector: "[simpoTextBackgroundDirective]", inputs: ["simpoTextBackgroundDirective"] }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }] }); }
|
|
1136
1159
|
}
|
|
1137
1160
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TopOfImageCardComponent, decorators: [{
|
|
1138
1161
|
type: Component,
|
|
@@ -1156,7 +1179,7 @@ class CoveringImageCardComponent {
|
|
|
1156
1179
|
// }
|
|
1157
1180
|
}
|
|
1158
1181
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CoveringImageCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1159
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: CoveringImageCardComponent, isStandalone: true, selector: "simpo-covering-image-card", inputs: { data: "data", styles: "styles", content: "content", componentId: "componentId", button: "button" }, ngImport: i0, template: "<div class=\"parent-tab\" [id]=\"componentId\" [simpoImageDirective]=\"styles?.image\">\n <img [src]=\"data.image.url\" [alt]=\"data.image.altText\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" class=\"w-100 img\" *ngIf=\"content.display.showImage\">\n <div class=\"ptb-1 content\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" [simpoTextBackgroundDirective]=\"styles?.textBackground\">\n <div class=\"heading-medium mb-1\" [innerHtml]=\"data.inputText[0].value\" *ngIf=\"content.display.showHeading\"></div>\n <div class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.display.showContent\"></div>\n <div *ngIf=\"content.display.showLink && content.display.linkType === 'Button'\">\n <app-button-element [buttonContent]=\"data.button\" [buttonStyle]=\"button?.styles\" [sectionId]=\"componentId\" [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n </div>\n</div>\n", styles: [".w-100{width:100%}.mb-1{margin-bottom:1rem!important}.content{position:relative;bottom:0;padding:1.5rem;display:flex;flex-direction:column;justify-content:center;height:fit-content;min-height:100%}.parent-tab{position:relative;height:100%;width:100%}.img{position:absolute;height:100%;display:flex}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1182
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: CoveringImageCardComponent, isStandalone: true, selector: "simpo-covering-image-card", inputs: { data: "data", styles: "styles", content: "content", componentId: "componentId", button: "button" }, ngImport: i0, template: "<div class=\"parent-tab\" [id]=\"componentId\" [simpoImageDirective]=\"styles?.image\">\n <img [src]=\"data.image.url\" [alt]=\"data.image.altText\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" class=\"w-100 img\" *ngIf=\"content.display.showImage\">\n <div class=\"ptb-1 content\" [simpoCorner]=\"styles?.corners\" [id]=\"componentId\" [simpoTextBackgroundDirective]=\"styles?.textBackground\">\n <div class=\"heading-medium mb-1\" [innerHtml]=\"data.inputText[0].value\" *ngIf=\"content.display.showHeading\"></div>\n <div class=\"body-desc\" [innerHtml]=\"data.inputText[01].value\" *ngIf=\"content.display.showContent\"></div>\n <div *ngIf=\"content.display.showLink && content.display.linkType === 'Button'\">\n <app-button-element [buttonContent]=\"data.button\" [buttonStyle]=\"button?.styles\" [sectionId]=\"componentId\" [color]=\"styles?.background?.accentColor\"></app-button-element>\n </div>\n </div>\n</div>\n", styles: [".w-100{width:100%}.mb-1{margin-bottom:1rem!important}.content{position:relative;bottom:0;padding:1.5rem;display:flex;flex-direction:column;justify-content:center;height:fit-content;min-height:100%}.parent-tab{position:relative;height:100%;width:100%}.img{position:absolute;height:100%;display:flex}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ImageDirectiveDirective$1, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: CornerDirective$1, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: TextBackgroundDirectiveDirective$1, selector: "[simpoTextBackgroundDirective]", inputs: ["simpoTextBackgroundDirective"] }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }] }); }
|
|
1160
1183
|
}
|
|
1161
1184
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: CoveringImageCardComponent, decorators: [{
|
|
1162
1185
|
type: Component,
|
|
@@ -1249,7 +1272,7 @@ class ServiceSectionComponent {
|
|
|
1249
1272
|
this.showEditors = isShow;
|
|
1250
1273
|
}
|
|
1251
1274
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ServiceSectionComponent, deps: [{ token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1252
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ServiceSectionComponent, isStandalone: true, selector: "simpo-service-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"cards\" [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\"\n *ngFor=\"let service of content?.listItem?.data\">\n <ng-container *ngIf=\"style?.textPosition === TextPosition.BELOW_IMAGE\">\n <simpo-below-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-below-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.TOP_OF_IMAGE\">\n <simpo-top-of-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-top-of-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.COVERING_IMAGE\">\n <simpo-covering-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-covering-image-card>\n </ng-container>\n\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.mb-1{margin-bottom:1.5rem!important}.cards{padding-bottom:10px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: BelowImageCardComponent, selector: "simpo-below-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: TopOfImageCardComponent, selector: "simpo-top-of-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: CoveringImageCardComponent, selector: "simpo-covering-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1275
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ServiceSectionComponent, isStandalone: true, selector: "simpo-service-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"cards\" [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\"\n *ngFor=\"let service of content?.listItem?.data\">\n <ng-container *ngIf=\"style?.textPosition === TextPosition.BELOW_IMAGE\">\n <simpo-below-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-below-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.TOP_OF_IMAGE\">\n <simpo-top-of-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-top-of-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.COVERING_IMAGE\">\n <simpo-covering-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-covering-image-card>\n </ng-container>\n\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.mb-1{margin-bottom:1.5rem!important}.cards{padding-bottom:10px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: BelowImageCardComponent, selector: "simpo-below-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: TopOfImageCardComponent, selector: "simpo-top-of-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: CoveringImageCardComponent, selector: "simpo-covering-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ContentFitDirective$1, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: ColumnDirectiveDirective, selector: "[simpoColumnDirective]", inputs: ["simpoColumnDirective"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1253
1276
|
}
|
|
1254
1277
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ServiceSectionComponent, decorators: [{
|
|
1255
1278
|
type: Component,
|
|
@@ -1258,8 +1281,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1258
1281
|
CommonModule,
|
|
1259
1282
|
ContentFitDirective$1,
|
|
1260
1283
|
StyleDirectivesModule,
|
|
1261
|
-
SimpoComponentModule
|
|
1262
|
-
|
|
1284
|
+
SimpoComponentModule,
|
|
1285
|
+
AnimationDirective$1,
|
|
1286
|
+
BorderDirective$1,
|
|
1287
|
+
OverlayDirective$1,
|
|
1288
|
+
BackgroundDirective$1,
|
|
1289
|
+
ContentFitDirective$1,
|
|
1290
|
+
ContainerFitDirective$1,
|
|
1291
|
+
HoverDirective$1,
|
|
1292
|
+
BannerContentFitDirective$1,
|
|
1293
|
+
CornerDirective$1,
|
|
1294
|
+
ColumnDirectiveDirective$1,
|
|
1295
|
+
ImageDirectiveDirective$1,
|
|
1296
|
+
simpoConetenAlignmentDirective$1,
|
|
1297
|
+
PositionLayoutDirectiveDirective$1,
|
|
1298
|
+
SimpoFooterLayoutDirective$1,
|
|
1299
|
+
ButtonDirectiveDirective$1,
|
|
1300
|
+
TextBackgroundDirectiveDirective$1,
|
|
1301
|
+
SimpoButtonComponent$1
|
|
1302
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"cards\" [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\"\n *ngFor=\"let service of content?.listItem?.data\">\n <ng-container *ngIf=\"style?.textPosition === TextPosition.BELOW_IMAGE\">\n <simpo-below-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-below-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.TOP_OF_IMAGE\">\n <simpo-top-of-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-top-of-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.COVERING_IMAGE\">\n <simpo-covering-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-covering-image-card>\n </ng-container>\n\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.mb-1{margin-bottom:1.5rem!important}.cards{padding-bottom:10px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"] }]
|
|
1263
1303
|
}], ctorParameters: () => [{ type: i1.EventsService }], propDecorators: { data: [{
|
|
1264
1304
|
type: Input
|
|
1265
1305
|
}], index: [{
|
|
@@ -1284,7 +1324,7 @@ class TeamMemberSectionComponent {
|
|
|
1284
1324
|
this.showEditors = isShow;
|
|
1285
1325
|
}
|
|
1286
1326
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TeamMemberSectionComponent, deps: [{ token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1287
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TeamMemberSectionComponent, isStandalone: true, selector: "simpo-team-member-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"cards\" [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\"\n *ngFor=\"let service of content?.listItem?.data\">\n <ng-container *ngIf=\"style?.textPosition === TextPosition.BELOW_IMAGE\">\n <simpo-below-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-below-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.TOP_OF_IMAGE\">\n <simpo-top-of-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-top-of-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.COVERING_IMAGE\">\n <simpo-covering-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-covering-image-card>\n </ng-container>\n\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.mb-1{margin-bottom:1.5rem!important}.cards{padding-bottom:10px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: BelowImageCardComponent, selector: "simpo-below-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: TopOfImageCardComponent, selector: "simpo-top-of-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: CoveringImageCardComponent, selector: "simpo-covering-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1327
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TeamMemberSectionComponent, isStandalone: true, selector: "simpo-team-member-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"cards\" [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\"\n *ngFor=\"let service of content?.listItem?.data\">\n <ng-container *ngIf=\"style?.textPosition === TextPosition.BELOW_IMAGE\">\n <simpo-below-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-below-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.TOP_OF_IMAGE\">\n <simpo-top-of-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-top-of-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.COVERING_IMAGE\">\n <simpo-covering-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-covering-image-card>\n </ng-container>\n\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.mb-1{margin-bottom:1.5rem!important}.cards{padding-bottom:10px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: BelowImageCardComponent, selector: "simpo-below-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: TopOfImageCardComponent, selector: "simpo-top-of-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "component", type: CoveringImageCardComponent, selector: "simpo-covering-image-card", inputs: ["data", "styles", "content", "componentId", "button"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: ContentFitDirective$1, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: ColumnDirectiveDirective, selector: "[simpoColumnDirective]", inputs: ["simpoColumnDirective"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1288
1328
|
}
|
|
1289
1329
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TeamMemberSectionComponent, decorators: [{
|
|
1290
1330
|
type: Component,
|
|
@@ -1293,8 +1333,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1293
1333
|
CommonModule,
|
|
1294
1334
|
ContentFitDirective$1,
|
|
1295
1335
|
StyleDirectivesModule,
|
|
1296
|
-
SimpoComponentModule
|
|
1297
|
-
|
|
1336
|
+
SimpoComponentModule,
|
|
1337
|
+
AnimationDirective$1,
|
|
1338
|
+
BorderDirective$1,
|
|
1339
|
+
OverlayDirective$1,
|
|
1340
|
+
BackgroundDirective$1,
|
|
1341
|
+
ContentFitDirective$1,
|
|
1342
|
+
ContainerFitDirective$1,
|
|
1343
|
+
HoverDirective$1,
|
|
1344
|
+
BannerContentFitDirective$1,
|
|
1345
|
+
CornerDirective$1,
|
|
1346
|
+
ColumnDirectiveDirective$1,
|
|
1347
|
+
ImageDirectiveDirective$1,
|
|
1348
|
+
simpoConetenAlignmentDirective$1,
|
|
1349
|
+
PositionLayoutDirectiveDirective$1,
|
|
1350
|
+
SimpoFooterLayoutDirective$1,
|
|
1351
|
+
ButtonDirectiveDirective$1,
|
|
1352
|
+
TextBackgroundDirectiveDirective$1,
|
|
1353
|
+
SimpoButtonComponent$1
|
|
1354
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div class=\"cards\" [simpoColumnDirective]=\"data?.styles?.size\" [id]=\"data?.id\"\n *ngFor=\"let service of content?.listItem?.data\">\n <ng-container *ngIf=\"style?.textPosition === TextPosition.BELOW_IMAGE\">\n <simpo-below-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-below-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.TOP_OF_IMAGE\">\n <simpo-top-of-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-top-of-image-card>\n </ng-container>\n <ng-container *ngIf=\"style?.textPosition === TextPosition.COVERING_IMAGE\">\n <simpo-covering-image-card [data]=\"service\" [styles]=\"style\" [content]=\"content\" [button]=\"button\"\n [componentId]=\"data?.id\"></simpo-covering-image-card>\n </ng-container>\n\n </div>\n </div>\n </div>\n </div>\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.mb-1{margin-bottom:1.5rem!important}.cards{padding-bottom:10px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"] }]
|
|
1298
1355
|
}], ctorParameters: () => [{ type: i1.EventsService }], propDecorators: { data: [{
|
|
1299
1356
|
type: Input
|
|
1300
1357
|
}], index: [{
|
|
@@ -1353,7 +1410,7 @@ class TestimonialSectionComponent {
|
|
|
1353
1410
|
this.showEditors = isShow;
|
|
1354
1411
|
}
|
|
1355
1412
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TestimonialSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1356
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TestimonialSectionComponent, isStandalone: true, selector: "simpo-testimonial-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover\n (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"testimonialCarousel\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#testimonialCarousel\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let testimonial of content?.listItem?.data; let i = index\"\n [class.active]=\"i === 0\">\n <div style=\"width: 90%; margin: auto;\">\n <div class=\"carousel-caption d-flex flex-column h-100 bottom-0\" style=\"width: 90%;\" [simpoContainerLayout]=\"style?.layout\">\n <img [src]=\"testimonial.image.url\" class=\"mb-1\">\n <p class=\"heading-medium\">{{ testimonial.inputText[0].value }}</p>\n <span href=\"#\" class=\"py-2 px-4 mb-1\">- {{ testimonial.inputText[1].value }}</span>\n </div>\n </div>\n </div>\n </div>\n <a class=\"carousel-control-prev\" data-bs-target=\"#testimonialCarousel\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a class=\"carousel-control-next\" data-bs-target=\"#testimonialCarousel\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.carousel-caption{padding:0!important;left:0%!important;right:0%!important;text-align:unset!important;position:relative!important}.carousel-caption img{width:100px;height:100px;border-radius:50%}.heading-large{margin-left:1%;margin-right:1%}.mb-1{margin-bottom:1.5rem!important}.carousel-indicators{bottom:-30px!important}.carousel-control-prev,.carousel-control-next{width:5%!important}.previous-icon{position:absolute;width:45px;height:45px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1413
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TestimonialSectionComponent, isStandalone: true, selector: "simpo-testimonial-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover\n (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"testimonialCarousel\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#testimonialCarousel\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let testimonial of content?.listItem?.data; let i = index\"\n [class.active]=\"i === 0\">\n <div style=\"width: 90%; margin: auto;\">\n <div class=\"carousel-caption d-flex flex-column h-100 bottom-0\" style=\"width: 90%;\" [simpoContainerLayout]=\"style?.layout\">\n <img [src]=\"testimonial.image.url\" class=\"mb-1\">\n <p class=\"heading-medium\">{{ testimonial.inputText[0].value }}</p>\n <span href=\"#\" class=\"py-2 px-4 mb-1\">- {{ testimonial.inputText[1].value }}</span>\n </div>\n </div>\n </div>\n </div>\n <a class=\"carousel-control-prev\" data-bs-target=\"#testimonialCarousel\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a class=\"carousel-control-next\" data-bs-target=\"#testimonialCarousel\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.carousel-caption{padding:0!important;left:0%!important;right:0%!important;text-align:unset!important;position:relative!important}.carousel-caption img{width:100px;height:100px;border-radius:50%}.heading-large{margin-left:1%;margin-right:1%}.mb-1{margin-bottom:1.5rem!important}.carousel-indicators{bottom:-30px!important}.carousel-control-prev,.carousel-control-next{width:5%!important}.previous-icon{position:absolute;width:45px;height:45px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: ContainerFitDirective, selector: "[simpoContainerLayout]", inputs: ["simpoContainerLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1357
1414
|
}
|
|
1358
1415
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TestimonialSectionComponent, decorators: [{
|
|
1359
1416
|
type: Component,
|
|
@@ -1364,7 +1421,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1364
1421
|
StyleDirectivesModule,
|
|
1365
1422
|
ContentFitDirective$1,
|
|
1366
1423
|
SimpoComponentModule,
|
|
1367
|
-
|
|
1424
|
+
AnimationDirective$1,
|
|
1425
|
+
BorderDirective$1,
|
|
1426
|
+
OverlayDirective$1,
|
|
1427
|
+
BackgroundDirective$1,
|
|
1428
|
+
ContentFitDirective$1,
|
|
1429
|
+
ContainerFitDirective$1,
|
|
1430
|
+
HoverDirective$1,
|
|
1431
|
+
BannerContentFitDirective$1,
|
|
1432
|
+
CornerDirective$1,
|
|
1433
|
+
ColumnDirectiveDirective$1,
|
|
1434
|
+
ImageDirectiveDirective$1,
|
|
1435
|
+
simpoConetenAlignmentDirective$1,
|
|
1436
|
+
PositionLayoutDirectiveDirective$1,
|
|
1437
|
+
SimpoFooterLayoutDirective$1,
|
|
1438
|
+
ButtonDirectiveDirective$1,
|
|
1439
|
+
TextBackgroundDirectiveDirective$1,
|
|
1440
|
+
SimpoButtonComponent$1
|
|
1441
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover\n (hovering)=\"showEditTabs($event)\" class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\" [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n <div *ngFor=\"let text of data?.content?.inputText\">\n <div class=\"heading-large mb-1\" [innerHTML]=\"text.value\"></div>\n </div>\n\n <div id=\"testimonialCarousel\" class=\"carousel slide mb-1\">\n <ol class=\"carousel-indicators\">\n <li *ngFor=\"let img of content?.listItem?.data; let i = index\" [class.active]=\"i === 0\"\n data-bs-target=\"#testimonialCarousel\" [attr.data-bs-slide-to]=\"i\"></li>\n </ol>\n <div class=\"carousel-inner\">\n <div class=\"carousel-item\" *ngFor=\"let testimonial of content?.listItem?.data; let i = index\"\n [class.active]=\"i === 0\">\n <div style=\"width: 90%; margin: auto;\">\n <div class=\"carousel-caption d-flex flex-column h-100 bottom-0\" style=\"width: 90%;\" [simpoContainerLayout]=\"style?.layout\">\n <img [src]=\"testimonial.image.url\" class=\"mb-1\">\n <p class=\"heading-medium\">{{ testimonial.inputText[0].value }}</p>\n <span href=\"#\" class=\"py-2 px-4 mb-1\">- {{ testimonial.inputText[1].value }}</span>\n </div>\n </div>\n </div>\n </div>\n <a class=\"carousel-control-prev\" data-bs-target=\"#testimonialCarousel\" role=\"button\" data-bs-slide=\"prev\">\n <span class=\"carousel-control-prev-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Previous</span>\n </a>\n <a class=\"carousel-control-next\" data-bs-target=\"#testimonialCarousel\" role=\"button\" data-bs-slide=\"next\">\n <span class=\"carousel-control-next-icon previous-icon\" aria-hidden=\"true\"></span>\n <span class=\"sr-only\">Next</span>\n </a>\n </div>\n\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.carousel-caption{padding:0!important;left:0%!important;right:0%!important;text-align:unset!important;position:relative!important}.carousel-caption img{width:100px;height:100px;border-radius:50%}.heading-large{margin-left:1%;margin-right:1%}.mb-1{margin-bottom:1.5rem!important}.carousel-indicators{bottom:-30px!important}.carousel-control-prev,.carousel-control-next{width:5%!important}.previous-icon{position:absolute;width:45px;height:45px}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"] }]
|
|
1368
1442
|
}], propDecorators: { data: [{
|
|
1369
1443
|
type: Input
|
|
1370
1444
|
}], index: [{
|
|
@@ -1374,6 +1448,98 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1374
1448
|
args: ['mainContainer']
|
|
1375
1449
|
}] } });
|
|
1376
1450
|
|
|
1451
|
+
class simpoConetenAlignmentDirective {
|
|
1452
|
+
constructor(el, eventService) {
|
|
1453
|
+
this.el = el;
|
|
1454
|
+
this.eventService = eventService;
|
|
1455
|
+
}
|
|
1456
|
+
ngOnChanges() {
|
|
1457
|
+
this.applyContentAlignment();
|
|
1458
|
+
}
|
|
1459
|
+
ngOnDestroy() {
|
|
1460
|
+
if (this.contentAlignmentSubscription) {
|
|
1461
|
+
this.contentAlignmentSubscription.unsubscribe();
|
|
1462
|
+
}
|
|
1463
|
+
}
|
|
1464
|
+
changeAlignmentCheck() {
|
|
1465
|
+
this.contentAlignmentSubscription = this.eventService.contentAlignmentChangeCheck.subscribe((res) => {
|
|
1466
|
+
if (this.el.nativeElement.id === res.id) {
|
|
1467
|
+
this.contentAlignmentData = res.data;
|
|
1468
|
+
this.applyContentAlignment();
|
|
1469
|
+
}
|
|
1470
|
+
});
|
|
1471
|
+
}
|
|
1472
|
+
applyContentAlignment() {
|
|
1473
|
+
this.removeAllClassIfPresent();
|
|
1474
|
+
if (this.contentAlignmentData) {
|
|
1475
|
+
this.el.nativeElement.classList.add(contentAlignment$1[this.contentAlignmentData]);
|
|
1476
|
+
}
|
|
1477
|
+
}
|
|
1478
|
+
removeAllClassIfPresent() {
|
|
1479
|
+
this.el.nativeElement.classList.remove(contentAlignment$1[AlignContent$1.Image_BOTTOM]);
|
|
1480
|
+
this.el.nativeElement.classList.remove(contentAlignment$1[AlignContent$1.Image_CENTER]);
|
|
1481
|
+
this.el.nativeElement.classList.remove(contentAlignment$1[AlignContent$1.Image_TOP]);
|
|
1482
|
+
}
|
|
1483
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: simpoConetenAlignmentDirective, deps: [{ token: i0.ElementRef }, { token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1484
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: simpoConetenAlignmentDirective, isStandalone: true, selector: "[simpoContentAlignment]", inputs: { contentAlignmentData: ["simpoContentAlignment", "contentAlignmentData"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
1485
|
+
}
|
|
1486
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: simpoConetenAlignmentDirective, decorators: [{
|
|
1487
|
+
type: Directive,
|
|
1488
|
+
args: [{
|
|
1489
|
+
selector: '[simpoContentAlignment]',
|
|
1490
|
+
standalone: true,
|
|
1491
|
+
}]
|
|
1492
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.EventsService }], propDecorators: { contentAlignmentData: [{
|
|
1493
|
+
type: Input,
|
|
1494
|
+
args: ['simpoContentAlignment']
|
|
1495
|
+
}] } });
|
|
1496
|
+
|
|
1497
|
+
class PositionLayoutDirectiveDirective {
|
|
1498
|
+
constructor(el, eventService) {
|
|
1499
|
+
this.el = el;
|
|
1500
|
+
this.eventService = eventService;
|
|
1501
|
+
this.positionLayoutChangeCheck();
|
|
1502
|
+
}
|
|
1503
|
+
ngOnChanges() {
|
|
1504
|
+
this.changePositionLayout();
|
|
1505
|
+
}
|
|
1506
|
+
ngOnDestroy() {
|
|
1507
|
+
if (this.positionLayoutSubscription) {
|
|
1508
|
+
this.positionLayoutSubscription.unsubscribe();
|
|
1509
|
+
}
|
|
1510
|
+
}
|
|
1511
|
+
changePositionLayout() {
|
|
1512
|
+
this.removeAllClassIfPresent();
|
|
1513
|
+
this.el.nativeElement.classList.add(BANNERALIGNMENT$1[this.positionLayout?.value]);
|
|
1514
|
+
}
|
|
1515
|
+
removeAllClassIfPresent() {
|
|
1516
|
+
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.left);
|
|
1517
|
+
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.right);
|
|
1518
|
+
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.top);
|
|
1519
|
+
this.el.nativeElement.classList.remove(BANNERALIGNMENT$1.bottom);
|
|
1520
|
+
}
|
|
1521
|
+
positionLayoutChangeCheck() {
|
|
1522
|
+
this.positionLayoutSubscription = this.eventService.postionLayoutChangeChecks.subscribe((res) => {
|
|
1523
|
+
if (this.el.nativeElement.id === res.id) {
|
|
1524
|
+
this.positionLayout = res.data;
|
|
1525
|
+
this.changePositionLayout();
|
|
1526
|
+
}
|
|
1527
|
+
});
|
|
1528
|
+
}
|
|
1529
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: PositionLayoutDirectiveDirective, deps: [{ token: i0.ElementRef }, { token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1530
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.2.3", type: PositionLayoutDirectiveDirective, isStandalone: true, selector: "[simpoPositionLayoutDirective]", inputs: { positionLayout: ["simpoPositionLayoutDirective", "positionLayout"] }, usesOnChanges: true, ngImport: i0 }); }
|
|
1531
|
+
}
|
|
1532
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: PositionLayoutDirectiveDirective, decorators: [{
|
|
1533
|
+
type: Directive,
|
|
1534
|
+
args: [{
|
|
1535
|
+
selector: '[simpoPositionLayoutDirective]',
|
|
1536
|
+
standalone: true
|
|
1537
|
+
}]
|
|
1538
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.EventsService }], propDecorators: { positionLayout: [{
|
|
1539
|
+
type: Input,
|
|
1540
|
+
args: ['simpoPositionLayoutDirective']
|
|
1541
|
+
}] } });
|
|
1542
|
+
|
|
1377
1543
|
class TextImageSectionComponent {
|
|
1378
1544
|
constructor(eventService) {
|
|
1379
1545
|
this.eventService = eventService;
|
|
@@ -1389,7 +1555,7 @@ class TextImageSectionComponent {
|
|
|
1389
1555
|
this.showEditors = isShow;
|
|
1390
1556
|
}
|
|
1391
1557
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TextImageSectionComponent, deps: [{ token: i1.EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1392
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TextImageSectionComponent, isStandalone: true, selector: "simpo-text-image-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\" >\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoAnimation]=\"styles?.animation\" [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\"\r\n >\r\n <div class=\"col-10 col-sm-8 col-lg-6\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column\" [simpoContentAlignment]=\"styles?.contentAlignment\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n </div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px;margin-top:15px}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1558
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: TextImageSectionComponent, isStandalone: true, selector: "simpo-text-image-section", inputs: { data: "data", index: "index" }, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\" >\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoAnimation]=\"styles?.animation\" [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\"\r\n >\r\n <div class=\"col-10 col-sm-8 col-lg-6\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column\" [simpoContentAlignment]=\"styles?.contentAlignment\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\r\n </div>\r\n </div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px;margin-top:15px}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: simpoConetenAlignmentDirective, selector: "[simpoContentAlignment]", inputs: ["simpoContentAlignment"] }, { kind: "directive", type: PositionLayoutDirectiveDirective, selector: "[simpoPositionLayoutDirective]", inputs: ["simpoPositionLayoutDirective"] }, { kind: "ngmodule", type: MatGridListModule }] }); }
|
|
1393
1559
|
}
|
|
1394
1560
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TextImageSectionComponent, decorators: [{
|
|
1395
1561
|
type: Component,
|
|
@@ -1399,8 +1565,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1399
1565
|
SimpoComponentModule,
|
|
1400
1566
|
StyleDirectivesModule,
|
|
1401
1567
|
MatGridListModule,
|
|
1568
|
+
SimpoButtonComponent$1,
|
|
1569
|
+
AnimationDirective$1,
|
|
1570
|
+
BorderDirective$1,
|
|
1571
|
+
OverlayDirective$1,
|
|
1572
|
+
BackgroundDirective$1,
|
|
1573
|
+
ContentFitDirective$1,
|
|
1574
|
+
ContainerFitDirective$1,
|
|
1575
|
+
HoverDirective$1,
|
|
1576
|
+
BannerContentFitDirective$1,
|
|
1577
|
+
CornerDirective$1,
|
|
1578
|
+
ColumnDirectiveDirective$1,
|
|
1579
|
+
ImageDirectiveDirective$1,
|
|
1580
|
+
simpoConetenAlignmentDirective$1,
|
|
1581
|
+
PositionLayoutDirectiveDirective$1,
|
|
1582
|
+
SimpoFooterLayoutDirective$1,
|
|
1583
|
+
ButtonDirectiveDirective$1,
|
|
1584
|
+
TextBackgroundDirectiveDirective$1,
|
|
1402
1585
|
SimpoButtonComponent$1
|
|
1403
|
-
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\" >\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoAnimation]=\"styles?.animation\" [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\"\r\n >\r\n <div class=\"col-10 col-sm-8 col-lg-6\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column\" [simpoContentAlignment]=\"styles?.contentAlignment\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\r\n </div>\r\n </div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px;margin-top:15px}\n"] }]
|
|
1586
|
+
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\" [simpoBorder]=\"styles?.border\" >\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoLayout]=\"styles?.layout\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoAnimation]=\"styles?.animation\" [ngClass]=\"{ 'align-items-stretch': styles?.positionLayout?.value === 'left' || styles?.positionLayout?.value === 'right' }\"\r\n >\r\n <div class=\"col-10 col-sm-8 col-lg-6\">\r\n <img\r\n [src]=\"content?.image?.url\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"500\" loading=\"lazy\"/>\r\n </div>\r\n <div class=\"col-lg-6 d-flex flex-column\" [simpoContentAlignment]=\"styles?.contentAlignment\" [id]=\"data?.id\">\r\n <div *ngFor=\"let item of content?.inputText\">\r\n <div [innerHTML]=\"item.value\" [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\"></div>\r\n </div>\r\n <div *ngIf=\"data?.action && data?.action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of data?.action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\" [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\r\n </div>\r\n </div>\r\n", styles: [".btn-primary{border:none}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:100%}.button-display{display:flex;gap:10px;margin-top:15px}\n"] }]
|
|
1404
1587
|
}], ctorParameters: () => [{ type: i1.EventsService }], propDecorators: { data: [{
|
|
1405
1588
|
type: Input
|
|
1406
1589
|
}], index: [{
|
|
@@ -1424,8 +1607,8 @@ class VideoSectionComponent {
|
|
|
1424
1607
|
showEditTabs(isShow) {
|
|
1425
1608
|
this.showEditors = isShow;
|
|
1426
1609
|
}
|
|
1427
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: VideoSectionComponent, deps: [{ token: i1$
|
|
1428
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: VideoSectionComponent, isStandalone: true, selector: "simpo-video-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\n class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid main-section\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\"\n [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"heading-large mb-1\" [innerHTML]=\"text.value\">\n </div>\n\n\n <div class=\"video-section\" [ngStyle]=\"style?.fullScreen ? {'padding': '0px', 'margin': '0px'} : {}\">\n <iframe class=\"video\"\n [ngClass]=\"{'h-80': style?.layout?.fit === 'content', 'video': style?.layout?.fit === 'screen'}\"\n [src]=\"dom.bypassSecurityTrustResourceUrl(videoLink)\" frameborder=\"0\" allowfullscreen></iframe>\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.video{width:100%;height:100vh}.main-section{width:100%;height:100%!important;display:block!important}.h-80{width:100%;height:80vh}.mb-1{margin-bottom:1.5rem!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1610
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: VideoSectionComponent, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1611
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: VideoSectionComponent, isStandalone: true, selector: "simpo-video-section", inputs: { data: "data", index: "index" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], ngImport: i0, template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\n class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid main-section\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\"\n [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"heading-large mb-1\" [innerHTML]=\"text.value\">\n </div>\n\n\n <div class=\"video-section\" [ngStyle]=\"style?.fullScreen ? {'padding': '0px', 'margin': '0px'} : {}\">\n <iframe class=\"video\"\n [ngClass]=\"{'h-80': style?.layout?.fit === 'content', 'video': style?.layout?.fit === 'screen'}\"\n [src]=\"dom.bypassSecurityTrustResourceUrl(videoLink)\" frameborder=\"0\" allowfullscreen></iframe>\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.video{width:100%;height:100vh}.main-section{width:100%;height:100%!important;display:block!important}.h-80{width:100%;height:80vh}.mb-1{margin-bottom:1.5rem!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: StyleDirectivesModule }, { kind: "directive", type: AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index"], outputs: ["edit"] }] }); }
|
|
1429
1612
|
}
|
|
1430
1613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: VideoSectionComponent, decorators: [{
|
|
1431
1614
|
type: Component,
|
|
@@ -1435,9 +1618,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1435
1618
|
ColumnDirectiveDirective$1,
|
|
1436
1619
|
StyleDirectivesModule,
|
|
1437
1620
|
ContentFitDirective$1,
|
|
1438
|
-
SimpoComponentModule
|
|
1439
|
-
|
|
1440
|
-
|
|
1621
|
+
SimpoComponentModule,
|
|
1622
|
+
AnimationDirective$1,
|
|
1623
|
+
BorderDirective$1,
|
|
1624
|
+
OverlayDirective$1,
|
|
1625
|
+
BackgroundDirective$1,
|
|
1626
|
+
ContentFitDirective$1,
|
|
1627
|
+
ContainerFitDirective$1,
|
|
1628
|
+
HoverDirective$1,
|
|
1629
|
+
BannerContentFitDirective$1,
|
|
1630
|
+
CornerDirective$1,
|
|
1631
|
+
ColumnDirectiveDirective$1,
|
|
1632
|
+
ImageDirectiveDirective$1,
|
|
1633
|
+
simpoConetenAlignmentDirective$1,
|
|
1634
|
+
PositionLayoutDirectiveDirective$1,
|
|
1635
|
+
SimpoFooterLayoutDirective$1,
|
|
1636
|
+
ButtonDirectiveDirective$1,
|
|
1637
|
+
TextBackgroundDirectiveDirective$1,
|
|
1638
|
+
SimpoButtonComponent$1
|
|
1639
|
+
], template: "<section [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\n class=\"total-container\">\n <div #mainContainer [id]=\"data?.id\" [simpoOverlay]=\"style?.background\">\n <div class=\"container-fluid main-section\" [id]=\"data?.id\" [simpoBorder]=\"style?.border\"\n [simpoLayout]=\"style?.layout\">\n <div class=\"row\" [id]=\"data?.id\" [simpoAnimation]=\"style?.animation\">\n\n <div *ngFor=\"let text of data?.content?.inputText\" class=\"heading-large mb-1\" [innerHTML]=\"text.value\">\n </div>\n\n\n <div class=\"video-section\" [ngStyle]=\"style?.fullScreen ? {'padding': '0px', 'margin': '0px'} : {}\">\n <iframe class=\"video\"\n [ngClass]=\"{'h-80': style?.layout?.fit === 'content', 'video': style?.layout?.fit === 'screen'}\"\n [src]=\"dom.bypassSecurityTrustResourceUrl(videoLink)\" frameborder=\"0\" allowfullscreen></iframe>\n \u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\u00A0\n </div>\n\n </div>\n </div>\n </div>\n\n <div class=\"hover_effect\" *ngIf=\"showEditors\">\n <simpo-hover-elements [data]=\"data\" [index]=\"index\"></simpo-hover-elements>\n </div>\n</section>\n", styles: [".total-container{height:auto;position:relative}.video{width:100%;height:100vh}.main-section{width:100%;height:100%!important;display:block!important}.h-80{width:100%;height:80vh}.mb-1{margin-bottom:1.5rem!important}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}@media screen and (min-width: 760px){.cards{padding-bottom:24px}}\n"] }]
|
|
1640
|
+
}], ctorParameters: () => [{ type: i1$3.DomSanitizer }], propDecorators: { data: [{
|
|
1441
1641
|
type: Input
|
|
1442
1642
|
}], index: [{
|
|
1443
1643
|
type: Input
|
|
@@ -1447,17 +1647,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1447
1647
|
}] } });
|
|
1448
1648
|
|
|
1449
1649
|
class NavbarSectionComponent {
|
|
1450
|
-
constructor() {
|
|
1650
|
+
constructor() {
|
|
1651
|
+
this.color = '#000000';
|
|
1652
|
+
this.screenWidth = 0;
|
|
1653
|
+
this.getScreenSize();
|
|
1654
|
+
}
|
|
1451
1655
|
ngOnInit() {
|
|
1656
|
+
this.content = this.data?.content;
|
|
1657
|
+
this.style = this.data?.styles;
|
|
1658
|
+
}
|
|
1659
|
+
getScreenSize(event) {
|
|
1660
|
+
this.screenWidth = window.innerWidth;
|
|
1452
1661
|
}
|
|
1453
1662
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: NavbarSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1454
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: NavbarSectionComponent, isStandalone: true, selector: "simpo-navbar-section", inputs: { index: "index" }, ngImport: i0, template: "<nav class=\"navbar navbar-expand-lg bg-light\">\r\n <div class=\"container-fluid\">\r\n <a class=\"navbar-brand\" href=\"#\">
|
|
1663
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: NavbarSectionComponent, isStandalone: true, selector: "simpo-navbar-section", inputs: { data: "data", index: "index" }, host: { listeners: { "window:resize": "getScreenSize($event)" } }, ngImport: i0, template: "<nav class=\"navbar navbar-expand-lg bg-light d-block mb-0\">\r\n <div class=\"container-fluid\">\r\n <div class=\"w-50 left-logo-text\">\r\n <!-- <a class=\"navbar-brand\" href=\"#\">{{content?.siteName?.value}}</a> -->\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"w-50 right-btn d-flex justify-content-end\">\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNavAltMarkup\"\r\n aria-controls=\"navbarNavAltMarkup\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n </div>\r\n <div class=\"collapse navbar-collapse p-4\" *ngIf=\"screenWidth > 475\">\r\n <div class=\"navbar-nav align-items-center\">\r\n <div class=\"d-flex\">\r\n <a class=\"nav-link active\" aria-current=\"page\" href=\"#\">Home</a>\r\n <a class=\"nav-link\" href=\"#\">Features</a>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.isSocialLink ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.isSocialLink\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"content?.isButton\" class=\"button-display mt-0 mb-4\">\r\n <div *ngFor=\"let button of content?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarNavAltMarkup\" *ngIf=\"screenWidth < 475\">\r\n asfjklsajdfkl\r\n </div>\r\n </div>\r\n</nav>", styles: [".navbar-toggler{height:40px}@media only screen and (max-width : 475px){.left-logo-text{width:85%!important}.right-btn{width:15%!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: SimpoButtonComponent$1, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "color", "sectionId"] }, { kind: "component", type: SociaIconsComponent$1, selector: "simpo-socia-icons", inputs: ["socialIconData", "color"] }] }); }
|
|
1455
1664
|
}
|
|
1456
1665
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: NavbarSectionComponent, decorators: [{
|
|
1457
1666
|
type: Component,
|
|
1458
|
-
args: [{ selector: 'simpo-navbar-section', standalone: true, imports: [], template: "<nav class=\"navbar navbar-expand-lg bg-light\">\r\n <div class=\"container-fluid\">\r\n <a class=\"navbar-brand\" href=\"#\">
|
|
1459
|
-
}], ctorParameters: () => [], propDecorators: {
|
|
1667
|
+
args: [{ selector: 'simpo-navbar-section', standalone: true, imports: [CommonModule, SimpoButtonComponent$1, SociaIconsComponent$1], template: "<nav class=\"navbar navbar-expand-lg bg-light d-block mb-0\">\r\n <div class=\"container-fluid\">\r\n <div class=\"w-50 left-logo-text\">\r\n <!-- <a class=\"navbar-brand\" href=\"#\">{{content?.siteName?.value}}</a> -->\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source === 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.source != 'BRANDING'\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" width=\"100px\">\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"w-50 right-btn d-flex justify-content-end\">\r\n <button class=\"navbar-toggler\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNavAltMarkup\"\r\n aria-controls=\"navbarNavAltMarkup\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <span class=\"navbar-toggler-icon\"></span>\r\n </button>\r\n </div>\r\n <div class=\"collapse navbar-collapse p-4\" *ngIf=\"screenWidth > 475\">\r\n <div class=\"navbar-nav align-items-center\">\r\n <div class=\"d-flex\">\r\n <a class=\"nav-link active\" aria-current=\"page\" href=\"#\">Home</a>\r\n <a class=\"nav-link\" href=\"#\">Features</a>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.isSocialLink ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.isSocialLink\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"color\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"content?.isButton\" class=\"button-display mt-0 mb-4\">\r\n <div *ngFor=\"let button of content?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarNavAltMarkup\" *ngIf=\"screenWidth < 475\">\r\n asfjklsajdfkl\r\n </div>\r\n </div>\r\n</nav>", styles: [".navbar-toggler{height:40px}@media only screen and (max-width : 475px){.left-logo-text{width:85%!important}.right-btn{width:15%!important}}\n"] }]
|
|
1668
|
+
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
1460
1669
|
type: Input
|
|
1670
|
+
}], index: [{
|
|
1671
|
+
type: Input
|
|
1672
|
+
}], getScreenSize: [{
|
|
1673
|
+
type: HostListener,
|
|
1674
|
+
args: ['window:resize', ['$event']]
|
|
1461
1675
|
}] } });
|
|
1462
1676
|
|
|
1463
1677
|
class BannerContentFitDirective {
|
|
@@ -1738,7 +1952,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1738
1952
|
|
|
1739
1953
|
class ButtonElementComponent {
|
|
1740
1954
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ButtonElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1741
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ButtonElementComponent, isStandalone: true, selector: "simpo-button-element", inputs: { buttonData: "buttonData" }, ngImport: i0, template: "<button mat-stroked-button color=\"primary btn-lg px-4 me-md-2\" *ngIf=\"buttonData?.disabled\">{{buttonData?.text}}</button>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type:
|
|
1955
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ButtonElementComponent, isStandalone: true, selector: "simpo-button-element", inputs: { buttonData: "buttonData" }, ngImport: i0, template: "<button mat-stroked-button color=\"primary btn-lg px-4 me-md-2\" *ngIf=\"buttonData?.disabled\">{{buttonData?.text}}</button>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
1742
1956
|
}
|
|
1743
1957
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ButtonElementComponent, decorators: [{
|
|
1744
1958
|
type: Component,
|
|
@@ -1752,11 +1966,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1752
1966
|
*/
|
|
1753
1967
|
// export * from './lib/simpo-ui.service';
|
|
1754
1968
|
// export * from './lib/simpo-ui.component';
|
|
1755
|
-
// export * from './lib/elements/index';
|
|
1756
|
-
// export * from './lib/styles/index';
|
|
1757
|
-
// export * from './lib/styles/style.model';
|
|
1758
|
-
// export * from './lib/styles/types';
|
|
1759
|
-
// export * from './lib/services/events.service';
|
|
1760
1969
|
|
|
1761
1970
|
/**
|
|
1762
1971
|
* Generated bundle index. Do not edit.
|