simpo-component-library 0.5.3 → 0.5.5
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 +2 -2
- package/esm2022/lib/sections/contact-us/contact-us.component.mjs +28 -9
- package/esm2022/lib/sections/skeleton-loader-section/skeleton-loader-section.component.mjs +17 -0
- package/esm2022/lib/sections/text-image-section/text-image-section.component.mjs +3 -3
- package/esm2022/lib/sections/text-section/text-section.component.mjs +3 -3
- package/esm2022/public-api.mjs +2 -1
- package/fesm2022/simpo-component-library.mjs +46 -15
- package/fesm2022/simpo-component-library.mjs.map +1 -1
- package/lib/directive/background-directive.d.ts +1 -1
- package/lib/directive/button-directive.directive.d.ts +1 -1
- package/lib/directive/color.directive.d.ts +1 -1
- package/lib/sections/contact-us/contact-us.component.d.ts +5 -2
- package/lib/sections/skeleton-loader-section/skeleton-loader-section.component.d.ts +6 -0
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
- package/simpo-component-library-0.5.5.tgz +0 -0
- package/simpo-component-library-0.5.3.tgz +0 -0
package/esm2022/public-api.mjs
CHANGED
|
@@ -18,6 +18,7 @@ export * from './lib/sections/video-section/video-section.component';
|
|
|
18
18
|
export * from './lib/sections/navbar-section/navbar-section.component';
|
|
19
19
|
export * from './lib/sections/add-new-section/add-new-section.component';
|
|
20
20
|
export * from './lib/sections/contact-us/contact-us.component';
|
|
21
|
+
export * from './lib/sections/skeleton-loader-section/skeleton-loader-section.component';
|
|
21
22
|
// service
|
|
22
23
|
export * from './lib/services/events.service';
|
|
23
24
|
//directives
|
|
@@ -43,4 +44,4 @@ export * from './lib/directive/image-position.directive';
|
|
|
43
44
|
export * from './lib/styles/index';
|
|
44
45
|
export * from './lib/styles/style.model';
|
|
45
46
|
export * from './lib/styles/types';
|
|
46
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
47
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL3NpbXBvLXVpL3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBOztHQUVHO0FBRUgsMENBQTBDO0FBQzFDLDRDQUE0QztBQUU1QyxjQUFjLG9EQUFvRCxDQUFDO0FBQ25FLGNBQWMsd0RBQXdELENBQUM7QUFDdkUsY0FBYyxrREFBa0QsQ0FBQztBQUNqRSxjQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLGNBQWMsd0VBQXdFLENBQUM7QUFDdkYsY0FBYyxnRUFBZ0UsQ0FBQztBQUMvRSxjQUFjLHNEQUFzRCxDQUFDO0FBQ3JFLGNBQWMsMERBQTBELENBQUM7QUFDekUsY0FBYyxrRUFBa0UsQ0FBQztBQUNqRixjQUFjLGtFQUFrRSxDQUFDO0FBQ2pGLGNBQWMsZ0VBQWdFLENBQUM7QUFDL0UsY0FBYyxzREFBc0QsQ0FBQztBQUNyRSxjQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLGNBQWMsMERBQTBELENBQUM7QUFDekUsY0FBYyxnREFBZ0QsQ0FBQTtBQUM5RCxjQUFjLDBFQUEwRSxDQUFDO0FBRXpGLFVBQVU7QUFDVixjQUFjLCtCQUErQixDQUFDO0FBRTlDLFlBQVk7QUFFWixjQUFjLHFDQUFxQyxDQUFDO0FBQ3BELGNBQWMsc0NBQXNDLENBQUM7QUFDckQsY0FBYyw4Q0FBOEMsQ0FBQztBQUM3RCxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMsNENBQTRDLENBQUM7QUFDM0QsY0FBYyw0Q0FBNEMsQ0FBQztBQUMzRCxjQUFjLHlDQUF5QyxDQUFDO0FBQ3hELGNBQWMsNkNBQTZDLENBQUM7QUFDNUQsY0FBYyx1Q0FBdUMsQ0FBQztBQUN0RCxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMscURBQXFELENBQUM7QUFDcEUsY0FBYyxxREFBcUQsQ0FBQztBQUNwRSxjQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGNBQWMsMkNBQTJDLENBQUM7QUFDMUQsY0FBYyx5Q0FBeUMsQ0FBQztBQUN4RCxjQUFjLHlDQUF5QyxDQUFDO0FBQ3hELGNBQWMsaUNBQWlDLENBQUE7QUFDL0MsY0FBYywwQ0FBMEMsQ0FBQztBQUV6RCxTQUFTO0FBRVQsY0FBYyxvQkFBb0IsQ0FBQztBQUNuQyxjQUFjLDBCQUEwQixDQUFDO0FBQ3pDLGNBQWMsb0JBQW9CLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKlxyXG4gKiBQdWJsaWMgQVBJIFN1cmZhY2Ugb2Ygc2ltcG8tdWlcclxuICovXHJcblxyXG4vLyBleHBvcnQgKiBmcm9tICcuL2xpYi9zaW1wby11aS5zZXJ2aWNlJztcclxuLy8gZXhwb3J0ICogZnJvbSAnLi9saWIvc2ltcG8tdWkuY29tcG9uZW50JztcclxuXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL3RleHQtc2VjdGlvbi90ZXh0LXNlY3Rpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VjdGlvbnMvYmFubmVyLXNlY3Rpb24vYmFubmVyLXNlY3Rpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VjdGlvbnMvZmFxLXNlY3Rpb24vZmFxLXNlY3Rpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VjdGlvbnMvZm9vdGVyLXNlY3Rpb24vZm9vdGVyLXNlY3Rpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VjdGlvbnMvaW1hZ2UtY2Fyb3VzZWwtc2VjdGlvbi9pbWFnZS1jYXJvdXNlbC1zZWN0aW9uLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL2ltYWdlLWdyaWQtc2VjdGlvbi9pbWFnZS1ncmlkLXNlY3Rpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VjdGlvbnMvaW1hZ2Utc2VjdGlvbi9pbWFnZS1zZWN0aW9uLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL3NlcnZpY2Utc2VjdGlvbi9zZXJ2aWNlLXNlY3Rpb24uY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc2VjdGlvbnMvdGVhbS1tZW1iZXItc2VjdGlvbi90ZWFtLW1lbWJlci1zZWN0aW9uLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL3Rlc3RpbW9uaWFsLXNlY3Rpb24vdGVzdGltb25pYWwtc2VjdGlvbi5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zZWN0aW9ucy90ZXh0LWltYWdlLXNlY3Rpb24vdGV4dC1pbWFnZS1zZWN0aW9uLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL3ZpZGVvLXNlY3Rpb24vdmlkZW8tc2VjdGlvbi5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zZWN0aW9ucy9uYXZiYXItc2VjdGlvbi9uYXZiYXItc2VjdGlvbi5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9zZWN0aW9ucy9hZGQtbmV3LXNlY3Rpb24vYWRkLW5ldy1zZWN0aW9uLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL2NvbnRhY3QtdXMvY29udGFjdC11cy5jb21wb25lbnQnXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlY3Rpb25zL3NrZWxldG9uLWxvYWRlci1zZWN0aW9uL3NrZWxldG9uLWxvYWRlci1zZWN0aW9uLmNvbXBvbmVudCc7XHJcblxyXG4vLyBzZXJ2aWNlXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3NlcnZpY2VzL2V2ZW50cy5zZXJ2aWNlJztcclxuXHJcbi8vZGlyZWN0aXZlc1xyXG5cclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2FuaW1hdGlvbi1kaXJlY3RpdmUnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kaXJlY3RpdmUvYmFja2dyb3VuZC1kaXJlY3RpdmUnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kaXJlY3RpdmUvYmFubmVyLWNvbnRlbnQtZml0LWRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZS9ib3JkZXItZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2J1dHRvbi1kaXJlY3RpdmUuZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2NvbHVtbi1kaXJlY3RpdmUuZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2NvbnRhaW5lci1maXIuZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2NvbnRlbnQtYWxpZ25tZW50LWRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZS9jb250ZW50LWZpdC1kaXJlY3RpdmUnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9kaXJlY3RpdmUvY29ybmVyLWRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZS90ZXh0LWJhY2tncm91bmQtZGlyZWN0aXZlLmRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZS9wb3NpdGlvbi1sYXlvdXQtZGlyZWN0aXZlLmRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZS9vdmVybGF5LWRpcmVjdGl2ZSc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZS9pbWFnZS1kaXJlY3RpdmUuZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2hvdmVyLWVsZW1lbnQtZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2Zvb3Rlci1sYXlvdXQtZGlyZWN0aXZlJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2NvbG9yLmRpcmVjdGl2ZSdcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvZGlyZWN0aXZlL2ltYWdlLXBvc2l0aW9uLmRpcmVjdGl2ZSc7XHJcblxyXG4vLyBzdHlsZXNcclxuXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3N0eWxlcy9pbmRleCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3N0eWxlcy9zdHlsZS5tb2RlbCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3N0eWxlcy90eXBlcyc7XHJcbiJdfQ==
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i2 from '@angular/common';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { CommonModule, isPlatformBrowser } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { Component, Input, EventEmitter, Injectable, Directive, HostListener, NgModule, Output, ViewChild } from '@angular/core';
|
|
4
|
+
import { Component, Input, EventEmitter, Injectable, Directive, HostListener, NgModule, Output, ViewChild, PLATFORM_ID, Inject } from '@angular/core';
|
|
5
5
|
import { MatGridListModule } from '@angular/material/grid-list';
|
|
6
6
|
import * as i2$1 from '@angular/material/button';
|
|
7
7
|
import { MatButtonModule } from '@angular/material/button';
|
|
@@ -11,6 +11,8 @@ import { MatDialogModule } from '@angular/material/dialog';
|
|
|
11
11
|
import * as i2$3 from '@angular/forms';
|
|
12
12
|
import { FormsModule } from '@angular/forms';
|
|
13
13
|
import * as i1 from '@angular/platform-browser';
|
|
14
|
+
import * as i2$4 from 'ngx-skeleton-loader';
|
|
15
|
+
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
|
|
14
16
|
|
|
15
17
|
class ButtonElementComponent {
|
|
16
18
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ButtonElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
@@ -780,7 +782,7 @@ class HoverElementsComponent {
|
|
|
780
782
|
this._eventService.restyleSection.emit({ index: this.index });
|
|
781
783
|
}
|
|
782
784
|
changeContent() {
|
|
783
|
-
this._eventService.changeContent.emit({ sectionId: this.data.componentId, index: this.index });
|
|
785
|
+
this._eventService.changeContent.emit({ sectionId: this.data.componentId, index: this.index, sectionType: this.data.sectionType });
|
|
784
786
|
}
|
|
785
787
|
moveUp() {
|
|
786
788
|
this._eventService.changePosition.emit({ index: this.index, position: "UP" });
|
|
@@ -1567,7 +1569,7 @@ class TextSectionComponent extends BaseSection {
|
|
|
1567
1569
|
this.deleteSelected = this.delete;
|
|
1568
1570
|
}
|
|
1569
1571
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TextSectionComponent, deps: [{ token: i2$2.MatDialog }, { token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1570
|
-
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", edit: "edit", delete: "delete" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], usesInheritance: 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-
|
|
1572
|
+
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", edit: "edit", delete: "delete" }, viewQueries: [{ propertyName: "_mainContainer", first: true, predicate: ["mainContainer"], descendants: true }], usesInheritance: 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-flex 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\" [buttonId]=\"button.id\" [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 [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n</div>\r\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 15px}.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:auto}.mt-15{margin-top:15px}@media only screen and (max-width: 475px){.d-flex{justify-content:center}}\n"], dependencies: [{ 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: MatGridListModule }, { 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", "buttonId", "color", "sectionId"] }, { kind: "ngmodule", type: SimpoComponentModule }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type:
|
|
1571
1573
|
//directive
|
|
1572
1574
|
AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }] }); }
|
|
1573
1575
|
}
|
|
@@ -1597,7 +1599,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
1597
1599
|
OverlayDirective,
|
|
1598
1600
|
PositionLayoutDirectiveDirective,
|
|
1599
1601
|
TextBackgroundDirectiveDirective
|
|
1600
|
-
], 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-
|
|
1602
|
+
], 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-flex 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\" [buttonId]=\"button.id\" [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 [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n</div>\r\n", styles: [".total_container{height:auto;position:relative}.body-section{padding:4% 15px}.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:auto}.mt-15{margin-top:15px}@media only screen and (max-width: 475px){.d-flex{justify-content:center}}\n"] }]
|
|
1601
1603
|
}], ctorParameters: () => [{ type: i2$2.MatDialog }, { type: EventsService }], propDecorators: { data: [{
|
|
1602
1604
|
type: Input
|
|
1603
1605
|
}], index: [{
|
|
@@ -2169,7 +2171,7 @@ class TextImageSectionComponent extends BaseSection {
|
|
|
2169
2171
|
return;
|
|
2170
2172
|
}
|
|
2171
2173
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: TextImageSectionComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2172
|
-
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", edit: "edit", delete: "delete" }, usesInheritance: true, 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\" [simpoObjectPosition]=\"content?.image?.position\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid h-100\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"100\" 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\" [buttonId]=\"button.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 *ngIf=\"showEditors\" [ngClass]=\"{'hover_effect': edit}\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\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:auto}.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", "buttonId", "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", "editOptions"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "ngmodule", type: MatGridListModule }, { kind: "directive", type:
|
|
2174
|
+
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", edit: "edit", delete: "delete" }, usesInheritance: true, 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\" [simpoObjectPosition]=\"content?.image?.position\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid h-100\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"100\" 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\" [buttonId]=\"button.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 *ngIf=\"showEditors\" [ngClass]=\"{'hover_effect': edit}\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\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:auto}.button-display{display:flex;gap:10px;margin-top:15px}@media only screen and (max-width: 475px){.col-10{width:100%!important}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "buttonId", "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", "editOptions"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "ngmodule", type: MatGridListModule }, { kind: "directive", type:
|
|
2173
2175
|
//directive
|
|
2174
2176
|
AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: simpoConetenAlignmentDirective, selector: "[simpoContentAlignment]", inputs: ["simpoContentAlignment"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: CornerDirective, selector: "[simpoCorner]", inputs: ["simpoCorner"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: ImageDirectiveDirective, selector: "[simpoImageDirective]", inputs: ["simpoImageDirective"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: PositionLayoutDirectiveDirective, selector: "[simpoPositionLayoutDirective]", inputs: ["simpoPositionLayoutDirective"] }, { kind: "directive", type: ObjectPositionDirective, selector: "[simpoObjectPosition]", inputs: ["simpoObjectPosition"] }] }); }
|
|
2175
2177
|
}
|
|
@@ -2199,7 +2201,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
2199
2201
|
PositionLayoutDirectiveDirective,
|
|
2200
2202
|
TextBackgroundDirectiveDirective,
|
|
2201
2203
|
ObjectPositionDirective
|
|
2202
|
-
], 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\" [simpoObjectPosition]=\"content?.image?.position\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid h-100\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"100\" 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\" [buttonId]=\"button.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 *ngIf=\"showEditors\" [ngClass]=\"{'hover_effect': edit}\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\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:auto}.button-display{display:flex;gap:10px;margin-top:15px}\n"] }]
|
|
2204
|
+
], 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\" [simpoObjectPosition]=\"content?.image?.position\"\r\n [simpoImageDirective]=\"styles?.image\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\"\r\n [simpoCorner]=\"styles?.corners\"\r\n class=\"d-block mx-lg-auto img-fluid h-100\" [alt]=\"content?.image?.altText\" width=\"700\" height=\"100\" 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\" [buttonId]=\"button.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 *ngIf=\"showEditors\" [ngClass]=\"{'hover_effect': edit}\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\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:auto}.button-display{display:flex;gap:10px;margin-top:15px}@media only screen and (max-width: 475px){.col-10{width:100%!important}}\n"] }]
|
|
2203
2205
|
}], ctorParameters: () => [{ type: EventsService }], propDecorators: { data: [{
|
|
2204
2206
|
type: Input
|
|
2205
2207
|
}], index: [{
|
|
@@ -2381,9 +2383,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
2381
2383
|
}] } });
|
|
2382
2384
|
|
|
2383
2385
|
class ContactUsComponent extends BaseSection {
|
|
2384
|
-
constructor(_eventService) {
|
|
2386
|
+
constructor(_eventService, platformId) {
|
|
2385
2387
|
super();
|
|
2386
2388
|
this._eventService = _eventService;
|
|
2389
|
+
this.platformId = platformId;
|
|
2387
2390
|
this.buttonId = '';
|
|
2388
2391
|
}
|
|
2389
2392
|
ngOnInit() {
|
|
@@ -2394,18 +2397,29 @@ class ContactUsComponent extends BaseSection {
|
|
|
2394
2397
|
this.buttonId = (this.data ? this.data.id : '') + (this.button ? this.button.id : '');
|
|
2395
2398
|
if (!this.styles || !this.content)
|
|
2396
2399
|
return;
|
|
2400
|
+
if (isPlatformBrowser(this.platformId)) {
|
|
2401
|
+
this.screenSize();
|
|
2402
|
+
window.addEventListener('resize', () => {
|
|
2403
|
+
this.screenSize();
|
|
2404
|
+
});
|
|
2405
|
+
}
|
|
2406
|
+
}
|
|
2407
|
+
screenSize() {
|
|
2408
|
+
this.screenWidth = window.innerWidth;
|
|
2397
2409
|
}
|
|
2398
2410
|
getWidthByField(field) {
|
|
2411
|
+
let width = this.screenWidth > 475 ? '48' : '100';
|
|
2412
|
+
let contactWidth = this.screenWidth > 475 ? '97' : '100';
|
|
2399
2413
|
if (field.type == "address") {
|
|
2400
|
-
return ((this.content?.contactField.fields.filter((add) => add.type == "address").length ?? 1) % 2) ?
|
|
2414
|
+
return ((this.content?.contactField.fields.filter((add) => add.type == "address").length ?? 1) % 2) ? contactWidth : width;
|
|
2401
2415
|
}
|
|
2402
|
-
return field.type == "desc" ?
|
|
2416
|
+
return field.type == "desc" ? contactWidth : width;
|
|
2403
2417
|
}
|
|
2404
2418
|
buttonClick() {
|
|
2405
2419
|
this._eventService.contactFormData.emit({ data: this.content?.contactField.fields });
|
|
2406
2420
|
}
|
|
2407
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ContactUsComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2408
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ContactUsComponent, isStandalone: true, selector: "simpo-contact-us", inputs: { data: "data", index: "index", edit: "edit", delete: "delete" }, usesInheritance: true, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\r\n class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\"\r\n [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"col-12 d-flex justify-content-evenly\" style=\"gap: 3rem;\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\">\r\n <div class=\"col-5 d-flex flex-wrap\" style=\"gap: 1rem;\">\r\n <ng-container *ngFor=\"let feild of content?.contactField?.fields\">\r\n <simpo-input-fields [opacity]=\"styles?.inputOpacity\" [style.width.%]=\"getWidthByField(feild)\" [feild]=\"feild\"></simpo-input-fields>\r\n </ng-container>\r\n <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"styles?.background?.accentColor\" (click)=\"buttonClick()\">{{ content?.contactField?.button }}</button
|
|
2421
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: ContactUsComponent, deps: [{ token: EventsService }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2422
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: ContactUsComponent, isStandalone: true, selector: "simpo-contact-us", inputs: { data: "data", index: "index", edit: "edit", delete: "delete" }, host: { listeners: { "window:resize": "screenSize($event)" } }, usesInheritance: true, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\r\n class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\"\r\n [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"col-12 d-flex justify-content-evenly\" style=\"gap: 3rem;\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\">\r\n <div class=\"col-5 d-flex flex-wrap\" style=\"gap: 1rem;\">\r\n <ng-container *ngFor=\"let feild of content?.contactField?.fields\">\r\n <simpo-input-fields [opacity]=\"styles?.inputOpacity\" [style.width.%]=\"getWidthByField(feild)\" [feild]=\"feild\"></simpo-input-fields>\r\n </ng-container>\r\n <!-- <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"styles?.background?.accentColor\" (click)=\"buttonClick()\">{{ content?.contactField?.button }}</button> -->\r\n </div>\r\n\r\n <div class=\"d-flex flex-column col-5 pt-5\">\r\n <div *ngFor=\"let item of content?.inputText\" [innerHTML]=\"item.value\"\r\n [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\" ></div>\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"styles?.background?.accentColor\" (click)=\"buttonClick()\">{{ content?.contactField?.button }}</button>\r\n </div>\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n</div>\r\n", styles: [".send-btn{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important;margin-top:1rem;margin-left:5%}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:auto}@media only screen and (max-width: 475px){.col-12{display:flex;flex-direction:column-reverse}.pt-5{width:100%}.pt-5 div{font-size:24px}.col-5{width:100%}.send-btn{margin-left:0}}\n"], dependencies: [{ kind: "ngmodule", type: SimpoElementsModule }, { 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", "editOptions"], outputs: ["edit"] }, { kind: "component", type: DeleteHoverElementComponent, selector: "simpo-delete-hover-element", inputs: ["index", "data"], outputs: ["edit"] }, { kind: "component", type: InputFieldsComponent, selector: "simpo-input-fields", inputs: ["feild", "opacity"] }, { kind: "ngmodule", type: MatGridListModule }, { kind: "directive", type:
|
|
2409
2423
|
//directive
|
|
2410
2424
|
AnimationDirective, selector: "[simpoAnimation]", inputs: ["simpoAnimation"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: BorderDirective, selector: "[simpoBorder]", inputs: ["simpoBorder"] }, { kind: "directive", type: ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color"] }, { kind: "directive", type: ContentFitDirective, selector: "[simpoLayout]", inputs: ["simpoLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: PositionLayoutDirectiveDirective, selector: "[simpoPositionLayoutDirective]", inputs: ["simpoPositionLayoutDirective"] }] }); }
|
|
2411
2425
|
}
|
|
@@ -2436,8 +2450,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
2436
2450
|
TextBackgroundDirectiveDirective,
|
|
2437
2451
|
ObjectPositionDirective,
|
|
2438
2452
|
ButtonDirectiveDirective
|
|
2439
|
-
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\r\n class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\"\r\n [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"col-12 d-flex justify-content-evenly\" style=\"gap: 3rem;\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\">\r\n <div class=\"col-5 d-flex flex-wrap\" style=\"gap: 1rem;\">\r\n <ng-container *ngFor=\"let feild of content?.contactField?.fields\">\r\n <simpo-input-fields [opacity]=\"styles?.inputOpacity\" [style.width.%]=\"getWidthByField(feild)\" [feild]=\"feild\"></simpo-input-fields>\r\n </ng-container>\r\n <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"styles?.background?.accentColor\" (click)=\"buttonClick()\">{{ content?.contactField?.button }}</button
|
|
2440
|
-
}], ctorParameters: () => [{ type: EventsService }
|
|
2453
|
+
], template: "<div [id]=\"data?.id\" [simpoBackground]=\"styles?.background\" simpoHover (hovering)=\"showEditTabs($event)\"\r\n class=\"total-container\">\r\n <div class=\"col-xxl-8 px-4 py-5 w-100\" [id]=\"data?.id\" #mainContainer [simpoOverlay]=\"styles?.background\"\r\n [simpoBorder]=\"styles?.border\">\r\n <div class=\"row g-5\" [id]=\"data?.id\" [simpoAnimation]=\"styles?.animation\" [simpoLayout]=\"styles?.layout\">\r\n <div class=\"col-12 d-flex justify-content-evenly\" style=\"gap: 3rem;\" [id]=\"data?.id\" [simpoPositionLayoutDirective]=\"styles?.positionLayout\">\r\n <div class=\"col-5 d-flex flex-wrap\" style=\"gap: 1rem;\">\r\n <ng-container *ngFor=\"let feild of content?.contactField?.fields\">\r\n <simpo-input-fields [opacity]=\"styles?.inputOpacity\" [style.width.%]=\"getWidthByField(feild)\" [feild]=\"feild\"></simpo-input-fields>\r\n </ng-container>\r\n <!-- <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"styles?.background?.accentColor\" (click)=\"buttonClick()\">{{ content?.contactField?.button }}</button> -->\r\n </div>\r\n\r\n <div class=\"d-flex flex-column col-5 pt-5\">\r\n <div *ngFor=\"let item of content?.inputText\" [innerHTML]=\"item.value\"\r\n [ngClass]=\"item.label === 'Heading' ? 'heading-large lh-2 mb-3' : 'body-large'\" ></div>\r\n </div>\r\n </div>\r\n </div>\r\n <button class=\"send-btn\" simpoButtonDirective [id]=\"buttonId\" [buttonStyle]=\"button?.styles\" [color]=\"styles?.background?.accentColor\" (click)=\"buttonClick()\">{{ content?.contactField?.button }}</button>\r\n </div>\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [index]=\"index\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n </div>\r\n <div *ngIf=\"showDelete\" [ngClass]=\"{'hover_effect': delete}\">\r\n <simpo-delete-hover-element [data]=\"data\" [index]=\"index\"></simpo-delete-hover-element>\r\n </div>\r\n</div>\r\n", styles: [".send-btn{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important;margin-top:1rem;margin-left:5%}.hover_effect{position:absolute;width:100%;top:0;left:0;height:100%}.total-container{position:relative;height:auto}@media only screen and (max-width: 475px){.col-12{display:flex;flex-direction:column-reverse}.pt-5{width:100%}.pt-5 div{font-size:24px}.col-5{width:100%}.send-btn{margin-left:0}}\n"] }]
|
|
2454
|
+
}], ctorParameters: () => [{ type: EventsService }, { type: Object, decorators: [{
|
|
2455
|
+
type: Inject,
|
|
2456
|
+
args: [PLATFORM_ID]
|
|
2457
|
+
}] }], propDecorators: { data: [{
|
|
2441
2458
|
type: Input
|
|
2442
2459
|
}], index: [{
|
|
2443
2460
|
type: Input
|
|
@@ -2445,6 +2462,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
2445
2462
|
type: Input
|
|
2446
2463
|
}], delete: [{
|
|
2447
2464
|
type: Input
|
|
2465
|
+
}], screenSize: [{
|
|
2466
|
+
type: HostListener,
|
|
2467
|
+
args: ['window:resize', ['$event']]
|
|
2468
|
+
}] } });
|
|
2469
|
+
|
|
2470
|
+
class SkeletonLoaderSectionComponent {
|
|
2471
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SkeletonLoaderSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2472
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: SkeletonLoaderSectionComponent, isStandalone: true, selector: "simpo-skeleton-loader-section", inputs: { sectionType: "sectionType" }, ngImport: i0, template: "<div class=\"p-15\" style=\"width: 100%;\">\r\n <div class=\"skeleton-parent\" *ngIf=\"sectionType === 'service' || sectionType === 'teammember' || sectionType === 'imagegrid'\">\r\n <div class=\"skeleton\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '70px',\r\n height: '70px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <div class=\"second-section-wrapper\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"skeleton\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '70px',\r\n height: '70px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <div class=\"second-section-wrapper\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"skeleton\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '70px',\r\n height: '70px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <div class=\"second-section-wrapper\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"banner-skeleton\" *ngIf=\"sectionType === 'banner' || sectionType === 'text_image'\">\r\n <div style=\"width: 50%;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '90%',\r\n height: '350px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n <div class=\"second-section-wrapper\" style=\"width: 50%;padding-top: 50px;\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div style=\"margin-top: 50px;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '130px',\r\n height: '45px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-skeleton\" *ngIf=\"sectionType === 'text'\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div style=\"margin-top: 50px;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '130px',\r\n height: '45px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"testimonial-skeleton\" *ngIf=\"sectionType === 'testimonial'\">\r\n <div>\r\n <ngx-skeleton-loader appearance=\"circle\" [theme]=\"{ width: '80px', height: '80px' }\">\r\n </ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\" style=\"margin-top: 20px;\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div style=\"margin-top: 50px;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '130px',\r\n height: '45px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"image-skeleton\" *ngIf=\"sectionType === 'imageCarousel' || sectionType === 'image' || sectionType === 'contact us'\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{\r\n 'border-radius': '5px',\r\n height: '50vh',\r\n width: '100%'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n</div>\r\n", styles: [".main-section{position:relative;left:25px}.p-15{padding:15px}.wrapper{width:100%;flex:1}.second-section-wrapper{width:100%;height:auto;flex:1}.skeleton-parent{display:flex;gap:15px}.skeleton{padding:10px;border:1px solid #e5e7eb;width:33.33%;border-radius:10px}.banner-skeleton{display:flex;gap:10px}.text-skeleton,.testimonial-skeleton{text-align:center}.image-skeleton{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: NgxSkeletonLoaderModule }, { kind: "component", type: i2$4.NgxSkeletonLoaderComponent, selector: "ngx-skeleton-loader", inputs: ["count", "loadingText", "appearance", "animation", "ariaLabel", "theme"] }] }); }
|
|
2473
|
+
}
|
|
2474
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: SkeletonLoaderSectionComponent, decorators: [{
|
|
2475
|
+
type: Component,
|
|
2476
|
+
args: [{ selector: 'simpo-skeleton-loader-section', standalone: true, imports: [CommonModule, NgxSkeletonLoaderModule], template: "<div class=\"p-15\" style=\"width: 100%;\">\r\n <div class=\"skeleton-parent\" *ngIf=\"sectionType === 'service' || sectionType === 'teammember' || sectionType === 'imagegrid'\">\r\n <div class=\"skeleton\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '70px',\r\n height: '70px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <div class=\"second-section-wrapper\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"skeleton\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '70px',\r\n height: '70px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <div class=\"second-section-wrapper\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"skeleton\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '70px',\r\n height: '70px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n <div class=\"second-section-wrapper\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"banner-skeleton\" *ngIf=\"sectionType === 'banner' || sectionType === 'text_image'\">\r\n <div style=\"width: 50%;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '90%',\r\n height: '350px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n <div class=\"second-section-wrapper\" style=\"width: 50%;padding-top: 50px;\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div style=\"margin-top: 50px;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '130px',\r\n height: '45px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-skeleton\" *ngIf=\"sectionType === 'text'\">\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div style=\"margin-top: 50px;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '130px',\r\n height: '45px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"testimonial-skeleton\" *ngIf=\"sectionType === 'testimonial'\">\r\n <div>\r\n <ngx-skeleton-loader appearance=\"circle\" [theme]=\"{ width: '80px', height: '80px' }\">\r\n </ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\" style=\"margin-top: 20px;\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '80%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '90%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div class=\"wrapper\">\r\n <ngx-skeleton-loader\r\n [theme]=\"{\r\n width: '60%',\r\n 'border-radius': '0',\r\n height: '15px',\r\n 'margin-bottom': '10px'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n <div style=\"margin-top: 50px;\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n appearance=\"circle\"\r\n [theme]=\"{\r\n width: '130px',\r\n height: '45px',\r\n 'border-radius': '10px'\r\n }\"\r\n >\r\n </ngx-skeleton-loader>\r\n </div>\r\n </div>\r\n\r\n <div class=\"image-skeleton\" *ngIf=\"sectionType === 'imageCarousel' || sectionType === 'image' || sectionType === 'contact us'\">\r\n <ngx-skeleton-loader\r\n count=\"1\"\r\n [theme]=\"{\r\n 'border-radius': '5px',\r\n height: '50vh',\r\n width: '100%'\r\n }\"\r\n ></ngx-skeleton-loader>\r\n </div>\r\n</div>\r\n", styles: [".main-section{position:relative;left:25px}.p-15{padding:15px}.wrapper{width:100%;flex:1}.second-section-wrapper{width:100%;height:auto;flex:1}.skeleton-parent{display:flex;gap:15px}.skeleton{padding:10px;border:1px solid #e5e7eb;width:33.33%;border-radius:10px}.banner-skeleton{display:flex;gap:10px}.text-skeleton,.testimonial-skeleton{text-align:center}.image-skeleton{width:100%}\n"] }]
|
|
2477
|
+
}], propDecorators: { sectionType: [{
|
|
2478
|
+
type: Input
|
|
2448
2479
|
}] } });
|
|
2449
2480
|
|
|
2450
2481
|
/*
|
|
@@ -2457,5 +2488,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
2457
2488
|
* Generated bundle index. Do not edit.
|
|
2458
2489
|
*/
|
|
2459
2490
|
|
|
2460
|
-
export { AddNewSectionComponent, AlignContent, AnimationDirective, BANNERALIGNMENT, BANNERHALIGN, BackgroundDirective, BannerContentFitDirective, BannerSectionComponent, BorderDirective, ButtonDirectiveDirective, ChannelType, ColorDirective, ColumnDirectiveDirective, ContactUsComponent, ContainerFitDirective, ContentFitDirective, CornerDirective, Corners, EventsService, FaqSectionComponent, FooterSectionComponent, FooterTypes, HALIGN, HeaderButtonStyle, HoverDirective, ImageCarouselSectionComponent, ImageDirectiveDirective, ImageFit, ImageGridSectionComponent, ImageRatio, ImageSectionComponent, NavbarSectionComponent, ObjectPositionDirective, OverlayDirective, Padding, PositionLayoutDirectiveDirective, RedirectionLinkType, SPACING, ServiceSectionComponent, SimpoFooterLayoutDirective, Style, TeamMemberSectionComponent, TestimonialSectionComponent, TextBackgroundDirectiveDirective, TextImageSectionComponent, TextPosition, TextSectionComponent, VALIGN, VideoSectionComponent, animation, applySpacing, applyStyle, contentAlignment, fitContent, fitScreen, simpoConetenAlignmentDirective };
|
|
2491
|
+
export { AddNewSectionComponent, AlignContent, AnimationDirective, BANNERALIGNMENT, BANNERHALIGN, BackgroundDirective, BannerContentFitDirective, BannerSectionComponent, BorderDirective, ButtonDirectiveDirective, ChannelType, ColorDirective, ColumnDirectiveDirective, ContactUsComponent, ContainerFitDirective, ContentFitDirective, CornerDirective, Corners, EventsService, FaqSectionComponent, FooterSectionComponent, FooterTypes, HALIGN, HeaderButtonStyle, HoverDirective, ImageCarouselSectionComponent, ImageDirectiveDirective, ImageFit, ImageGridSectionComponent, ImageRatio, ImageSectionComponent, NavbarSectionComponent, ObjectPositionDirective, OverlayDirective, Padding, PositionLayoutDirectiveDirective, RedirectionLinkType, SPACING, ServiceSectionComponent, SimpoFooterLayoutDirective, SkeletonLoaderSectionComponent, Style, TeamMemberSectionComponent, TestimonialSectionComponent, TextBackgroundDirectiveDirective, TextImageSectionComponent, TextPosition, TextSectionComponent, VALIGN, VideoSectionComponent, animation, applySpacing, applyStyle, contentAlignment, fitContent, fitScreen, simpoConetenAlignmentDirective };
|
|
2461
2492
|
//# sourceMappingURL=simpo-component-library.mjs.map
|