1 | (function (global, factory) {
|
2 | typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core')) :
|
3 | typeof define === 'function' && define.amd ? define(['exports', '@angular/core'], factory) :
|
4 | (factory((global.md = global.md || {}, global.md.card = global.md.card || {}),global.ng.core));
|
5 | }(this, (function (exports,_angular_core) { 'use strict';
|
6 |
|
7 | var __decorate = (window && window.__decorate) || function (decorators, target, key, desc) {
|
8 | var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
9 | if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
10 | 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;
|
11 | return c > 3 && r && Object.defineProperty(target, key, r), r;
|
12 | };
|
13 | var __metadata = (window && window.__metadata) || function (k, v) {
|
14 | if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
15 | };
|
16 |
|
17 |
|
18 |
|
19 | var MdCardContent = (function () {
|
20 | function MdCardContent() {
|
21 | }
|
22 | MdCardContent = __decorate([
|
23 | _angular_core.Directive({
|
24 | selector: 'md-card-content'
|
25 | }),
|
26 | __metadata('design:paramtypes', [])
|
27 | ], MdCardContent);
|
28 | return MdCardContent;
|
29 | }());
|
30 |
|
31 |
|
32 |
|
33 | var MdCardTitle = (function () {
|
34 | function MdCardTitle() {
|
35 | }
|
36 | MdCardTitle = __decorate([
|
37 | _angular_core.Directive({
|
38 | selector: 'md-card-title'
|
39 | }),
|
40 | __metadata('design:paramtypes', [])
|
41 | ], MdCardTitle);
|
42 | return MdCardTitle;
|
43 | }());
|
44 |
|
45 |
|
46 |
|
47 | var MdCardSubtitle = (function () {
|
48 | function MdCardSubtitle() {
|
49 | }
|
50 | MdCardSubtitle = __decorate([
|
51 | _angular_core.Directive({
|
52 | selector: 'md-card-subtitle'
|
53 | }),
|
54 | __metadata('design:paramtypes', [])
|
55 | ], MdCardSubtitle);
|
56 | return MdCardSubtitle;
|
57 | }());
|
58 |
|
59 |
|
60 |
|
61 | var MdCardActions = (function () {
|
62 | function MdCardActions() {
|
63 | }
|
64 | MdCardActions = __decorate([
|
65 | _angular_core.Directive({
|
66 | selector: 'md-card-actions'
|
67 | }),
|
68 | __metadata('design:paramtypes', [])
|
69 | ], MdCardActions);
|
70 | return MdCardActions;
|
71 | }());
|
72 |
|
73 |
|
74 |
|
75 |
|
76 |
|
77 |
|
78 |
|
79 |
|
80 |
|
81 |
|
82 |
|
83 |
|
84 |
|
85 |
|
86 |
|
87 |
|
88 |
|
89 |
|
90 | var MdCard = (function () {
|
91 | function MdCard() {
|
92 | }
|
93 | MdCard = __decorate([
|
94 | _angular_core.Component({selector: 'md-card',
|
95 | template: "<ng-content></ng-content> ",
|
96 | styles: ["/** * A collection of mixins and CSS classes that can be used to apply elevation to a material * element. * See: https://www.google.com/design/spec/what-is-material/elevation-shadows.html * Examples: * * * .md-foo { * @include $md-elevation(2); * * &:active { * @include $md-elevation(8); * } * } * * <div id=\"external-card\" class=\"md-elevation-z2\"><p>Some content</p></div> * * For an explanation of the design behind how elevation is implemented, see the design doc at * https://goo.gl/Kq0k9Z. */ /** * The css property used for elevation. In most cases this should not be changed. It is exposed * as a variable for abstraction / easy use when needing to reference the property directly, for * example in a will-change rule. */ /** The default duration value for elevation transitions. */ /** The default easing value for elevation transitions. */ /** * Applies the correct css rules to an element to give it the elevation specified by $zValue. * The $zValue must be between 0 and 24. */ /** * Returns a string that can be used as the value for a transition property for elevation. * Calling this function directly is useful in situations where a component needs to transition * more than one property. * * .foo { * transition: md-elevation-transition-property-value(), opacity 100ms ease; * will-change: $md-elevation-property, opacity; * } */ /** * Applies the correct css rules needed to have an element transition between elevations. * This mixin should be applied to elements whose elevation values will change depending on their * context (e.g. when active or disabled). */ md-card { box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); will-change: box-shadow; display: block; position: relative; padding: 24px; border-radius: 2px; font-family: Roboto, \"Helvetica Neue\", sans-serif; background: white; color: black; } md-card:hover { box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } .md-card-flat { box-shadow: none; } md-card-title, md-card-subtitle, md-card-content, md-card-actions { display: block; margin-bottom: 16px; } md-card-title { font-size: 24px; font-weight: 400; } md-card-subtitle { font-size: 14px; color: rgba(0, 0, 0, 0.54); } md-card-content { font-size: 14px; } md-card-actions { margin-left: -16px; margin-right: -16px; padding: 8px 0; } md-card-actions[align='end'] { display: flex; justify-content: flex-end; } [md-card-image] { width: calc(100% + 48px); margin: 0 -24px 16px -24px; } [md-card-xl-image] { width: 240px; height: 240px; margin: -8px; } md-card-footer { position: absolute; bottom: 0; } md-card-actions [md-button], md-card-actions [md-raised-button] { margin: 0 4px; } /* HEADER STYLES */ md-card-header { display: flex; flex-direction: row; height: 40px; margin: -8px 0 16px 0; } .md-card-header-text { height: 40px; margin: 0 8px; } [md-card-avatar] { height: 40px; width: 40px; border-radius: 50%; } md-card-header md-card-title { font-size: 14px; } /* TITLE-GROUP STYLES */ [md-card-sm-image], [md-card-md-image], [md-card-lg-image] { margin: -8px 0; } md-card-title-group { display: flex; justify-content: space-between; margin: 0 -8px; } [md-card-sm-image] { width: 80px; height: 80px; } [md-card-md-image] { width: 112px; height: 112px; } [md-card-lg-image] { width: 152px; height: 152px; } /* MEDIA QUERIES */ @media (max-width: 600px) { md-card { padding: 24px 16px; } [md-card-image] { width: calc(100% + 32px); margin: 16px -16px; } md-card-title-group { margin: 0; } [md-card-xl-image] { margin-left: 0; margin-right: 0; } md-card-header { margin: -8px 0 0 0; } } /* FIRST/LAST CHILD ADJUSTMENTS */ md-card > :first-child, md-card-content > :first-child { margin-top: 0; } md-card > :last-child, md-card-content > :last-child { margin-bottom: 0; } [md-card-image]:first-child { margin-top: -24px; } md-card > md-card-actions:last-child { margin-bottom: -16px; padding-bottom: 0; } md-card-actions [md-button]:first-child, md-card-actions [md-raised-button]:first-child { margin-left: 0; margin-right: 0; } md-card-title:not(:first-child), md-card-subtitle:not(:first-child) { margin-top: -4px; } md-card-header md-card-subtitle:not(:first-child) { margin-top: -8px; } md-card > [md-card-xl-image]:first-child { margin-top: -8px; } md-card > [md-card-xl-image]:last-child { margin-bottom: -8px; } /*# sourceMappingURL=card.css.map */ "],
|
97 | encapsulation: _angular_core.ViewEncapsulation.None,
|
98 | changeDetection: _angular_core.ChangeDetectionStrategy.OnPush,
|
99 | }),
|
100 | __metadata('design:paramtypes', [])
|
101 | ], MdCard);
|
102 | return MdCard;
|
103 | }());
|
104 |
|
105 |
|
106 |
|
107 |
|
108 |
|
109 |
|
110 |
|
111 |
|
112 |
|
113 |
|
114 |
|
115 |
|
116 |
|
117 | var MdCardHeader = (function () {
|
118 | function MdCardHeader() {
|
119 | }
|
120 | MdCardHeader = __decorate([
|
121 | _angular_core.Component({selector: 'md-card-header',
|
122 | template: "<ng-content select=\"[md-card-avatar]\"></ng-content> <div class=\"md-card-header-text\"> <ng-content select=\"md-card-title, md-card-subtitle\"></ng-content> </div> <ng-content></ng-content> ",
|
123 | encapsulation: _angular_core.ViewEncapsulation.None,
|
124 | changeDetection: _angular_core.ChangeDetectionStrategy.OnPush,
|
125 | }),
|
126 | __metadata('design:paramtypes', [])
|
127 | ], MdCardHeader);
|
128 | return MdCardHeader;
|
129 | }());
|
130 |
|
131 |
|
132 |
|
133 |
|
134 |
|
135 |
|
136 |
|
137 |
|
138 |
|
139 |
|
140 | var MdCardTitleGroup = (function () {
|
141 | function MdCardTitleGroup() {
|
142 | }
|
143 | MdCardTitleGroup = __decorate([
|
144 | _angular_core.Component({selector: 'md-card-title-group',
|
145 | template: "<div> <ng-content select=\"md-card-title, md-card-subtitle\"></ng-content> </div> <ng-content select=\"img\"></ng-content> <ng-content></ng-content> ",
|
146 | encapsulation: _angular_core.ViewEncapsulation.None,
|
147 | changeDetection: _angular_core.ChangeDetectionStrategy.OnPush,
|
148 | }),
|
149 | __metadata('design:paramtypes', [])
|
150 | ], MdCardTitleGroup);
|
151 | return MdCardTitleGroup;
|
152 | }());
|
153 | var MdCardModule = (function () {
|
154 | function MdCardModule() {
|
155 | }
|
156 | MdCardModule.forRoot = function () {
|
157 | return {
|
158 | ngModule: MdCardModule,
|
159 | providers: []
|
160 | };
|
161 | };
|
162 | MdCardModule = __decorate([
|
163 | _angular_core.NgModule({
|
164 | exports: [
|
165 | MdCard, MdCardHeader, MdCardTitleGroup, MdCardContent, MdCardTitle, MdCardSubtitle,
|
166 | MdCardActions
|
167 | ],
|
168 | declarations: [
|
169 | MdCard, MdCardHeader, MdCardTitleGroup, MdCardContent, MdCardTitle, MdCardSubtitle,
|
170 | MdCardActions
|
171 | ],
|
172 | }),
|
173 | __metadata('design:paramtypes', [])
|
174 | ], MdCardModule);
|
175 | return MdCardModule;
|
176 | }());
|
177 |
|
178 | exports.MdCardContent = MdCardContent;
|
179 | exports.MdCardTitle = MdCardTitle;
|
180 | exports.MdCardSubtitle = MdCardSubtitle;
|
181 | exports.MdCardActions = MdCardActions;
|
182 | exports.MdCard = MdCard;
|
183 | exports.MdCardHeader = MdCardHeader;
|
184 | exports.MdCardTitleGroup = MdCardTitleGroup;
|
185 | exports.MdCardModule = MdCardModule;
|
186 |
|
187 | Object.defineProperty(exports, '__esModule', { value: true });
|
188 |
|
189 | }))); |
\ | No newline at end of file |