gentics-ui-core
Version:
This is the common core framework for the Gentics CMS and Mesh UI, and other Angular applications.
47 lines • 4.16 kB
JavaScript
import { Component, HostBinding, Input } from '@angular/core';
import * as i0 from "@angular/core";
/**
* An animated CSS hamburger menu icon. Works well with [SideMenu](#/side-menu), but can be used for any kind of menu.
*
* ```HTML
* <gtx-menu-toggle-button [active]="isActive"
* (click)="isActive = !isActive">
* </gtx-menu-toggle-button>
* ```
*
* The colors can be configured by locally defining the following rules:
* ```css
* gtx-menu-toggle-button .bar { background-color: someColor; }
* gtx-menu-toggle-button.active .bar { background-color: someOtherColor; }
* ```
*/
export class MenuToggleButton {
constructor() {
this.active = false;
}
}
/** @nocollapse */ MenuToggleButton.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MenuToggleButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ MenuToggleButton.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.8", type: MenuToggleButton, selector: "gtx-menu-toggle-button", inputs: { active: "active" }, host: { properties: { "class.active": "this.active" } }, ngImport: i0, template: `
<div>
<div class="bar top"></div>
<div class="bar middle"></div>
<div class="bar bottom"></div>
</div>`, isInline: true });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.8", ngImport: i0, type: MenuToggleButton, decorators: [{
type: Component,
args: [{
selector: 'gtx-menu-toggle-button',
template: `
<div>
<div class="bar top"></div>
<div class="bar middle"></div>
<div class="bar bottom"></div>
</div>`
}]
}], propDecorators: { active: [{
type: HostBinding,
args: ['class.active']
}, {
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWVudS10b2dnbGUtYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9jb21wb25lbnRzL21lbnUtdG9nZ2xlLWJ1dHRvbi9tZW51LXRvZ2dsZS1idXR0b24uY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsV0FBVyxFQUFFLEtBQUssRUFBQyxNQUFNLGVBQWUsQ0FBQzs7QUFFNUQ7Ozs7Ozs7Ozs7Ozs7O0dBY0c7QUFVSCxNQUFNLE9BQU8sZ0JBQWdCO0lBVDdCO1FBY2EsV0FBTSxHQUFZLEtBQUssQ0FBQztLQUNwQzs7Z0lBTlksZ0JBQWdCO29IQUFoQixnQkFBZ0IscUpBUGY7Ozs7O2VBS0M7MkZBRUYsZ0JBQWdCO2tCQVQ1QixTQUFTO21CQUFDO29CQUNQLFFBQVEsRUFBRSx3QkFBd0I7b0JBQ2xDLFFBQVEsRUFBRTs7Ozs7ZUFLQztpQkFDZDs4QkFNWSxNQUFNO3NCQUpkLFdBQVc7dUJBQUMsY0FBYzs7c0JBSTFCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudCwgSG9zdEJpbmRpbmcsIElucHV0fSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuLyoqXG4gKiBBbiBhbmltYXRlZCBDU1MgaGFtYnVyZ2VyIG1lbnUgaWNvbi4gV29ya3Mgd2VsbCB3aXRoIFtTaWRlTWVudV0oIy9zaWRlLW1lbnUpLCBidXQgY2FuIGJlIHVzZWQgZm9yIGFueSBraW5kIG9mIG1lbnUuXG4gKlxuICogYGBgSFRNTFxuICogPGd0eC1tZW51LXRvZ2dsZS1idXR0b24gW2FjdGl2ZV09XCJpc0FjdGl2ZVwiXG4gKiAgICAgICAgICAgICAgICAgICAgICAgICAoY2xpY2spPVwiaXNBY3RpdmUgPSAhaXNBY3RpdmVcIj5cbiAqIDwvZ3R4LW1lbnUtdG9nZ2xlLWJ1dHRvbj5cbiAqIGBgYFxuICpcbiAqIFRoZSBjb2xvcnMgY2FuIGJlIGNvbmZpZ3VyZWQgYnkgbG9jYWxseSBkZWZpbmluZyB0aGUgZm9sbG93aW5nIHJ1bGVzOlxuICogYGBgY3NzXG4gKiBndHgtbWVudS10b2dnbGUtYnV0dG9uIC5iYXIgeyBiYWNrZ3JvdW5kLWNvbG9yOiBzb21lQ29sb3I7IH1cbiAqIGd0eC1tZW51LXRvZ2dsZS1idXR0b24uYWN0aXZlIC5iYXIgeyBiYWNrZ3JvdW5kLWNvbG9yOiBzb21lT3RoZXJDb2xvcjsgfVxuICogYGBgXG4gKi9cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnZ3R4LW1lbnUtdG9nZ2xlLWJ1dHRvbicsXG4gICAgdGVtcGxhdGU6IGBcbiAgICAgICAgPGRpdj5cbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJiYXIgdG9wXCI+PC9kaXY+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiYmFyIG1pZGRsZVwiPjwvZGl2PlxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImJhciBib3R0b21cIj48L2Rpdj5cbiAgICAgICAgPC9kaXY+YFxufSlcbmV4cG9ydCBjbGFzcyBNZW51VG9nZ2xlQnV0dG9uIHtcbiAgICBASG9zdEJpbmRpbmcoJ2NsYXNzLmFjdGl2ZScpXG4gICAgLyoqXG4gICAgICogV2hlbiBcImFjdGl2ZVwiLCB0aGUgYnV0dG9uIHdpbGwgYmUgYW4gXCJ4XCIsIG90aGVyd2lzZSBpdCB3aWxsIGJlIGEgXCJoYW1idXJnZXJcIlxuICAgICAqL1xuICAgIEBJbnB1dCgpIGFjdGl2ZTogYm9vbGVhbiA9IGZhbHNlO1xufVxuIl19