simpo-component-library 0.8.8 → 0.8.9
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 +3 -3
- package/esm2022/lib/directive/sticky-directive.mjs +2 -2
- package/esm2022/lib/elements/navbar-button-element/navbar-button-element.component.mjs +3 -3
- package/fesm2022/simpo-component-library.mjs +5 -5
- package/fesm2022/simpo-component-library.mjs.map +1 -1
- package/package.json +1 -1
- package/simpo-component-library-0.8.9.tgz +0 -0
- package/simpo-component-library-0.8.8.tgz +0 -0
|
@@ -935,11 +935,11 @@ class HoverElementsComponent {
|
|
|
935
935
|
this._eventService.duplicate.emit({ index: this.index, data: this.data });
|
|
936
936
|
}
|
|
937
937
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HoverElementsComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
938
|
-
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", editOptions: "editOptions" }, outputs: { edit: "edit" }, ngImport: i0, template: "<mat-dialog-content class=\"mat-typography\" *ngIf=\"editOptions\">\r\n <div class=\"top-btn\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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' && data.sectionType != 'header'\">\r\n <button (click)=\"restyleSection()\">\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 Restyle\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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' && data.sectionType != 'header'\">\r\n <button class=\"copy\" (click)=\"duplicateSection()\">\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()\" [disabled]=\"index == 1\">\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' && data.sectionType != 'header'\">\r\n <button class=\"add_btn\" (click)=\"addSection('BELOW')\">Add Section +</button>\r\n </div>\r\n</mat-dialog-content>\r\n", 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}.top-btn{position:absolute;top:0%;z-index:1001;width:100%;border-bottom:4px solid #0267c1}.top-btn .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}.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;z-index:1000}.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}@media only screen and (max-width: 475px){.tabs-section{position:relative;left:27px;height:53px}}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
938
|
+
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", editOptions: "editOptions" }, outputs: { edit: "edit" }, ngImport: i0, template: "<mat-dialog-content class=\"mat-typography\" *ngIf=\"editOptions\">\r\n <div class=\"top-btn\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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\" [ngStyle]=\"{'z-index' : data.sectionType === 'header' ? '10000' : '1000'}\">\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' && data.sectionType != 'header'\">\r\n <button (click)=\"restyleSection()\">\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 Restyle\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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' && data.sectionType != 'header'\">\r\n <button class=\"copy\" (click)=\"duplicateSection()\">\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()\" [disabled]=\"index == 1\">\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' && data.sectionType != 'header'\">\r\n <button class=\"add_btn\" (click)=\"addSection('BELOW')\">Add Section +</button>\r\n </div>\r\n</mat-dialog-content>\r\n", 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}.top-btn{position:absolute;top:0%;z-index:1001;width:100%;border-bottom:4px solid #0267c1}.top-btn .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}.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;z-index:1000}.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}@media only screen and (max-width: 475px){.tabs-section{position:relative;left:27px;height:53px}}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: MatDialogModule }, { kind: "directive", type: i2$2.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
939
939
|
}
|
|
940
940
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: HoverElementsComponent, decorators: [{
|
|
941
941
|
type: Component,
|
|
942
|
-
args: [{ selector: 'simpo-hover-elements', standalone: true, imports: [MatIconModule, MatDialogModule, CommonModule], template: "<mat-dialog-content class=\"mat-typography\" *ngIf=\"editOptions\">\r\n <div class=\"top-btn\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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' && data.sectionType != 'header'\">\r\n <button (click)=\"restyleSection()\">\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 Restyle\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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' && data.sectionType != 'header'\">\r\n <button class=\"copy\" (click)=\"duplicateSection()\">\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()\" [disabled]=\"index == 1\">\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' && data.sectionType != 'header'\">\r\n <button class=\"add_btn\" (click)=\"addSection('BELOW')\">Add Section +</button>\r\n </div>\r\n</mat-dialog-content>\r\n", 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}.top-btn{position:absolute;top:0%;z-index:1001;width:100%;border-bottom:4px solid #0267c1}.top-btn .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}.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;z-index:1000}.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}@media only screen and (max-width: 475px){.tabs-section{position:relative;left:27px;height:53px}}\n"] }]
|
|
942
|
+
args: [{ selector: 'simpo-hover-elements', standalone: true, imports: [MatIconModule, MatDialogModule, CommonModule], template: "<mat-dialog-content class=\"mat-typography\" *ngIf=\"editOptions\">\r\n <div class=\"top-btn\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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\" [ngStyle]=\"{'z-index' : data.sectionType === 'header' ? '10000' : '1000'}\">\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' && data.sectionType != 'header'\">\r\n <button (click)=\"restyleSection()\">\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 Restyle\r\n </span>\r\n </button>\r\n </div>\r\n <div class=\"vr-line\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\"></div>\r\n <div class=\"regenerate\" *ngIf=\"data.sectionType != 'footer' && data.sectionType != 'header'\">\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' && data.sectionType != 'header'\">\r\n <button class=\"copy\" (click)=\"duplicateSection()\">\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()\" [disabled]=\"index == 1\">\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' && data.sectionType != 'header'\">\r\n <button class=\"add_btn\" (click)=\"addSection('BELOW')\">Add Section +</button>\r\n </div>\r\n</mat-dialog-content>\r\n", 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}.top-btn{position:absolute;top:0%;z-index:1001;width:100%;border-bottom:4px solid #0267c1}.top-btn .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}.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;z-index:1000}.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}@media only screen and (max-width: 475px){.tabs-section{position:relative;left:27px;height:53px}}\n"] }]
|
|
943
943
|
}], ctorParameters: () => [{ type: EventsService }], propDecorators: { edit: [{
|
|
944
944
|
type: Output
|
|
945
945
|
}], data: [{
|
|
@@ -2581,11 +2581,11 @@ class NavbarButtonElementComponent {
|
|
|
2581
2581
|
this._eventService.pageRedirectionButton.emit({ data: this.buttonData });
|
|
2582
2582
|
}
|
|
2583
2583
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: NavbarButtonElementComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2584
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: NavbarButtonElementComponent, isStandalone: true, selector: "simpo-navbar-button-element", inputs: { buttonData: "buttonData", buttonStyle: "buttonStyle", selectedStyle: "selectedStyle", bgColor: "bgColor", sectionId: "sectionId" }, ngImport: i0, template: "<div *ngIf=\"buttonData?.status\">\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.TAB\">\r\n <div *ngIf=\"!buttonData?.folder\">\r\n <button mat-stroked-button style=\"border: none; white-space: nowrap;\" [id]=\"sectionId\" [simpoColor]=\"bgColor\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" class=\"navbar-button\">{{buttonData?.label}}</button>\r\n <div [ngStyle]=\"{'border-bottom':'1px solid'+buttonStyle?.color}\" (click)=\"changePage()\" [id]=\"sectionId\"></div>\r\n </div>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"navbar-button dropdown-toggle\" [simpoColor]=\"bgColor\" style=\"border: none; white-space: nowrap;\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" type=\"button\"\r\n id=\"
|
|
2584
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: NavbarButtonElementComponent, isStandalone: true, selector: "simpo-navbar-button-element", inputs: { buttonData: "buttonData", buttonStyle: "buttonStyle", selectedStyle: "selectedStyle", bgColor: "bgColor", sectionId: "sectionId" }, ngImport: i0, template: "<div *ngIf=\"buttonData?.status\">\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.TAB\">\r\n <div *ngIf=\"!buttonData?.folder\">\r\n <button mat-stroked-button style=\"border: none; white-space: nowrap;\" [id]=\"sectionId\" [simpoColor]=\"bgColor\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" class=\"navbar-button\">{{buttonData?.label}}</button>\r\n <div [ngStyle]=\"{'border-bottom':'1px solid'+buttonStyle?.color}\" (click)=\"changePage()\" [id]=\"sectionId\"></div>\r\n </div>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"navbar-button dropdown-toggle\" [simpoColor]=\"bgColor\" style=\"border: none; white-space: nowrap;\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div [ngStyle]=\"{'border-bottom':'1px solid'+buttonStyle?.color}\" [id]=\"sectionId\"></div>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.ROUND_SUBTLE\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.ROUND_BOLD\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.SQUARE_SUBTLE\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;border-radius: 0px !important;width: max-content!important;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;border-radius: 0px !important;width: max-content!important;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.SQUARE_BOLD\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 0px !important;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 0px !important;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <button mat-stroked-button color=\"primary btn-lg px-4 me-md-2\">{{buttonData?.content?.label}}</button> -->\r\n\r\n</div>\r\n<div *ngIf=\"!buttonData?.status\">\r\n <button mat-stroked-button style=\"border: none;width: max-content!important;\" *ngIf=\"!buttonData?.folder\"\r\n (click)=\"changePage()\" [id]=\"sectionId\" [simpoColor]=\"bgColor\"\r\n class=\"status-navbar-button\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button class=\"status-navbar-button not-selected-dropdown dropdown-toggle\"\r\n style=\"border: none;width: max-content!important;\" [simpoColor]=\"bgColor\" type=\"button\" id=\"headerDropdownButton\"\r\n data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".navbar-button,.status-navbar-button{font-size:18px!important}@media only screen and (max-width : 475px){.navbar-button{width:100%!important;display:flex;justify-content:flex-start}.status-navbar-button{color:#fff!important;display:flex;justify-content:flex-start}}.not-selected-dropdown{background:transparent}.dropdown-item{font-size:18px;padding:10px;font-family:Roboto,sans-serif;border-bottom:1px solid #dee2e6}.dropdown-menu{top:40px;border:none;border-radius:10px}\n"], dependencies: [{ 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: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: ColorDirective, selector: "[simpoColor]", inputs: ["simpoColor"] }] }); }
|
|
2585
2585
|
}
|
|
2586
2586
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: NavbarButtonElementComponent, decorators: [{
|
|
2587
2587
|
type: Component,
|
|
2588
|
-
args: [{ selector: 'simpo-navbar-button-element', standalone: true, imports: [CommonModule, MatButtonModule, ColorDirective], template: "<div *ngIf=\"buttonData?.status\">\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.TAB\">\r\n <div *ngIf=\"!buttonData?.folder\">\r\n <button mat-stroked-button style=\"border: none; white-space: nowrap;\" [id]=\"sectionId\" [simpoColor]=\"bgColor\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" class=\"navbar-button\">{{buttonData?.label}}</button>\r\n <div [ngStyle]=\"{'border-bottom':'1px solid'+buttonStyle?.color}\" (click)=\"changePage()\" [id]=\"sectionId\"></div>\r\n </div>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"navbar-button dropdown-toggle\" [simpoColor]=\"bgColor\" style=\"border: none; white-space: nowrap;\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" type=\"button\"\r\n id=\"
|
|
2588
|
+
args: [{ selector: 'simpo-navbar-button-element', standalone: true, imports: [CommonModule, MatButtonModule, ColorDirective], template: "<div *ngIf=\"buttonData?.status\">\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.TAB\">\r\n <div *ngIf=\"!buttonData?.folder\">\r\n <button mat-stroked-button style=\"border: none; white-space: nowrap;\" [id]=\"sectionId\" [simpoColor]=\"bgColor\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" class=\"navbar-button\">{{buttonData?.label}}</button>\r\n <div [ngStyle]=\"{'border-bottom':'1px solid'+buttonStyle?.color}\" (click)=\"changePage()\" [id]=\"sectionId\"></div>\r\n </div>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"navbar-button dropdown-toggle\" [simpoColor]=\"bgColor\" style=\"border: none; white-space: nowrap;\"\r\n [ngStyle]=\"{color:buttonStyle?.color}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div [ngStyle]=\"{'border-bottom':'1px solid'+buttonStyle?.color}\" [id]=\"sectionId\"></div>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.ROUND_SUBTLE\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.ROUND_BOLD\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 8px;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.SQUARE_SUBTLE\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;border-radius: 0px !important;width: max-content!important;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;border-radius: 0px !important;width: max-content!important;\"\r\n [ngStyle]=\"{color:buttonStyle?.color,'background-color':buttonStyle?.subtleColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"selectedStyle === HeaderButtonStyle.SQUARE_BOLD\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button\" *ngIf=\"!buttonData?.folder\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 0px !important;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" (click)=\"changePage()\"\r\n [id]=\"sectionId\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button mat-stroked-button class=\"primary btn-lg px-4 me-md-2 navbar-button dropdown-toggle\"\r\n style=\"border: none;padding: 20px 5px;width: max-content!important; border-radius: 0px !important;\"\r\n [ngStyle]=\"{color:buttonStyle?.boldColor,'background-color':buttonStyle?.backgroundColor}\" type=\"button\"\r\n id=\"headerDropdownButton\" data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <button mat-stroked-button color=\"primary btn-lg px-4 me-md-2\">{{buttonData?.content?.label}}</button> -->\r\n\r\n</div>\r\n<div *ngIf=\"!buttonData?.status\">\r\n <button mat-stroked-button style=\"border: none;width: max-content!important;\" *ngIf=\"!buttonData?.folder\"\r\n (click)=\"changePage()\" [id]=\"sectionId\" [simpoColor]=\"bgColor\"\r\n class=\"status-navbar-button\">{{buttonData?.label}}</button>\r\n <div class=\"dropdown\" *ngIf=\"buttonData?.folder && (buttonData?.folder?.pages?.length || 0) > 0\">\r\n <button class=\"status-navbar-button not-selected-dropdown dropdown-toggle\"\r\n style=\"border: none;width: max-content!important;\" [simpoColor]=\"bgColor\" type=\"button\" id=\"headerDropdownButton\"\r\n data-bs-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"headerDropdownButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder?.pages\">{{page.label}}</a>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".navbar-button,.status-navbar-button{font-size:18px!important}@media only screen and (max-width : 475px){.navbar-button{width:100%!important;display:flex;justify-content:flex-start}.status-navbar-button{color:#fff!important;display:flex;justify-content:flex-start}}.not-selected-dropdown{background:transparent}.dropdown-item{font-size:18px;padding:10px;font-family:Roboto,sans-serif;border-bottom:1px solid #dee2e6}.dropdown-menu{top:40px;border:none;border-radius:10px}\n"] }]
|
|
2589
2589
|
}], ctorParameters: () => [{ type: EventsService }], propDecorators: { buttonData: [{
|
|
2590
2590
|
type: Input
|
|
2591
2591
|
}], buttonStyle: [{
|
|
@@ -2610,7 +2610,7 @@ class SimpoStickyDirective {
|
|
|
2610
2610
|
}
|
|
2611
2611
|
else {
|
|
2612
2612
|
this.el.nativeElement.style.setProperty("position", "relative");
|
|
2613
|
-
this.el.nativeElement.style.setProperty("top", "0px");
|
|
2613
|
+
// this.el.nativeElement.style.setProperty("top", "0px");
|
|
2614
2614
|
}
|
|
2615
2615
|
}
|
|
2616
2616
|
ngOnDestroy() {
|