simpo-component-library 0.8.4 → 0.8.6
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/elements/navbar-button-element/navbar-button-element.component.mjs +3 -3
- package/esm2022/lib/sections/navbar-section/navbar-section.component.mjs +6 -3
- package/esm2022/lib/styles/style.model.mjs +1 -1
- package/fesm2022/simpo-component-library.mjs +7 -4
- package/fesm2022/simpo-component-library.mjs.map +1 -1
- package/lib/sections/navbar-section/navbar-section.component.d.ts +1 -0
- package/lib/styles/style.model.d.ts +2 -3
- package/package.json +1 -1
- package/simpo-component-library-0.8.6.tgz +0 -0
- package/simpo-component-library-0.8.4.tgz +0 -0
|
@@ -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\">\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=\"dropdownMenuButton\" data-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=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.
|
|
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?.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=\"dropdownMenuButton\" data-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=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\"\r\n data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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\">\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=\"dropdownMenuButton\" data-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=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.
|
|
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?.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=\"dropdownMenuButton\" data-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=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\" data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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?.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=\"dropdownMenuButton\"\r\n data-toggle=\"dropdown\" aria-haspopup=\"true\" aria-expanded=\"false\">\r\n {{buttonData?.label}}\r\n </button>\r\n <div class=\"dropdown-menu\" aria-labelledby=\"dropdownMenuButton\">\r\n <a class=\"dropdown-item\" *ngFor=\"let page of buttonData?.folder\">{{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: [{
|
|
@@ -2662,8 +2662,11 @@ class NavbarSectionComponent {
|
|
|
2662
2662
|
get isHeaderSticky() {
|
|
2663
2663
|
return this.data?.styles?.sticky;
|
|
2664
2664
|
}
|
|
2665
|
+
redirectTo(content) {
|
|
2666
|
+
this._eventService.buttonRedirection.emit({ data: content });
|
|
2667
|
+
}
|
|
2665
2668
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: NavbarSectionComponent, deps: [{ token: EventsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2666
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: NavbarSectionComponent, isStandalone: true, selector: "simpo-navbar-section", inputs: { data: "data", index: "index", edit: "edit" }, host: { listeners: { "window:resize": "getScreenSize($event)" } }, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"w-100\" style=\"z-index: 100;\" [id]=\"data?.id\" [simpoOverlay]=\"style?.background\"[simpoBackground]=\"style?.background\" [simpoSticky]=\"isHeaderSticky\">\r\n <nav class=\"navbar navbar-expand-lg d-block mb-0\" [simpoFooterLayout]=\"style?.layout\" [ngClass]=\"{'pt-0' : style?.layout?.spacing?.top === 'none', 'pb-0' : style?.layout?.spacing?.bottom === 'none'}\">\r\n <div class=\"container-fluid\">\r\n <div class=\"w-50 left-logo-text\">\r\n <!-- <a class=\"navbar-brand\" href=\"#\">{{content?.siteName?.value}}</a> -->\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage || !content?.logo?.image?.url\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon && content?.logo?.text?.url\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.url\">\r\n <img [src]=\"content?.logo?.image?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n </div>\r\n <div class=\"w-50 right-btn d-flex justify-content-end\">\r\n <button class=\"navbar-toggler menu-icon\" [simpoColor]=\"style?.background?.color\" [id]=\"data?.id\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNavAltMarkup\" *ngIf=\"screenWidth < 769\"\r\n aria-controls=\"navbarNavAltMarkup\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <hr>\r\n <hr>\r\n <hr>\r\n </button>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" *ngIf=\"screenWidth > 768\">\r\n <div class=\"navbar-nav align-items-center\">\r\n <div class=\"d-flex align-items-center gap-3 mt-4\" style=\"margin-right: 10px;\">\r\n <ng-container *ngFor=\"let item of content?.navbarButtons\">\r\n <ng-container *ngIf=\"item.showHeader\">\r\n <simpo-navbar-button-element [buttonData]=\"item\" [selectedStyle]=\"style?.navigationStyle\" [buttonStyle]=\"style?.navbarButtonStyle\"\r\n [bgColor]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-navbar-button-element>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex mt-4\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"action?.display\" class=\"button-display mt-0\">\r\n <div *ngFor=\"let button of action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarNavAltMarkup\" *ngIf=\"screenWidth < 768\">\r\n <div class=\"inner-height p-4\">\r\n <div class=\"nab-bar-mobile flex-column d-flex justify-content-between align-items-center\">\r\n <div class=\"d-flex flex-column w-100\">\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"title-row\">\r\n <div class=\"d-flex gap-3 align-items-center\" *ngIf=\"!content?.logo?.isImage || !content?.logo?.image?.url\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon && content?.logo?.text?.url\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 align-items-center\"\r\n *ngIf=\"content?.logo?.isImage\">\r\n <img [src]=\"content?.logo?.image?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n\r\n </div>\r\n <div class=\"close-box cursor-pointer d-flex\" (click)=\"close()\">\r\n <mat-icon>close</mat-icon>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center mt-5\">\r\n <div class=\"d-flex flex-column gap-4 w-100\">\r\n <ng-container *ngFor=\"let item of content?.navbarButtons\">\r\n <simpo-navbar-button-element [buttonData]=\"item\" [selectedStyle]=\"style?.navigationStyle\" [buttonStyle]=\"style?.navbarButtonStyle\"></simpo-navbar-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-4\">\r\n <div *ngIf=\"action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n</div>\r\n</div>\r\n", styles: [".navbar-toggler{height:40px}.button-display{display:flex;gap:12px;width:max-content}@media only screen and (max-width : 475px){.left-logo-text{width:85%!important}.right-btn{width:15%!important}}#navbarNavAltMarkup{position:fixed;top:0;width:100%;background-color:#0e3f58;color:#fff;height:calc(100vh + -0px);z-index:101}.inner-height,.nab-bar-mobile{height:100%}.total-container{height:auto;position:relative}.menu-icon{display:flex;flex-direction:column;gap:0px;align-items:center;justify-content:space-evenly;max-width:55px}.menu-icon hr{border:1px solid;margin:0;width:100%}.pt-0{padding-top:0!important}.pb-0{padding-bottom:0!important}\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: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "buttonId", "color", "sectionId"] }, { kind: "component", type: SociaIconsComponent, selector: "simpo-socia-icons", inputs: ["socialIconData", "color", "sectionId"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NavbarButtonElementComponent, selector: "simpo-navbar-button-element", inputs: ["buttonData", "buttonStyle", "selectedStyle", "bgColor", "sectionId"] }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions"], outputs: ["edit"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: SimpoFooterLayoutDirective, selector: "[simpoFooterLayout]", inputs: ["simpoFooterLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: SimpoStickyDirective, selector: "[simpoSticky]", inputs: ["simpoSticky"] }, { kind: "directive", type: ColorDirective, selector: "[simpoColor]", inputs: ["simpoColor"] }] }); }
|
|
2669
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.3", type: NavbarSectionComponent, isStandalone: true, selector: "simpo-navbar-section", inputs: { data: "data", index: "index", edit: "edit" }, host: { listeners: { "window:resize": "getScreenSize($event)" } }, ngImport: i0, template: "<div [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"w-100\" style=\"z-index: 100;\" [id]=\"data?.id\" [simpoOverlay]=\"style?.background\"[simpoBackground]=\"style?.background\" [simpoSticky]=\"isHeaderSticky\">\r\n <nav class=\"navbar navbar-expand-lg d-block mb-0\" [simpoFooterLayout]=\"style?.layout\">\r\n <div class=\"container-fluid\">\r\n <div class=\"w-50 left-logo-text\">\r\n <!-- <a class=\"navbar-brand\" href=\"#\">{{content?.siteName?.value}}</a> -->\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage || !content?.logo?.image?.url\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon && content?.logo?.text?.url\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.url\">\r\n <img [src]=\"content?.logo?.image?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n </div>\r\n <div class=\"w-50 right-btn d-flex justify-content-end\">\r\n <button class=\"navbar-toggler menu-icon\" [simpoColor]=\"style?.background?.color\" [id]=\"data?.id\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNavAltMarkup\" *ngIf=\"screenWidth < 769\"\r\n aria-controls=\"navbarNavAltMarkup\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <hr>\r\n <hr>\r\n <hr>\r\n </button>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" *ngIf=\"screenWidth > 768\">\r\n <div class=\"navbar-nav align-items-center\">\r\n <div class=\"d-flex align-items-center gap-3\" style=\"margin-right: 10px;\">\r\n <ng-container *ngFor=\"let item of content?.navbarButtons\">\r\n <ng-container *ngIf=\"item.showHeader\">\r\n <simpo-navbar-button-element [buttonData]=\"item\" [selectedStyle]=\"style?.navigationStyle\" [buttonStyle]=\"style?.navbarButtonStyle\"\r\n [bgColor]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-navbar-button-element>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"action?.display\" class=\"button-display mt-0\">\r\n <div *ngFor=\"let button of action?.buttons\">\r\n <button class=\"button\" (click)=\"redirectTo(button?.content)\" simpoButtonDirective [id]=\"data?.id+(button?.id || '')\" [buttonStyle]=\"button.styles\" [color]=\"data?.styles?.background?.accentColor\">{{button?.content?.label}}</button>\r\n <!-- <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarNavAltMarkup\" *ngIf=\"screenWidth < 768\">\r\n <div class=\"inner-height p-4\">\r\n <div class=\"nab-bar-mobile flex-column d-flex justify-content-between align-items-center\">\r\n <div class=\"d-flex flex-column w-100\">\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"title-row\">\r\n <div class=\"d-flex gap-3 align-items-center\" *ngIf=\"!content?.logo?.isImage || !content?.logo?.image?.url\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon && content?.logo?.text?.url\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 align-items-center\"\r\n *ngIf=\"content?.logo?.isImage\">\r\n <img [src]=\"content?.logo?.image?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n\r\n </div>\r\n <div class=\"close-box cursor-pointer d-flex\" (click)=\"close()\">\r\n <mat-icon>close</mat-icon>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center mt-5\">\r\n <div class=\"d-flex flex-column gap-4 w-100\">\r\n <ng-container *ngFor=\"let item of content?.navbarButtons\">\r\n <simpo-navbar-button-element [buttonData]=\"item\" [selectedStyle]=\"style?.navigationStyle\" [buttonStyle]=\"style?.navbarButtonStyle\"></simpo-navbar-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-4\">\r\n <div *ngIf=\"action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n</div>\r\n</div>\r\n", styles: [".navbar-toggler{height:40px}.button-display{display:flex;gap:12px;width:max-content}@media only screen and (max-width : 475px){.left-logo-text{width:85%!important}.right-btn{width:15%!important}}#navbarNavAltMarkup{position:fixed;top:0;width:100%;background-color:#0e3f58;color:#fff;height:calc(100vh + -0px);z-index:101}.inner-height,.nab-bar-mobile{height:100%}.total-container{height:auto;position:relative}.menu-icon{display:flex;flex-direction:column;gap:0px;align-items:center;justify-content:space-evenly;max-width:55px}.menu-icon hr{border:1px solid;margin:0;width:100%}.pt-0{padding-top:0!important}.pb-0{padding-bottom:0!important}.button{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important}\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: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: SimpoButtonComponent, selector: "app-button-element", inputs: ["buttonContent", "buttonStyle", "buttonId", "color", "sectionId"] }, { kind: "component", type: SociaIconsComponent, selector: "simpo-socia-icons", inputs: ["socialIconData", "color", "sectionId"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NavbarButtonElementComponent, selector: "simpo-navbar-button-element", inputs: ["buttonData", "buttonStyle", "selectedStyle", "bgColor", "sectionId"] }, { kind: "component", type: HoverElementsComponent, selector: "simpo-hover-elements", inputs: ["data", "index", "editOptions"], outputs: ["edit"] }, { kind: "directive", type: BackgroundDirective, selector: "[simpoBackground]", inputs: ["simpoBackground"] }, { kind: "directive", type: ButtonDirectiveDirective, selector: "[simpoButtonDirective]", inputs: ["buttonStyle", "color"] }, { kind: "directive", type: SimpoFooterLayoutDirective, selector: "[simpoFooterLayout]", inputs: ["simpoFooterLayout"] }, { kind: "directive", type: HoverDirective, selector: "[simpoHover]", outputs: ["hovering"] }, { kind: "directive", type: OverlayDirective, selector: "[simpoOverlay]", inputs: ["simpoOverlay"] }, { kind: "directive", type: SimpoStickyDirective, selector: "[simpoSticky]", inputs: ["simpoSticky"] }, { kind: "directive", type: ColorDirective, selector: "[simpoColor]", inputs: ["simpoColor"] }] }); }
|
|
2667
2670
|
}
|
|
2668
2671
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImport: i0, type: NavbarSectionComponent, decorators: [{
|
|
2669
2672
|
type: Component,
|
|
@@ -2686,7 +2689,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.3", ngImpor
|
|
|
2686
2689
|
SimpoStickyDirective,
|
|
2687
2690
|
PositionLayoutDirectiveDirective,
|
|
2688
2691
|
TextBackgroundDirectiveDirective,
|
|
2689
|
-
ColorDirective], template: "<div [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"w-100\" style=\"z-index: 100;\" [id]=\"data?.id\" [simpoOverlay]=\"style?.background\"[simpoBackground]=\"style?.background\" [simpoSticky]=\"isHeaderSticky\">\r\n <nav class=\"navbar navbar-expand-lg d-block mb-0\" [simpoFooterLayout]=\"style?.layout\"
|
|
2692
|
+
ColorDirective], template: "<div [id]=\"data?.id\" [simpoBackground]=\"style?.background\" simpoHover (hovering)=\"showEditTabs($event)\" class=\"total-container\">\r\n <div #mainContainer class=\"w-100\" style=\"z-index: 100;\" [id]=\"data?.id\" [simpoOverlay]=\"style?.background\"[simpoBackground]=\"style?.background\" [simpoSticky]=\"isHeaderSticky\">\r\n <nav class=\"navbar navbar-expand-lg d-block mb-0\" [simpoFooterLayout]=\"style?.layout\">\r\n <div class=\"container-fluid\">\r\n <div class=\"w-50 left-logo-text\">\r\n <!-- <a class=\"navbar-brand\" href=\"#\">{{content?.siteName?.value}}</a> -->\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\" *ngIf=\"!content?.logo?.isImage || !content?.logo?.image?.url\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon && content?.logo?.text?.url\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 gap-lg-3 align-items-lg-center\"\r\n *ngIf=\"content?.logo?.isImage && content?.logo?.image?.url\">\r\n <img [src]=\"content?.logo?.image?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n </div>\r\n <div class=\"w-50 right-btn d-flex justify-content-end\">\r\n <button class=\"navbar-toggler menu-icon\" [simpoColor]=\"style?.background?.color\" [id]=\"data?.id\" type=\"button\" data-bs-toggle=\"collapse\" data-bs-target=\"#navbarNavAltMarkup\" *ngIf=\"screenWidth < 769\"\r\n aria-controls=\"navbarNavAltMarkup\" aria-expanded=\"false\" aria-label=\"Toggle navigation\">\r\n <hr>\r\n <hr>\r\n <hr>\r\n </button>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" *ngIf=\"screenWidth > 768\">\r\n <div class=\"navbar-nav align-items-center\">\r\n <div class=\"d-flex align-items-center gap-3\" style=\"margin-right: 10px;\">\r\n <ng-container *ngFor=\"let item of content?.navbarButtons\">\r\n <ng-container *ngIf=\"item.showHeader\">\r\n <simpo-navbar-button-element [buttonData]=\"item\" [selectedStyle]=\"style?.navigationStyle\" [buttonStyle]=\"style?.navbarButtonStyle\"\r\n [bgColor]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-navbar-button-element>\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex\">\r\n <div *ngIf=\"action?.display\" class=\"button-display mt-0\">\r\n <div *ngFor=\"let button of action?.buttons\">\r\n <button class=\"button\" (click)=\"redirectTo(button?.content)\" simpoButtonDirective [id]=\"data?.id+(button?.id || '')\" [buttonStyle]=\"button.styles\" [color]=\"data?.styles?.background?.accentColor\">{{button?.content?.label}}</button>\r\n <!-- <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element> -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"collapse navbar-collapse\" id=\"navbarNavAltMarkup\" *ngIf=\"screenWidth < 768\">\r\n <div class=\"inner-height p-4\">\r\n <div class=\"nab-bar-mobile flex-column d-flex justify-content-between align-items-center\">\r\n <div class=\"d-flex flex-column w-100\">\r\n <div class=\"d-flex justify-content-between align-items-center\">\r\n <div class=\"title-row\">\r\n <div class=\"d-flex gap-3 align-items-center\" *ngIf=\"!content?.logo?.isImage || !content?.logo?.image?.url\">\r\n <div *ngIf=\"content?.logo?.text?.isIcon && content?.logo?.text?.url\">\r\n <img [src]=\"content?.logo?.text?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n <div class=\"heading-small\" *ngIf=\"content?.logo?.text?.isText\">\r\n <b [ngStyle]=\"{'font-family': content?.logo?.text?.fontFamily}\">{{content?.siteName?.value}}</b>\r\n </div>\r\n </div>\r\n <div class=\"d-flex gap-3 align-items-center\"\r\n *ngIf=\"content?.logo?.isImage\">\r\n <img [src]=\"content?.logo?.image?.url\" alt=\"logo\" [width]=\"content?.logo?.size\">\r\n </div>\r\n\r\n </div>\r\n <div class=\"close-box cursor-pointer d-flex\" (click)=\"close()\">\r\n <mat-icon>close</mat-icon>\r\n </div>\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center mt-5\">\r\n <div class=\"d-flex flex-column gap-4 w-100\">\r\n <ng-container *ngFor=\"let item of content?.navbarButtons\">\r\n <simpo-navbar-button-element [buttonData]=\"item\" [selectedStyle]=\"style?.navigationStyle\" [buttonStyle]=\"style?.navbarButtonStyle\"></simpo-navbar-button-element>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-start align-items-lg-center flex-column flex-lg-row gap-lg-0 gap-3\"\r\n [ngClass]=\"content?.socialLinks?.display ? 'justify-content-between' : 'justify-content-end'\">\r\n <div class=\"d-flex mt-0\" *ngIf=\"content?.socialLinks?.display\">\r\n <ng-container *ngFor=\"let item of content?.socialLinks?.channels\">\r\n <div style=\"position: relative;margin-right: 10px;\">\r\n <simpo-socia-icons [socialIconData]=\"item\" [color]=\"style?.background?.color\" [sectionId]=\"data?.id\"></simpo-socia-icons>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"d-flex mt-4\">\r\n <div *ngIf=\"action?.display\" class=\"button-display\">\r\n <div *ngFor=\"let button of action?.buttons\">\r\n <app-button-element [buttonContent]=\"button.content\" [buttonStyle]=\"button.styles\" [sectionId]=\"data?.id\"\r\n [color]=\"data?.styles?.background?.accentColor\"></app-button-element>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </nav>\r\n </div>\r\n <div [ngClass]=\"{'hover_effect': edit}\" *ngIf=\"showEditors\">\r\n <simpo-hover-elements [data]=\"data\" [editOptions]=\"edit\"></simpo-hover-elements>\r\n</div>\r\n</div>\r\n", styles: [".navbar-toggler{height:40px}.button-display{display:flex;gap:12px;width:max-content}@media only screen and (max-width : 475px){.left-logo-text{width:85%!important}.right-btn{width:15%!important}}#navbarNavAltMarkup{position:fixed;top:0;width:100%;background-color:#0e3f58;color:#fff;height:calc(100vh + -0px);z-index:101}.inner-height,.nab-bar-mobile{height:100%}.total-container{height:auto;position:relative}.menu-icon{display:flex;flex-direction:column;gap:0px;align-items:center;justify-content:space-evenly;max-width:55px}.menu-icon hr{border:1px solid;margin:0;width:100%}.pt-0{padding-top:0!important}.pb-0{padding-bottom:0!important}.button{font-size:16px!important;padding:1rem 2rem;display:inline-flex;align-items:center;justify-content:center;width:fit-content!important}\n"] }]
|
|
2690
2693
|
}], ctorParameters: () => [{ type: EventsService }], propDecorators: { data: [{
|
|
2691
2694
|
type: Input
|
|
2692
2695
|
}], index: [{
|