UNPKG

4.68 kBJavaScriptView Raw
1var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
2 var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
3 if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
4 else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
5 return c > 3 && r && Object.defineProperty(target, key, r), r;
6};
7var __metadata = (this && this.__metadata) || function (k, v) {
8 if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
9};
10import { NgModule, Component, ChangeDetectionStrategy, Input, ViewEncapsulation, Directive } from '@angular/core';
11import { Renderer } from '@angular/core';
12import { ElementRef } from '@angular/core';
13export var MdToolbarRow = (function () {
14 function MdToolbarRow() {
15 }
16 MdToolbarRow = __decorate([
17 Directive({
18 selector: 'md-toolbar-row'
19 }),
20 __metadata('design:paramtypes', [])
21 ], MdToolbarRow);
22 return MdToolbarRow;
23}());
24export var MdToolbar = (function () {
25 function MdToolbar(elementRef, renderer) {
26 this.elementRef = elementRef;
27 this.renderer = renderer;
28 }
29 Object.defineProperty(MdToolbar.prototype, "color", {
30 get: function () {
31 return this._color;
32 },
33 set: function (value) {
34 this._updateColor(value);
35 },
36 enumerable: true,
37 configurable: true
38 });
39 MdToolbar.prototype._updateColor = function (newColor) {
40 this._setElementColor(this._color, false);
41 this._setElementColor(newColor, true);
42 this._color = newColor;
43 };
44 MdToolbar.prototype._setElementColor = function (color, isAdd) {
45 if (color != null && color != '') {
46 this.renderer.setElementClass(this.elementRef.nativeElement, "md-" + color, isAdd);
47 }
48 };
49 __decorate([
50 Input(),
51 __metadata('design:type', String)
52 ], MdToolbar.prototype, "color", null);
53 MdToolbar = __decorate([
54 Component({selector: 'md-toolbar',
55 template: "<div class=\"md-toolbar-layout\"> <md-toolbar-row> <ng-content></ng-content> </md-toolbar-row> <ng-content select=\"md-toolbar-row\"></ng-content> </div>",
56 styles: ["/** * Mixin that creates a new stacking context. * see https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context */ /** * This mixin hides an element visually. * That means it's still accessible for screen-readers but not visible in view. */ /** * Forces an element to grow to fit floated contents; used as as an alternative to * `overflow: hidden;` because it doesn't cut off contents. */ /** * A mixin, which generates temporary ink ripple on a given component. * When $bindToParent is set to true, it will check for the focused class on the same selector as you included * that mixin. * It is also possible to specify the color palette of the temporary ripple. By default it uses the * accent palette for its background. */ md-toolbar { display: flex; box-sizing: border-box; width: 100%; min-height: 64px; font-size: 20px; font-weight: 400; font-family: Roboto, \"Helvetica Neue\", sans-serif; padding: 0 16px; flex-direction: column; background: whitesmoke; color: rgba(0, 0, 0, 0.87); } md-toolbar.md-primary { background: #009688; color: white; } md-toolbar.md-accent { background: #9c27b0; color: rgba(255, 255, 255, 0.870588); } md-toolbar.md-warn { background: #f44336; color: white; } md-toolbar md-toolbar-row { display: flex; box-sizing: border-box; width: 100%; height: 64px; flex-direction: row; align-items: center; } /*# sourceMappingURL=toolbar.css.map */ "],
57 changeDetection: ChangeDetectionStrategy.OnPush,
58 encapsulation: ViewEncapsulation.None
59 }),
60 __metadata('design:paramtypes', [ElementRef, Renderer])
61 ], MdToolbar);
62 return MdToolbar;
63}());
64export var MdToolbarModule = (function () {
65 function MdToolbarModule() {
66 }
67 MdToolbarModule.forRoot = function () {
68 return {
69 ngModule: MdToolbarModule,
70 providers: []
71 };
72 };
73 MdToolbarModule = __decorate([
74 NgModule({
75 exports: [MdToolbar, MdToolbarRow],
76 declarations: [MdToolbar, MdToolbarRow],
77 }),
78 __metadata('design:paramtypes', [])
79 ], MdToolbarModule);
80 return MdToolbarModule;
81}());
82
83//# sourceMappingURL=toolbar.js.map