-
Notifications
You must be signed in to change notification settings - Fork 93
/
card.component.ts
115 lines (108 loc) · 2.87 KB
/
card.component.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
import {
Component,
ViewEncapsulation,
AfterContentInit
} from '@angular/core';
import { MDL_DIRECTIVES } from '../../components';
import { PrismDirective } from './../prism/prism.component';
/* tslint:disable */
@Component({
moduleId: module.id,
selector: 'card-demo',
templateUrl: 'card.component.html',
styles: [
`
.demo-card-wide {
width: 500px;
margin-right:1rem;
}
.demo-card-wide > .mdl-card__title {
color: #fff;
height: 176px;
background: url('assets/sund.jpg') center / cover;
}
.demo-card-wide > .mdl-card__menu {
color: #fff;
}
.demo-card-square.mdl-card {
width: 320px;
height: 320px;
margin-right:1rem;
}
.demo-card-square > .mdl-card__title {
color: #fff;
background:
url('assets/wood.jpg') bottom right 15% no-repeat #46B6AC;
}
.demo-card-image.mdl-card {
width: 256px;
height: 256px;
margin-right:1rem;
background: url('assets/richter.jpg') center / cover;
}
.demo-card-image > .mdl-card__actions {
height: 52px;
padding: 16px;
background: rgba(0, 0, 0, 0.2);
}
.demo-card-image__filename {
color: #fff;
font-size: 14px;
font-weight: 500;
}
.demo-card-event.mdl-card {
width: 256px;
height: 256px;
margin-right:1rem;
background: url('http://r.bstatic.com/static/affiliate_base/img/banners/branded_set_2/200x200/e2ba08df23df8354ed950047c69537ba7a3bb73f.jpg') center / cover;
}
.demo-card-event > .mdl-card__actions {
border-color: rgba(255, 255, 255, 0.2);
}
.demo-card-event > .mdl-card__title {
align-items: flex-start;
}
.demo-card-event > .mdl-card__title > h4 {
margin-top: 0;
}
.demo-card-event > .mdl-card__actions {
display: flex;
box-sizing:border-box;
align-items: center;
}
.demo-card-event > .mdl-card__actions > .material-icons {
padding-right: 10px;
}
.demo-card-event > .mdl-card__title,
.demo-card-event > .mdl-card__actions,
.demo-card-event > .mdl-card__actions > .mdl-button {
color: #fff;
}
.example-separator {
clear: both;
margin-bottom: 1rem;
}
`
],
directives: [
MDL_DIRECTIVES,
PrismDirective
],
encapsulation: ViewEncapsulation.None
})
/* tslint:enable */
export class CardDemo implements AfterContentInit {
public ngAfterContentInit() {
(function(d, sc, u) {
var s: any = d.createElement(sc), p: any = d.getElementsByTagName(sc)[0];
s.type = 'text/javascript';
s.async = true;
s.src = u + '?v=' + (+new Date());
p.parentNode.insertBefore(s, p);
})(document, 'script', '//aff.bstatic.com/static/affiliate_base/js/flexiproduct.js');
}
public booknow() {
let url = 'http://www.booking.com/index.html?aid=818140';
window.open(url);
}
}