@carefirst/library 2.0.12 → 2.0.14
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2022/lib/components/notification/notification.component.mjs +3 -3
- package/esm2022/lib/components/page/page.component.mjs +3 -3
- package/esm2022/lib/interfaces/spacer.interface.mjs +2 -2
- package/fesm2022/carefirst-library.mjs +5 -5
- package/fesm2022/carefirst-library.mjs.map +1 -1
- package/lib/interfaces/spacer.interface.d.ts +1 -1
- package/package.json +1 -1
@@ -9,14 +9,14 @@ export class NotificationComponent {
|
|
9
9
|
data;
|
10
10
|
buttonClick = new EventEmitter();
|
11
11
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
12
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: NotificationComponent, selector: "cf-notification", inputs: { data: "data" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\"
|
12
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: NotificationComponent, selector: "cf-notification", inputs: { data: "data" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\">\n <div [ngClass]=\"data.status\" id=\"notification-container\">\n <ion-grid>\n <ion-row>\n <ion-col class=\"ion-align-self-center ion-text-start\">\n <p class=\"body-medium bold\">{{ data.heading }}</p>\n </ion-col>\n <ion-col size=\"auto\">\n <cf-icon icon=\"close\" *ngIf=\"data.canClose\" (click)=\"data = undefined\" [height]=\"10\" [iconColor]=\"data.status\"></cf-icon>\n </ion-col>\n <ion-col *ngIf=\"data.message\" size=\"12\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-small\">{{ data.message }}</p>\n </ion-col>\n <ion-col *ngIf=\"data.button?.buttonHeading\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium bold\">{{ data.button?.buttonHeading }}</p>\n </ion-col>\n <ion-col size=\"12\">\n <ng-content></ng-content>\n </ion-col>\n <ion-col size=\"12\" *ngIf=\"data.button\">\n <cf-spacer default=\"8\"></cf-spacer>\n <cf-btn type=\"primary\" fontSize=\"large\" action snug (click)=\"buttonClick.emit(data.button.buttonClickIdentifier)\">{{\n data.button.buttonText\n }}</cf-btn>\n </ion-col>\n </ion-row>\n </ion-grid>\n </div>\n </ion-col>\n </ion-row>\n </ion-grid>\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n</div>\n", styles: ["#notification-container{border-radius:4px;text-align:start;padding:12px;margin-inline:auto;max-width:640px}#notification-container.success{border:1.5px solid var(--cf-app-system-color-success);background-color:var(--cf-app-system-color-light-success)}#notification-container.warning{border:1.5px solid var(--cf-app-system-color-warning);background-color:var(--cf-app-system-color-light-warning)}#notification-container.error{border:1.5px solid var(--cf-app-system-color-error);background-color:var(--cf-app-system-color-light-error)}\n"], dependencies: [{ kind: "component", type: i1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i1.IonRow, selector: "ion-row" }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "cf-btn", inputs: ["type", "disabled", "alert", "action", "snug", "accent", "fontSize", "iconStart", "iconEnd", "loading", "customColor"] }, { kind: "component", type: i4.SpacerComponent, selector: "cf-spacer", inputs: ["default", "mobile", "desktop"] }, { kind: "component", type: i5.IconComponent, selector: "cf-icon", inputs: ["icon", "height", "iconColor"] }] });
|
13
13
|
}
|
14
14
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: NotificationComponent, decorators: [{
|
15
15
|
type: Component,
|
16
|
-
args: [{ selector: 'cf-notification', template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\"
|
16
|
+
args: [{ selector: 'cf-notification', template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\">\n <div [ngClass]=\"data.status\" id=\"notification-container\">\n <ion-grid>\n <ion-row>\n <ion-col class=\"ion-align-self-center ion-text-start\">\n <p class=\"body-medium bold\">{{ data.heading }}</p>\n </ion-col>\n <ion-col size=\"auto\">\n <cf-icon icon=\"close\" *ngIf=\"data.canClose\" (click)=\"data = undefined\" [height]=\"10\" [iconColor]=\"data.status\"></cf-icon>\n </ion-col>\n <ion-col *ngIf=\"data.message\" size=\"12\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-small\">{{ data.message }}</p>\n </ion-col>\n <ion-col *ngIf=\"data.button?.buttonHeading\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium bold\">{{ data.button?.buttonHeading }}</p>\n </ion-col>\n <ion-col size=\"12\">\n <ng-content></ng-content>\n </ion-col>\n <ion-col size=\"12\" *ngIf=\"data.button\">\n <cf-spacer default=\"8\"></cf-spacer>\n <cf-btn type=\"primary\" fontSize=\"large\" action snug (click)=\"buttonClick.emit(data.button.buttonClickIdentifier)\">{{\n data.button.buttonText\n }}</cf-btn>\n </ion-col>\n </ion-row>\n </ion-grid>\n </div>\n </ion-col>\n </ion-row>\n </ion-grid>\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n</div>\n", styles: ["#notification-container{border-radius:4px;text-align:start;padding:12px;margin-inline:auto;max-width:640px}#notification-container.success{border:1.5px solid var(--cf-app-system-color-success);background-color:var(--cf-app-system-color-light-success)}#notification-container.warning{border:1.5px solid var(--cf-app-system-color-warning);background-color:var(--cf-app-system-color-light-warning)}#notification-container.error{border:1.5px solid var(--cf-app-system-color-error);background-color:var(--cf-app-system-color-light-error)}\n"] }]
|
17
17
|
}], propDecorators: { data: [{
|
18
18
|
type: Input
|
19
19
|
}], buttonClick: [{
|
20
20
|
type: Output
|
21
21
|
}] } });
|
22
|
-
//# sourceMappingURL=data:application/json;base64,
|
22
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibm90aWZpY2F0aW9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NhcmVmaXJzdC9saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9ub3RpZmljYXRpb24vbm90aWZpY2F0aW9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NhcmVmaXJzdC9saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9ub3RpZmljYXRpb24vbm90aWZpY2F0aW9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVVBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7Ozs7Ozs7QUFTdkUsTUFBTSxPQUFPLHFCQUFxQjtJQUN2QixJQUFJLENBQW9DO0lBQ3ZDLFdBQVcsR0FBRyxJQUFJLFlBQVksRUFBcUUsQ0FBQzt1R0FGbkcscUJBQXFCOzJGQUFyQixxQkFBcUIsMEhDbkJsQywwc0RBdUNBOzsyRkRwQmEscUJBQXFCO2tCQUxqQyxTQUFTOytCQUNFLGlCQUFpQjs4QkFLbEIsSUFBSTtzQkFBWixLQUFLO2dCQUNJLFdBQVc7c0JBQXBCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENhcmVGaXJzdCBMaWJyYXJ5IC0gTm90aWZpY2F0aW9uXG4gKlxuICogQGZpbGUgICAgICAgICAgbm90aWZpY2F0aW9uLmNvbXBvbmVudFxuICogQGRlc2NyaXB0aW9uICAgQ29udGFpbnMgYWxsIHRoZSBsb2dpYyBmb3IgZ2VuZXJhdGluZyBhIENhcmVGaXJzdCBOb3RpZmljYXRpb25cbiAqIEBhdXRob3IgICAgICAgIEFybm8gSmFuc2VuIHZhbiBWdXVyZW5cbiAqIEBzaW5jZSAgICAgICAgIDIwMjMgLSAxMSAtIDI3XG4gKiBAdXNhZ2UgICAgICAgICA8Y2Ytbm90aWZpY2F0aW9uIFtkYXRhXT1cIntoZWFkaW5nLCBzdGF0dXMsICVtZXNzYWdlJSwgJWNhbkNsb3NlJSwgJWJ1dHRvbiV9XCIgKGJ1dHRvbkNsaWNrKT1cIlwiPjwvY2Ytbm90aWZpY2F0aW9uPlxuICovXG5cbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG4vLy0tLSBJbnRlcmZhY2VzXG5pbXBvcnQgdHlwZSB7IE5vdGlmaWNhdGlvblBheWxvYWRJIH0gZnJvbSAnLi4vLi4vaW50ZXJmYWNlcy9ub3RpZmljYXRpb24uaW50ZXJmYWNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY2Ytbm90aWZpY2F0aW9uJyxcbiAgdGVtcGxhdGVVcmw6ICcuL25vdGlmaWNhdGlvbi5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWycuL25vdGlmaWNhdGlvbi5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBOb3RpZmljYXRpb25Db21wb25lbnQge1xuICBASW5wdXQoKSBkYXRhPzogTm90aWZpY2F0aW9uUGF5bG9hZEkgfCB1bmRlZmluZWQ7XG4gIEBPdXRwdXQoKSBidXR0b25DbGljayA9IG5ldyBFdmVudEVtaXR0ZXI8UmVxdWlyZWQ8Tm90aWZpY2F0aW9uUGF5bG9hZEk+WydidXR0b24nXVsnYnV0dG9uQ2xpY2tJZGVudGlmaWVyJ10+KCk7XG59XG4iLCI8ZGl2ICpuZ0lmPVwiZGF0YVwiPlxuICA8Y2Ytc3BhY2VyIG1vYmlsZT1cIjE2XCIgZGVza3RvcD1cIjMyXCI+PC9jZi1zcGFjZXI+XG4gIDxpb24tZ3JpZD5cbiAgICA8aW9uLXJvdyBjbGFzcz1cImlvbi1qdXN0aWZ5LWNvbnRlbnQtY2VudGVyXCI+XG4gICAgICA8aW9uLWNvbCBzaXplPVwiMTJcIj5cbiAgICAgICAgPGRpdiBbbmdDbGFzc109XCJkYXRhLnN0YXR1c1wiIGlkPVwibm90aWZpY2F0aW9uLWNvbnRhaW5lclwiPlxuICAgICAgICAgIDxpb24tZ3JpZD5cbiAgICAgICAgICAgIDxpb24tcm93PlxuICAgICAgICAgICAgICA8aW9uLWNvbCBjbGFzcz1cImlvbi1hbGlnbi1zZWxmLWNlbnRlciBpb24tdGV4dC1zdGFydFwiPlxuICAgICAgICAgICAgICAgIDxwIGNsYXNzPVwiYm9keS1tZWRpdW0gYm9sZFwiPnt7IGRhdGEuaGVhZGluZyB9fTwvcD5cbiAgICAgICAgICAgICAgPC9pb24tY29sPlxuICAgICAgICAgICAgICA8aW9uLWNvbCBzaXplPVwiYXV0b1wiPlxuICAgICAgICAgICAgICAgIDxjZi1pY29uIGljb249XCJjbG9zZVwiICpuZ0lmPVwiZGF0YS5jYW5DbG9zZVwiIChjbGljayk9XCJkYXRhID0gdW5kZWZpbmVkXCIgW2hlaWdodF09XCIxMFwiIFtpY29uQ29sb3JdPVwiZGF0YS5zdGF0dXNcIj48L2NmLWljb24+XG4gICAgICAgICAgICAgIDwvaW9uLWNvbD5cbiAgICAgICAgICAgICAgPGlvbi1jb2wgKm5nSWY9XCJkYXRhLm1lc3NhZ2VcIiBzaXplPVwiMTJcIj5cbiAgICAgICAgICAgICAgICA8Y2Ytc3BhY2VyIGRlZmF1bHQ9XCI4XCI+PC9jZi1zcGFjZXI+XG4gICAgICAgICAgICAgICAgPHAgY2xhc3M9XCJib2R5LXNtYWxsXCI+e3sgZGF0YS5tZXNzYWdlIH19PC9wPlxuICAgICAgICAgICAgICA8L2lvbi1jb2w+XG4gICAgICAgICAgICAgIDxpb24tY29sICpuZ0lmPVwiZGF0YS5idXR0b24/LmJ1dHRvbkhlYWRpbmdcIj5cbiAgICAgICAgICAgICAgICA8Y2Ytc3BhY2VyIGRlZmF1bHQ9XCI4XCI+PC9jZi1zcGFjZXI+XG4gICAgICAgICAgICAgICAgPHAgY2xhc3M9XCJib2R5LW1lZGl1bSBib2xkXCI+e3sgZGF0YS5idXR0b24/LmJ1dHRvbkhlYWRpbmcgfX08L3A+XG4gICAgICAgICAgICAgIDwvaW9uLWNvbD5cbiAgICAgICAgICAgICAgPGlvbi1jb2wgc2l6ZT1cIjEyXCI+XG4gICAgICAgICAgICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgICAgICAgICAgICA8L2lvbi1jb2w+XG4gICAgICAgICAgICAgIDxpb24tY29sIHNpemU9XCIxMlwiICpuZ0lmPVwiZGF0YS5idXR0b25cIj5cbiAgICAgICAgICAgICAgICA8Y2Ytc3BhY2VyIGRlZmF1bHQ9XCI4XCI+PC9jZi1zcGFjZXI+XG4gICAgICAgICAgICAgICAgPGNmLWJ0biB0eXBlPVwicHJpbWFyeVwiIGZvbnRTaXplPVwibGFyZ2VcIiBhY3Rpb24gc251ZyAoY2xpY2spPVwiYnV0dG9uQ2xpY2suZW1pdChkYXRhLmJ1dHRvbi5idXR0b25DbGlja0lkZW50aWZpZXIpXCI+e3tcbiAgICAgICAgICAgICAgICAgIGRhdGEuYnV0dG9uLmJ1dHRvblRleHRcbiAgICAgICAgICAgICAgICB9fTwvY2YtYnRuPlxuICAgICAgICAgICAgICA8L2lvbi1jb2w+XG4gICAgICAgICAgICA8L2lvbi1yb3c+XG4gICAgICAgICAgPC9pb24tZ3JpZD5cbiAgICAgICAgPC9kaXY+XG4gICAgICA8L2lvbi1jb2w+XG4gICAgPC9pb24tcm93PlxuICA8L2lvbi1ncmlkPlxuICA8Y2Ytc3BhY2VyIG1vYmlsZT1cIjE2XCIgZGVza3RvcD1cIjMyXCI+PC9jZi1zcGFjZXI+XG48L2Rpdj5cbiJdfQ==
|
@@ -23,11 +23,11 @@ export class PageComponent {
|
|
23
23
|
this.inputDevMode = checkTruthAttribute(changes, 'devMode', this.inputDevMode);
|
24
24
|
}
|
25
25
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: PageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
26
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, outputs: { scrollEvent: "scrollEvent" }, usesOnChanges: true, ngImport: i0, template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:
|
26
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, outputs: { scrollEvent: "scrollEvent" }, usesOnChanges: true, ngImport: i0, template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1;width:min(var(--cf-page-content-mobile-max-width, 100%),100%)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0;width:min(var(--cf-page-content-desktop-max-width, 100%),100%)}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:24px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{justify-content:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
27
27
|
}
|
28
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: PageComponent, decorators: [{
|
29
29
|
type: Component,
|
30
|
-
args: [{ selector: 'cf-page', template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:
|
30
|
+
args: [{ selector: 'cf-page', template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1;width:min(var(--cf-page-content-mobile-max-width, 100%),100%)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0;width:min(var(--cf-page-content-desktop-max-width, 100%),100%)}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:24px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{justify-content:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"] }]
|
31
31
|
}], propDecorators: { centerH: [{
|
32
32
|
type: Input
|
33
33
|
}], centerV: [{
|
@@ -41,4 +41,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImpor
|
|
41
41
|
}], scrollEvent: [{
|
42
42
|
type: Output
|
43
43
|
}] } });
|
44
|
-
//# sourceMappingURL=data:application/json;base64,
|
44
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jYXJlZmlyc3QvbGlicmFyeS9zcmMvbGliL2NvbXBvbmVudHMvcGFnZS9wYWdlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NhcmVmaXJzdC9saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9wYWdlL3BhZ2UuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkJBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBc0MsWUFBWSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzNHLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7O0FBT2pFLE1BQU0sT0FBTyxhQUFhO0lBQ2YsT0FBTyxDQUFnQztJQUN2QyxPQUFPLENBQWdDO0lBQ3ZDLElBQUksQ0FBZ0M7SUFDcEMsUUFBUSxDQUFnQztJQUN4QyxPQUFPLENBQWdDO0lBQ3RDLFdBQVcsR0FBRyxJQUFJLFlBQVksRUFBZSxDQUFDO0lBR3hELFlBQVksR0FBRyxLQUFLLENBQUM7SUFDckIsWUFBWSxHQUFHLEtBQUssQ0FBQztJQUNyQixTQUFTLEdBQUcsS0FBSyxDQUFDO0lBQ2xCLGFBQWEsR0FBRyxLQUFLLENBQUM7SUFDdEIsWUFBWSxHQUFHLEtBQUssQ0FBQztJQU9yQixXQUFXLENBQUMsT0FBc0I7UUFFaEMsSUFBSSxDQUFDLFlBQVksR0FBRyxtQkFBbUIsQ0FBQyxPQUFPLEVBQUUsU0FBUyxFQUFFLElBQUksQ0FBQyxZQUFZLENBQUMsQ0FBQztRQUUvRSxJQUFJLENBQUMsWUFBWSxHQUFHLG1CQUFtQixDQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDO1FBRS9FLElBQUksQ0FBQyxTQUFTLEdBQUcsbUJBQW1CLENBQUMsT0FBTyxFQUFFLE1BQU0sRUFBRSxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUM7UUFFdEUsSUFBSSxDQUFDLGFBQWEsR0FBRyxtQkFBbUIsQ0FBQyxPQUFPLEVBQUUsVUFBVSxFQUFFLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQztRQUVsRixJQUFJLENBQUMsWUFBWSxHQUFHLG1CQUFtQixDQUFDLE9BQU8sRUFBRSxTQUFTLEVBQUUsSUFBSSxDQUFDLFlBQVksQ0FBQyxDQUFDO0lBQ2pGLENBQUM7dUdBL0JVLGFBQWE7MkZBQWIsYUFBYSx5TkNyQzFCLDhoQ0ErQkE7OzJGRE1hLGFBQWE7a0JBTHpCLFNBQVM7K0JBQ0UsU0FBUzs4QkFLVixPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLO2dCQUNHLElBQUk7c0JBQVosS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDSSxXQUFXO3NCQUFwQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDYXJlRmlyc3QgTGlicmFyeSAtIFBhZ2VcbiAqXG4gKiBAZmlsZSAgICAgICAgICBwYWdlLmNvbXBvbmVudFxuICogQGRlc2NyaXB0aW9uICAgQ29udGFpbnMgYWxsIHRoZSBsb2dpYyBmb3IgZ2VuZXJhdGluZyBhIGJhc2ljIENhcmVGaXJzdCBQYWdlIHN0cnVjdHVyZVxuICogQGF1dGhvciAgICAgICAgSmFjcXVlcyBDb2V0emVlXG4gKiBAc2luY2UgICAgICAgICAyMDIzIC0gMTEgLSAwN1xuICogQHVzYWdlICAgICAgICAgPGNmLXBhZ2VcbiAqICAgICAgICAgICAgICAgICAgICAlY2VudGVySCVcbiAqICAgICAgICAgICAgICAgICAgICAlY2VudGVyViVcbiAqICAgICAgICAgICAgICAgICAgICAlZGFyayVcbiAqICAgICAgICAgICAgICAgICAgICAlbm9TY3JvbGwlXG4gKiAgICAgICAgICAgICAgICAgICAgJWRldk1vZGUlXG4gKiAgICAgICAgICAgICAgICAgICAgc3R5bGU9XCJcbiAqICAgICAgICAgICAgICAgICAgICAgICAlLS1tYWluLWJnLWNvbG9yOiBibHVlOyVcbiAqICAgICAgICAgICAgICAgICAgICAgICAlLS1jZi1wYWdlLWlubGluZS1wYWRkaW5nOiAxNnB4OyVcbiAqICAgICAgICAgICAgICAgICAgICAgICAlLS1jZi1wYWdlLW1vYmlsZS1tYXgtd2lkdGg6IDM1OHB4OyVcbiAqICAgICAgICAgICAgICAgICAgICAgICAlLS1jZi1wYWdlLWRlc2t0b3AtbWF4LXdpZHRoOiAxMjk2cHg7JVxuICogICAgICAgICAgICAgICAgICAgICAgICUtLWNmLXBhZ2UtY29udGVudC1tb2JpbGUtbWF4LXdpZHRoOiAxMDAlOyVcbiAqICAgICAgICAgICAgICAgICAgICAgICAlLS1jZi1wYWdlLWNvbnRlbnQtZGVza3RvcC1tYXgtd2lkdGg6IDEwMCU7JVxuICogICAgICAgICAgICAgICAgICAgICAgICUtLWZvb3Rlci1iZy1jb2xvcjogdHJhbnNwYXJlbnQ7JVxuICogICAgICAgICAgICAgICAgICAgIFwiPlxuICogICAgICAgICAgICAgICAgICBDT05URU5UXG4gKiAgICAgICAgICAgICAgICAgICU8bmctY29udGFpbmVyIGNmLXBhZ2UtaGVhZGVyPjwvbmctY29udGFpbmVyPiVcbiAqICAgICAgICAgICAgICAgICAgJTxuZy1jb250YWluZXIgY2YtcGFnZS1idXR0b25zPjwvbmctY29udGFpbmVyPiVcbiAqICAgICAgICAgICAgICAgICAgJTxuZy1jb250YWluZXIgY2YtcGFnZS1mb290ZXI+PC9uZy1jb250YWluZXI+JVxuICogICAgICAgICAgICAgICAgPC9jZi1wYWdlPlxuICovXG5cbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgdHlwZSBPbkNoYW5nZXMsIHR5cGUgU2ltcGxlQ2hhbmdlcywgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBjaGVja1RydXRoQXR0cmlidXRlIH0gZnJvbSAnLi4vLi4vdXRpbHMvYXR0cmlidXRlLnV0aWwnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjZi1wYWdlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3BhZ2UuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9wYWdlLmNvbXBvbmVudC5zY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIFBhZ2VDb21wb25lbnQgaW1wbGVtZW50cyBPbkNoYW5nZXMge1xuICBASW5wdXQoKSBjZW50ZXJIPzogYm9vbGVhbiB8IHN0cmluZyB8IHVuZGVmaW5lZDtcbiAgQElucHV0KCkgY2VudGVyVj86IGJvb2xlYW4gfCBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gIEBJbnB1dCgpIGRhcms/OiBib29sZWFuIHwgc3RyaW5nIHwgdW5kZWZpbmVkO1xuICBASW5wdXQoKSBub1Njcm9sbD86IGJvb2xlYW4gfCBzdHJpbmcgfCB1bmRlZmluZWQ7XG4gIEBJbnB1dCgpIGRldk1vZGU/OiBib29sZWFuIHwgc3RyaW5nIHwgdW5kZWZpbmVkO1xuICBAT3V0cHV0KCkgc2Nyb2xsRXZlbnQgPSBuZXcgRXZlbnRFbWl0dGVyPEN1c3RvbUV2ZW50PigpO1xuXG4gIC8vLS0tIExvY2FsIHZhcmlhYmxlc1xuICBpbnB1dENlbnRlckggPSBmYWxzZTtcbiAgaW5wdXRDZW50ZXJWID0gZmFsc2U7XG4gIGlucHV0RGFyayA9IGZhbHNlO1xuICBpbnB1dE5vU2Nyb2xsID0gZmFsc2U7XG4gIGlucHV0RGV2TW9kZSA9IGZhbHNlO1xuXG4gIC8qKi0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS1cbiAgICogQG5hbWUgICAgICAgICAgbmdPbkNoYW5nZXNcbiAgICogQGRlc2NyaXB0aW9uICAgVXBkYXRlIHZhcmlvdXMgdmFsdWVzIG9uIGlucHV0IGNoYW5nZXNcbiAgICogQHJldHVybnMgICAgICAge3ZvaWR9XG4gICAqL1xuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgLy8tLS0gQ2VudGVyIEhcbiAgICB0aGlzLmlucHV0Q2VudGVySCA9IGNoZWNrVHJ1dGhBdHRyaWJ1dGUoY2hhbmdlcywgJ2NlbnRlckgnLCB0aGlzLmlucHV0Q2VudGVySCk7XG4gICAgLy8tLS0gQ2VudGVyIFZcbiAgICB0aGlzLmlucHV0Q2VudGVyViA9IGNoZWNrVHJ1dGhBdHRyaWJ1dGUoY2hhbmdlcywgJ2NlbnRlclYnLCB0aGlzLmlucHV0Q2VudGVyVik7XG4gICAgLy8tLS0gRGFya1xuICAgIHRoaXMuaW5wdXREYXJrID0gY2hlY2tUcnV0aEF0dHJpYnV0ZShjaGFuZ2VzLCAnZGFyaycsIHRoaXMuaW5wdXREYXJrKTtcbiAgICAvLy0tLSBObyBTY3JvbGxcbiAgICB0aGlzLmlucHV0Tm9TY3JvbGwgPSBjaGVja1RydXRoQXR0cmlidXRlKGNoYW5nZXMsICdub1Njcm9sbCcsIHRoaXMuaW5wdXROb1Njcm9sbCk7XG4gICAgLy8tLS0gRGV2IE1vZGVcbiAgICB0aGlzLmlucHV0RGV2TW9kZSA9IGNoZWNrVHJ1dGhBdHRyaWJ1dGUoY2hhbmdlcywgJ2Rldk1vZGUnLCB0aGlzLmlucHV0RGV2TW9kZSk7XG4gIH1cbn1cbiIsIjxpb24tY29udGVudFxuICBzY3JvbGxFdmVudHM9XCJ0cnVlXCJcbiAgY2xhc3M9XCJpb24tcGFnZSBjZi1wYWdlXCJcbiAgW25nQ2xhc3NdPVwieyAnYmctZGFyayc6IGlucHV0RGFyaywgJ25vLXNjcm9sbCc6IGlucHV0Tm9TY3JvbGwsICdkZXYtbW9kZSc6IGlucHV0RGV2TW9kZSB9XCJcbiAgKGlvblNjcm9sbCk9XCJzY3JvbGxFdmVudC5lbWl0KCRldmVudClcIj5cbiAgPGRpdiBpZD1cInBhZ2Utc2V0dXBcIiBbbmdDbGFzc109XCJ7ICdjZW50ZXItdic6IGlucHV0Q2VudGVyViB9XCI+XG4gICAgPCEtLSBIZWFkZXIgLS0+XG4gICAgPGRpdiBpZD1cImhlYWRlclwiIGNsYXNzPVwiaW9uLW5vLWJvcmRlclwiPlxuICAgICAgPGRpdiBjbGFzcz1cImNvbnRlbnRcIj5cbiAgICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2NmLXBhZ2UtaGVhZGVyXVwiPjwvbmctY29udGVudD5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICAgIDwhLS0gQ29udGVudCBhbmQgQnV0dG9ucyAtLT5cbiAgICA8ZGl2IGlkPVwiZGV2aWNlLXNwYWNpbmdcIiBbbmdDbGFzc109XCJ7ICdjZW50ZXItaCc6IGlucHV0Q2VudGVySCwgJ2NlbnRlci12JzogaW5wdXRDZW50ZXJWIH1cIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJjb250ZW50XCI+XG4gICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICAgIDwvZGl2PlxuICAgICAgPGRpdiBpZD1cInBhZ2UtYnV0dG9uc1wiPlxuICAgICAgICA8ZGl2IGNsYXNzPVwiY29udGVudFwiPlxuICAgICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltjZi1wYWdlLWJ1dHRvbnNdXCI+PC9uZy1jb250ZW50PlxuICAgICAgICA8L2Rpdj5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICAgIDwhLS0gRm9vdGVyIC0tPlxuICAgIDxkaXYgaWQ9XCJmb290ZXJcIj5cbiAgICAgIDxkaXYgY2xhc3M9XCJjb250ZW50XCI+XG4gICAgICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltjZi1wYWdlLWZvb3Rlcl1cIj48L25nLWNvbnRlbnQ+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2lvbi1jb250ZW50PlxuIl19
|
@@ -1,2 +1,2 @@
|
|
1
|
-
export const spacerNumberArray = [4, 8, 12, 16, 24, 32, 38, 48, 72];
|
2
|
-
//# sourceMappingURL=data:application/json;base64,
|
1
|
+
export const spacerNumberArray = [4, 8, 12, 16, 24, 32, 38, 48, 72, 96];
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3BhY2VyLmludGVyZmFjZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NhcmVmaXJzdC9saWJyYXJ5L3NyYy9saWIvaW50ZXJmYWNlcy9zcGFjZXIuaW50ZXJmYWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUdBLE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHLENBQUMsQ0FBQyxFQUFFLENBQUMsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxDQUFVLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKio9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09XG4gKiBAZGVzY3JpcHRpb24gICBBdmFpbGFibGUgU3BhY2VyIFZhbHVlc1xuICovXG5leHBvcnQgY29uc3Qgc3BhY2VyTnVtYmVyQXJyYXkgPSBbNCwgOCwgMTIsIDE2LCAyNCwgMzIsIDM4LCA0OCwgNzIsIDk2XSBhcyBjb25zdDtcbmV4cG9ydCB0eXBlIFNwYWNlck51bWJlclQgPSAodHlwZW9mIHNwYWNlck51bWJlckFycmF5KVtudW1iZXJdO1xuZXhwb3J0IHR5cGUgU3BhY2VyU3RyaW5nVCA9IGAke1NwYWNlck51bWJlclR9YDtcbiJdfQ==
|
@@ -103,11 +103,11 @@ class PageComponent {
|
|
103
103
|
this.inputDevMode = checkTruthAttribute(changes, 'devMode', this.inputDevMode);
|
104
104
|
}
|
105
105
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: PageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
106
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, outputs: { scrollEvent: "scrollEvent" }, usesOnChanges: true, ngImport: i0, template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:
|
106
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: PageComponent, selector: "cf-page", inputs: { centerH: "centerH", centerV: "centerV", dark: "dark", noScroll: "noScroll", devMode: "devMode" }, outputs: { scrollEvent: "scrollEvent" }, usesOnChanges: true, ngImport: i0, template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1;width:min(var(--cf-page-content-mobile-max-width, 100%),100%)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0;width:min(var(--cf-page-content-desktop-max-width, 100%),100%)}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:24px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{justify-content:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"], dependencies: [{ kind: "component", type: i1.IonContent, selector: "ion-content", inputs: ["color", "forceOverscroll", "fullscreen", "scrollEvents", "scrollX", "scrollY"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
107
107
|
}
|
108
108
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: PageComponent, decorators: [{
|
109
109
|
type: Component,
|
110
|
-
args: [{ selector: 'cf-page', template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:
|
110
|
+
args: [{ selector: 'cf-page', template: "<ion-content\n scrollEvents=\"true\"\n class=\"ion-page cf-page\"\n [ngClass]=\"{ 'bg-dark': inputDark, 'no-scroll': inputNoScroll, 'dev-mode': inputDevMode }\"\n (ionScroll)=\"scrollEvent.emit($event)\">\n <div id=\"page-setup\" [ngClass]=\"{ 'center-v': inputCenterV }\">\n <!-- Header -->\n <div id=\"header\" class=\"ion-no-border\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-header]\"></ng-content>\n </div>\n </div>\n <!-- Content and Buttons -->\n <div id=\"device-spacing\" [ngClass]=\"{ 'center-h': inputCenterH, 'center-v': inputCenterV }\">\n <div class=\"content\">\n <ng-content></ng-content>\n </div>\n <div id=\"page-buttons\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-buttons]\"></ng-content>\n </div>\n </div>\n </div>\n <!-- Footer -->\n <div id=\"footer\">\n <div class=\"content\">\n <ng-content select=\"[cf-page-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</ion-content>\n", styles: ["ion-content.cf-page{--page-background-color: var(--main-bg-color, var(--cf-app-background-light))}ion-content.cf-page.bg-dark{--page-background-color: var(--cf-app-background-dark)}ion-content.cf-page::part(scroll){background-color:var(--page-background-color);-ms-overflow-style:none;scrollbar-width:none}ion-content.cf-page::part(scroll)::-webkit-scrollbar{display:none}ion-content.cf-page.no-scroll::part(scroll){overflow:hidden}ion-content.cf-page #page-setup{width:100%;min-height:100%;height:fit-content;flex-direction:column;display:flex}ion-content.cf-page #page-setup>*{width:100%;padding-inline:var(--cf-page-inline-padding, 16px)}@media (min-width: 768px){ion-content.cf-page #page-setup>*{padding-inline:var(--cf-page-inline-padding, 72px)}}ion-content.cf-page #page-setup .content{display:flex;flex-direction:column;width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup .content{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup .content>*{max-width:100%}ion-content.cf-page #page-setup #header{display:flex;flex-direction:column;align-items:center;position:sticky;top:0;z-index:10;background-color:var(--page-background-color)}ion-content.cf-page #page-setup #device-spacing{flex-grow:1;display:flex;flex-direction:column}ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:1;width:min(var(--cf-page-content-mobile-max-width, 100%),100%)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing>.content:first-child{flex-grow:0;width:min(var(--cf-page-content-desktop-max-width, 100%),100%)}}ion-content.cf-page #page-setup #device-spacing #page-buttons{width:100%;max-width:var(--cf-page-mobile-max-width, 358px)}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons{max-width:var(--cf-page-desktop-max-width, 1296px)}}ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{justify-content:center;flex-wrap:nowrap;gap:16px;padding-bottom:24px}@media (min-width: 768px){ion-content.cf-page #page-setup #device-spacing #page-buttons>.content{flex-direction:row;padding-bottom:48px}}ion-content.cf-page #page-setup #device-spacing.center-h,ion-content.cf-page #page-setup #device-spacing.center-h>.content{align-items:center;text-align:center}ion-content.cf-page #page-setup #device-spacing.center-v,ion-content.cf-page #page-setup #device-spacing.center-v>.content{justify-content:center}ion-content.cf-page #page-setup #footer{display:flex;flex-direction:column;align-items:center;background-color:var(--footer-bg-color, transparent)}#page-setup.center-v{justify-content:center}ion-content.cf-page.dev-mode #page-setup{background-color:#0ff}ion-content.cf-page.dev-mode #page-setup #header{background-color:#00f}ion-content.cf-page.dev-mode #page-setup .content{background-color:green}ion-content.cf-page.dev-mode #page-setup #page-buttons>.content{background-color:tomato}ion-content.cf-page.dev-mode #page-setup #footer{background-color:brown}\n"] }]
|
111
111
|
}], propDecorators: { centerH: [{
|
112
112
|
type: Input
|
113
113
|
}], centerV: [{
|
@@ -319,11 +319,11 @@ class NotificationComponent {
|
|
319
319
|
data;
|
320
320
|
buttonClick = new EventEmitter();
|
321
321
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
322
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: NotificationComponent, selector: "cf-notification", inputs: { data: "data" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\"
|
322
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.1", type: NotificationComponent, selector: "cf-notification", inputs: { data: "data" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\">\n <div [ngClass]=\"data.status\" id=\"notification-container\">\n <ion-grid>\n <ion-row>\n <ion-col class=\"ion-align-self-center ion-text-start\">\n <p class=\"body-medium bold\">{{ data.heading }}</p>\n </ion-col>\n <ion-col size=\"auto\">\n <cf-icon icon=\"close\" *ngIf=\"data.canClose\" (click)=\"data = undefined\" [height]=\"10\" [iconColor]=\"data.status\"></cf-icon>\n </ion-col>\n <ion-col *ngIf=\"data.message\" size=\"12\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-small\">{{ data.message }}</p>\n </ion-col>\n <ion-col *ngIf=\"data.button?.buttonHeading\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium bold\">{{ data.button?.buttonHeading }}</p>\n </ion-col>\n <ion-col size=\"12\">\n <ng-content></ng-content>\n </ion-col>\n <ion-col size=\"12\" *ngIf=\"data.button\">\n <cf-spacer default=\"8\"></cf-spacer>\n <cf-btn type=\"primary\" fontSize=\"large\" action snug (click)=\"buttonClick.emit(data.button.buttonClickIdentifier)\">{{\n data.button.buttonText\n }}</cf-btn>\n </ion-col>\n </ion-row>\n </ion-grid>\n </div>\n </ion-col>\n </ion-row>\n </ion-grid>\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n</div>\n", styles: ["#notification-container{border-radius:4px;text-align:start;padding:12px;margin-inline:auto;max-width:640px}#notification-container.success{border:1.5px solid var(--cf-app-system-color-success);background-color:var(--cf-app-system-color-light-success)}#notification-container.warning{border:1.5px solid var(--cf-app-system-color-warning);background-color:var(--cf-app-system-color-light-warning)}#notification-container.error{border:1.5px solid var(--cf-app-system-color-error);background-color:var(--cf-app-system-color-light-error)}\n"], dependencies: [{ kind: "component", type: i1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i1.IonGrid, selector: "ion-grid", inputs: ["fixed"] }, { kind: "component", type: i1.IonRow, selector: "ion-row" }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "cf-btn", inputs: ["type", "disabled", "alert", "action", "snug", "accent", "fontSize", "iconStart", "iconEnd", "loading", "customColor"] }, { kind: "component", type: SpacerComponent, selector: "cf-spacer", inputs: ["default", "mobile", "desktop"] }, { kind: "component", type: IconComponent, selector: "cf-icon", inputs: ["icon", "height", "iconColor"] }] });
|
323
323
|
}
|
324
324
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.1", ngImport: i0, type: NotificationComponent, decorators: [{
|
325
325
|
type: Component,
|
326
|
-
args: [{ selector: 'cf-notification', template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\"
|
326
|
+
args: [{ selector: 'cf-notification', template: "<div *ngIf=\"data\">\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n <ion-grid>\n <ion-row class=\"ion-justify-content-center\">\n <ion-col size=\"12\">\n <div [ngClass]=\"data.status\" id=\"notification-container\">\n <ion-grid>\n <ion-row>\n <ion-col class=\"ion-align-self-center ion-text-start\">\n <p class=\"body-medium bold\">{{ data.heading }}</p>\n </ion-col>\n <ion-col size=\"auto\">\n <cf-icon icon=\"close\" *ngIf=\"data.canClose\" (click)=\"data = undefined\" [height]=\"10\" [iconColor]=\"data.status\"></cf-icon>\n </ion-col>\n <ion-col *ngIf=\"data.message\" size=\"12\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-small\">{{ data.message }}</p>\n </ion-col>\n <ion-col *ngIf=\"data.button?.buttonHeading\">\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium bold\">{{ data.button?.buttonHeading }}</p>\n </ion-col>\n <ion-col size=\"12\">\n <ng-content></ng-content>\n </ion-col>\n <ion-col size=\"12\" *ngIf=\"data.button\">\n <cf-spacer default=\"8\"></cf-spacer>\n <cf-btn type=\"primary\" fontSize=\"large\" action snug (click)=\"buttonClick.emit(data.button.buttonClickIdentifier)\">{{\n data.button.buttonText\n }}</cf-btn>\n </ion-col>\n </ion-row>\n </ion-grid>\n </div>\n </ion-col>\n </ion-row>\n </ion-grid>\n <cf-spacer mobile=\"16\" desktop=\"32\"></cf-spacer>\n</div>\n", styles: ["#notification-container{border-radius:4px;text-align:start;padding:12px;margin-inline:auto;max-width:640px}#notification-container.success{border:1.5px solid var(--cf-app-system-color-success);background-color:var(--cf-app-system-color-light-success)}#notification-container.warning{border:1.5px solid var(--cf-app-system-color-warning);background-color:var(--cf-app-system-color-light-warning)}#notification-container.error{border:1.5px solid var(--cf-app-system-color-error);background-color:var(--cf-app-system-color-light-error)}\n"] }]
|
327
327
|
}], propDecorators: { data: [{
|
328
328
|
type: Input
|
329
329
|
}], buttonClick: [{
|
@@ -1085,7 +1085,7 @@ var alert_interface = /*#__PURE__*/Object.freeze({
|
|
1085
1085
|
__proto__: null
|
1086
1086
|
});
|
1087
1087
|
|
1088
|
-
const spacerNumberArray = [4, 8, 12, 16, 24, 32, 38, 48, 72];
|
1088
|
+
const spacerNumberArray = [4, 8, 12, 16, 24, 32, 38, 48, 72, 96];
|
1089
1089
|
|
1090
1090
|
var spacer_interface = /*#__PURE__*/Object.freeze({
|
1091
1091
|
__proto__: null,
|