desktop-menu-bar
Version:
An angular component for a desktop like menu bar
18 lines • 2.78 kB
JavaScript
import { __decorate } from "tslib";
import { Component, Input } from '@angular/core';
let DesktopMenuBarVerticalComponent = class DesktopMenuBarVerticalComponent {
constructor() { }
ngOnInit() { }
};
__decorate([
Input()
], DesktopMenuBarVerticalComponent.prototype, "items", void 0);
DesktopMenuBarVerticalComponent = __decorate([
Component({
selector: 'desktop-menu-bar-vertical',
template: "<div>\n <div *ngFor=\"let item of items\" class=\"vertical-menu-item\">\n <span (click)=\"item.action ? item.action() : null\">\n {{ item.text }}\n <span *ngIf=\"item.children && item.children.length\">></span>\n </span>\n <desktop-menu-bar-vertical class=\"dropdown\" [items]=\"item.children\"></desktop-menu-bar-vertical>\n </div>\n</div>\n",
styles: [".vertical-menu-item{white-space:nowrap;background-color:#d3d3d3;padding:6px 12px;cursor:pointer;position:relative}.vertical-menu-item:hover{background-color:#b9b9b9}.vertical-menu-item .dropdown{z-index:1;position:absolute;top:0;left:100%;visibility:hidden;-webkit-transition:visibility;transition:visibility}.vertical-menu-item:hover>.dropdown{visibility:visible;-webkit-transition-delay:.2s;transition-delay:.2s}.vertical-menu-item:not(:last-child){border-bottom:1px solid rgba(255,255,255,.4)}"]
})
], DesktopMenuBarVerticalComponent);
export { DesktopMenuBarVerticalComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVza3RvcC1tZW51LWJhci12ZXJ0aWNhbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9kZXNrdG9wLW1lbnUtYmFyLyIsInNvdXJjZXMiOlsibGliL2Rlc2t0b3AtbWVudS1iYXItdmVydGljYWwvZGVza3RvcC1tZW51LWJhci12ZXJ0aWNhbC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBUXpELElBQWEsK0JBQStCLEdBQTVDLE1BQWEsK0JBQStCO0lBR3hDLGdCQUFlLENBQUM7SUFFaEIsUUFBUSxLQUFVLENBQUM7Q0FDdEIsQ0FBQTtBQUxZO0lBQVIsS0FBSyxFQUFFOzhEQUE2QjtBQUQ1QiwrQkFBK0I7SUFMM0MsU0FBUyxDQUFDO1FBQ1AsUUFBUSxFQUFFLDJCQUEyQjtRQUNyQyx1WEFBeUQ7O0tBRTVELENBQUM7R0FDVywrQkFBK0IsQ0FNM0M7U0FOWSwrQkFBK0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IERlc2t0b3BNZW51QmFySXRlbSB9IGZyb20gJy4uLy4uL2ludGVyZmFjZXMvZGVza3RvcC1tZW51LWJhci1pdGVtLmludGVyZmFjZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAnZGVza3RvcC1tZW51LWJhci12ZXJ0aWNhbCcsXG4gICAgdGVtcGxhdGVVcmw6ICcuL2Rlc2t0b3AtbWVudS1iYXItdmVydGljYWwuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2Rlc2t0b3AtbWVudS1iYXItdmVydGljYWwuY29tcG9uZW50LnNjc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBEZXNrdG9wTWVudUJhclZlcnRpY2FsQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgICBASW5wdXQoKSBpdGVtczogRGVza3RvcE1lbnVCYXJJdGVtW107XG5cbiAgICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgICBuZ09uSW5pdCgpOiB2b2lkIHt9XG59XG4iXX0=