• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1:host {
2  display: inline-block;
3  position: relative;
4  border: 0;
5  background: transparent;
6  text-align: center;
7  font: inherit;
8  text-transform: uppercase;
9  outline: none;
10  border-radius: 3px;
11  -webkit-user-select: none;
12  user-select: none;
13  cursor: pointer;
14}
15
16:host(.hover:hover) {
17  background: #e4e4e4;
18}
19
20:host([raisedButton]) {
21  background: #dfdfdf;
22}
23
24:host([raisedButton].hover:hover) {
25  background: #d6d6d6;
26}
27
28:host([disabled]) {
29  background: #eaeaea !important;
30  color: #a8a8a8 !important;
31  cursor: auto;
32}
33
34#shadow-container {
35  border-radius: inherit;
36}
37
38#clip {
39  position: relative;
40  border-radius: inherit;
41  overflow: hidden;
42}
43
44/*
45#focusBg {
46  position: absolute;
47  top: 0;
48  left: 0;
49  bottom: 0;
50  right: 0;
51  opacity: 0;
52  border-radius: inherit;
53  background: #c3c3c3;
54  -webkit-transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
55  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
56}
57
58:host([focused]) #focusBg {
59  -webkit-transition: none;
60  transition: none;
61  -webkit-animation: focus-fade 0.7s infinite alternate;
62  animation: focus-fade 0.7s infinite alternate;
63}
64
65@-webkit-keyframes focus-fade {
66  0% {
67    opacity: 1;
68  }
69  100% {
70    opacity: 0;
71  }
72}
73
74@keyframes focus-fade {
75  0% {
76    opacity: 1;
77  }
78  100% {
79    opacity: 0;
80  }
81}
82*/
83
84#ripple {
85  position: absolute;
86  top: 0;
87  left: 0;
88  bottom: 0;
89  right: 0;
90  color: #d1d1d1;
91  pointer-events: none;
92}
93
94:host([raisedButton]) #ripple {
95  color: #cecece;
96}
97
98#ripple::shadow canvas {
99  top: 0;
100  left: 0;
101}
102
103#content {
104  /* needed to position the ink behind the content */
105  position: relative;
106}
107
108#icon {
109  margin: 8px;
110}
111
112#content > span {
113  display: inline-block;
114  margin: 0.5em;
115}