nereo-material
Version:
This project contains [Material Design](https://material.io/design/) components built with Angular and Angular Material. Its goal is to provide components that are not yet implemented in [Angular Material](https://material.angular.io/).
59 lines • 9.34 kB
JavaScript
import { __decorate, __metadata } from "tslib";
import { Component, Input, Output, EventEmitter } from '@angular/core';
var BannerComponent = /** @class */ (function () {
function BannerComponent() {
this.mainActionClick = new EventEmitter();
this.secondaryActionClick = new EventEmitter();
}
BannerComponent.prototype.ngOnInit = function () {
};
BannerComponent.prototype.mainActionClicked = function () {
this.mainActionClick.emit();
};
BannerComponent.prototype.secondaryActionClicked = function () {
this.secondaryActionClick.emit();
};
__decorate([
Input(),
__metadata("design:type", Boolean)
], BannerComponent.prototype, "show", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], BannerComponent.prototype, "icon", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], BannerComponent.prototype, "firstSentence", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], BannerComponent.prototype, "secondSentence", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], BannerComponent.prototype, "mainActionText", void 0);
__decorate([
Input(),
__metadata("design:type", String)
], BannerComponent.prototype, "secondaryActionText", void 0);
__decorate([
Output(),
__metadata("design:type", Object)
], BannerComponent.prototype, "mainActionClick", void 0);
__decorate([
Output(),
__metadata("design:type", Object)
], BannerComponent.prototype, "secondaryActionClick", void 0);
BannerComponent = __decorate([
Component({
selector: 'nm-banner',
template: "\n <mat-card *ngIf=\"show\">\n <mat-card-content>\n <mat-list>\n <mat-list-item>\n <mat-icon matListIcon color=\"primary\" *ngIf=\"icon\">{{icon}}</mat-icon>\n <div id=\"banner-text-container\">\n <p matLine>{{firstSentence}}</p>\n <p matLine *ngIf=\"secondSentence\">{{secondSentence}}</p>\n </div>\n </mat-list-item> \n </mat-list>\n <div id=\"banner-actions\">\n <button mat-button color=\"primary\" (click)=\"secondaryActionClicked()\" *ngIf=\"secondaryActionText\">{{secondaryActionText}}</button> \n <button mat-button color=\"primary\" (click)=\"mainActionClicked()\">{{mainActionText}}</button>\n </div>\n </mat-card-content>\n </mat-card>\n ",
styles: ["\n mat-card {\n height: 52px;\n padding: 0;\n }\n \n mat-card-content{\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin: 0 auto;\n max-width: 90%;\n flex-wrap: wrap;\n }\n \n #banner-text-container {\n margin-left: 24px;\n }\n\n #banner-text-container p{\n font-size: 14px;\n margin: 3px 0;\n }\n\n #banner-actions button{\n text-transform: uppercase !important;\n }\n \n mat-card-content,\n mat-list,\n mat-list-item {\n height: 100% !important;\n padding: 0;\n }\n\n .mat-list, .mat-list-item, .mat-list-text{\n flex-direction: row !important;\n }\n\n @media(max-width:959px){\n mat-card {\n height: 112px;\n }\n \n mat-card-content,\n mat-list,\n mat-list-item {\n height: auto !important;\n max-width: 100% !important;\n width: 100% !important;\n } \n\n mat-list-item {\n margin: 12px 0 !important;\n }\n\n #banner-text-container {\n margin-left: 16px !important;\n }\n\n #banner-actions {\n justify-content: flex-end;\n display: flex;\n width: 100%;\n } \n }\n "]
}),
__metadata("design:paramtypes", [])
], BannerComponent);
return BannerComponent;
}());
export { BannerComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFubmVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL25lcmVvLW1hdGVyaWFsLyIsInNvdXJjZXMiOlsibGliL2Jhbm5lci9iYW5uZXIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFVLEtBQUssRUFBRSxNQUFNLEVBQUUsWUFBWSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBMkYvRTtJQTBCSTtRQUxBLG9CQUFlLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUdyQyx5QkFBb0IsR0FBRyxJQUFJLFlBQVksRUFBRSxDQUFDO0lBRTFCLENBQUM7SUFFakIsa0NBQVEsR0FBUjtJQUNBLENBQUM7SUFFRCwyQ0FBaUIsR0FBakI7UUFDRSxJQUFJLENBQUMsZUFBZSxDQUFDLElBQUksRUFBRSxDQUFDO0lBQzlCLENBQUM7SUFFRCxnREFBc0IsR0FBdEI7UUFDRSxJQUFJLENBQUMsb0JBQW9CLENBQUMsSUFBSSxFQUFFLENBQUM7SUFDbkMsQ0FBQztJQWxDRDtRQURDLEtBQUssRUFBRTs7aURBQ007SUFHZDtRQURDLEtBQUssRUFBRTs7aURBQ0s7SUFHYjtRQURDLEtBQUssRUFBRTs7MERBQ2M7SUFHdEI7UUFEQyxLQUFLLEVBQUU7OzJEQUNlO0lBR3ZCO1FBREMsS0FBSyxFQUFFOzsyREFDZTtJQUd2QjtRQURDLEtBQUssRUFBRTs7Z0VBQ29CO0lBRzVCO1FBREMsTUFBTSxFQUFFOzs0REFDNEI7SUFHckM7UUFEQyxNQUFNLEVBQUU7O2lFQUNpQztJQXhCakMsZUFBZTtRQXpGM0IsU0FBUyxDQUFDO1lBQ1QsUUFBUSxFQUFFLFdBQVc7WUFDckIsUUFBUSxFQUFFLDB4QkFrQlQ7cUJBQ1EseTFDQWtFUjtTQUNGLENBQUM7O09BQ1csZUFBZSxDQXNDekI7SUFBRCxzQkFBQztDQUFBLEFBdENILElBc0NHO1NBdENVLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCwgSW5wdXQsIE91dHB1dCwgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ25tLWJhbm5lcicsXG4gIHRlbXBsYXRlOiBgXG4gIDxtYXQtY2FyZCAqbmdJZj1cInNob3dcIj5cbiAgICA8bWF0LWNhcmQtY29udGVudD5cbiAgICAgICAgPG1hdC1saXN0PlxuICAgICAgICA8bWF0LWxpc3QtaXRlbT5cbiAgICAgICAgICAgIDxtYXQtaWNvbiBtYXRMaXN0SWNvbiBjb2xvcj1cInByaW1hcnlcIiAqbmdJZj1cImljb25cIj57e2ljb259fTwvbWF0LWljb24+XG4gICAgICAgICAgICA8ZGl2IGlkPVwiYmFubmVyLXRleHQtY29udGFpbmVyXCI+XG4gICAgICAgICAgICAgICAgPHAgbWF0TGluZT57e2ZpcnN0U2VudGVuY2V9fTwvcD5cbiAgICAgICAgICAgICAgICA8cCBtYXRMaW5lICpuZ0lmPVwic2Vjb25kU2VudGVuY2VcIj57e3NlY29uZFNlbnRlbmNlfX08L3A+XG4gICAgICAgICAgICA8L2Rpdj5cbiAgICAgICAgPC9tYXQtbGlzdC1pdGVtPiAgICBcbiAgICAgICAgPC9tYXQtbGlzdD5cbiAgICAgICAgPGRpdiBpZD1cImJhbm5lci1hY3Rpb25zXCI+XG4gICAgICAgICAgICA8YnV0dG9uIG1hdC1idXR0b24gY29sb3I9XCJwcmltYXJ5XCIgKGNsaWNrKT1cInNlY29uZGFyeUFjdGlvbkNsaWNrZWQoKVwiICpuZ0lmPVwic2Vjb25kYXJ5QWN0aW9uVGV4dFwiPnt7c2Vjb25kYXJ5QWN0aW9uVGV4dH19PC9idXR0b24+ICBcbiAgICAgICAgICAgIDxidXR0b24gbWF0LWJ1dHRvbiBjb2xvcj1cInByaW1hcnlcIiAoY2xpY2spPVwibWFpbkFjdGlvbkNsaWNrZWQoKVwiPnt7bWFpbkFjdGlvblRleHR9fTwvYnV0dG9uPlxuICAgICAgICA8L2Rpdj5cbiAgICA8L21hdC1jYXJkLWNvbnRlbnQ+XG4gICAgPC9tYXQtY2FyZD5cbiAgYCxcbiAgc3R5bGVzOiBbYFxuICAgIG1hdC1jYXJkIHtcbiAgICAgICAgaGVpZ2h0OiA1MnB4O1xuICAgICAgICBwYWRkaW5nOiAwO1xuICAgIH1cbiAgICBcbiAgICBtYXQtY2FyZC1jb250ZW50e1xuICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47XG4gICAgICAgIG1hcmdpbjogMCBhdXRvO1xuICAgICAgICBtYXgtd2lkdGg6IDkwJTtcbiAgICAgICAgZmxleC13cmFwOiB3cmFwO1xuICAgIH1cbiAgICBcbiAgICAjYmFubmVyLXRleHQtY29udGFpbmVyIHtcbiAgICAgICAgbWFyZ2luLWxlZnQ6IDI0cHg7XG4gICAgfVxuXG4gICAgI2Jhbm5lci10ZXh0LWNvbnRhaW5lciBwe1xuICAgICAgICBmb250LXNpemU6IDE0cHg7XG4gICAgICAgIG1hcmdpbjogM3B4IDA7XG4gICAgfVxuXG4gICAgI2Jhbm5lci1hY3Rpb25zIGJ1dHRvbntcbiAgICAgICAgdGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZSAhaW1wb3J0YW50O1xuICAgIH1cbiAgICAgICAgIFxuICAgIG1hdC1jYXJkLWNvbnRlbnQsXG4gICAgbWF0LWxpc3QsXG4gICAgbWF0LWxpc3QtaXRlbSB7XG4gICAgICAgIGhlaWdodDogMTAwJSAhaW1wb3J0YW50O1xuICAgICAgICBwYWRkaW5nOiAwO1xuICAgIH1cblxuICAgIC5tYXQtbGlzdCwgLm1hdC1saXN0LWl0ZW0sIC5tYXQtbGlzdC10ZXh0e1xuICAgICAgICBmbGV4LWRpcmVjdGlvbjogcm93ICFpbXBvcnRhbnQ7XG4gICAgfVxuXG4gICAgQG1lZGlhKG1heC13aWR0aDo5NTlweCl7XG4gICAgICAgIG1hdC1jYXJkIHtcbiAgICAgICAgICAgIGhlaWdodDogMTEycHg7XG4gICAgICAgIH1cbiAgICAgICAgXG4gICAgICAgIG1hdC1jYXJkLWNvbnRlbnQsXG4gICAgICAgIG1hdC1saXN0LFxuICAgICAgICBtYXQtbGlzdC1pdGVtIHtcbiAgICAgICAgICAgIGhlaWdodDogYXV0byAhaW1wb3J0YW50O1xuICAgICAgICAgICAgbWF4LXdpZHRoOiAxMDAlICFpbXBvcnRhbnQ7XG4gICAgICAgICAgICB3aWR0aDogMTAwJSAhaW1wb3J0YW50O1xuICAgICAgICB9ICAgIFxuXG4gICAgICAgIG1hdC1saXN0LWl0ZW0ge1xuICAgICAgICAgICAgbWFyZ2luOiAxMnB4IDAgIWltcG9ydGFudDtcbiAgICAgICAgfVxuXG4gICAgICAgICNiYW5uZXItdGV4dC1jb250YWluZXIge1xuICAgICAgICAgICAgbWFyZ2luLWxlZnQ6IDE2cHggIWltcG9ydGFudDtcbiAgICAgICAgfVxuXG4gICAgICAgICNiYW5uZXItYWN0aW9ucyB7XG4gICAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGZsZXgtZW5kO1xuICAgICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICB9IFxuICAgIH1cbiAgYF1cbn0pXG5leHBvcnQgY2xhc3MgQmFubmVyQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICAgIEBJbnB1dCgpXG4gICAgc2hvdzogYm9vbGVhbjtcblxuICAgIEBJbnB1dCgpXG4gICAgaWNvbjogc3RyaW5nO1xuICBcbiAgICBASW5wdXQoKVxuICAgIGZpcnN0U2VudGVuY2U6IHN0cmluZztcbiAgXG4gICAgQElucHV0KClcbiAgICBzZWNvbmRTZW50ZW5jZTogc3RyaW5nO1xuICBcbiAgICBASW5wdXQoKVxuICAgIG1haW5BY3Rpb25UZXh0OiBzdHJpbmc7XG4gIFxuICAgIEBJbnB1dCgpXG4gICAgc2Vjb25kYXJ5QWN0aW9uVGV4dDogc3RyaW5nO1xuICBcbiAgICBAT3V0cHV0KClcbiAgICBtYWluQWN0aW9uQ2xpY2sgPSBuZXcgRXZlbnRFbWl0dGVyKCk7XG4gIFxuICAgIEBPdXRwdXQoKVxuICAgIHNlY29uZGFyeUFjdGlvbkNsaWNrID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICBcbiAgICBjb25zdHJ1Y3RvcigpIHsgfVxuICBcbiAgICBuZ09uSW5pdCgpIHtcbiAgICB9XG4gIFxuICAgIG1haW5BY3Rpb25DbGlja2VkKCl7XG4gICAgICB0aGlzLm1haW5BY3Rpb25DbGljay5lbWl0KCk7XG4gICAgfVxuICBcbiAgICBzZWNvbmRhcnlBY3Rpb25DbGlja2VkKCl7XG4gICAgICB0aGlzLnNlY29uZGFyeUFjdGlvbkNsaWNrLmVtaXQoKTtcbiAgICB9XG4gIH1cbiJdfQ==