2 * Angular Material Design
3 * https://github.com/angular/material
7 /* mixin definition ; sets LTR and RTL within the same style call */
9 * Position a FAB button.
12 box-sizing: border-box;
14 -webkit-user-select: none;
15 -moz-user-select: none;
16 -ms-user-select: none;
21 display: inline-block;
26 background: transparent;
30 text-transform: uppercase;
34 font-variant: inherit;
36 text-decoration: none;
39 transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); }
40 .md-button *, .md-button *:before, .md-button *:after {
41 box-sizing: border-box; }
44 .md-button:hover, .md-button:focus {
45 text-decoration: none; }
46 .md-button.ng-hide, .md-button.ng-leave {
48 .md-button.md-cornered {
53 .md-button.md-icon-button {
62 .md-button.md-icon-button .md-ripple-container {
64 background-clip: padding-box;
66 -webkit-mask-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC'); }
73 vertical-align: middle;
75 background-clip: padding-box;
77 transition: 0.2s linear;
78 transition-property: background-color, box-shadow; }
79 .md-button.md-fab.md-fab-bottom-right {
85 .md-button.md-fab.md-fab-bottom-left {
91 .md-button.md-fab.md-fab-top-right {
97 .md-button.md-fab.md-fab-top-left {
102 position: absolute; }
103 .md-button.md-fab .md-ripple-container {
105 background-clip: padding-box;
107 -webkit-mask-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC'); }
108 .md-button.md-fab md-icon {
110 .md-button.md-fab.md-mini {
115 .md-toast-open-top .md-button.md-fab-top-left, .md-toast-open-top .md-button.md-fab-top-right {
116 -webkit-transform: translate3d(0, 42px, 0);
117 transform: translate3d(0, 42px, 0); }
118 .md-toast-open-top .md-button.md-fab-top-left:not([disabled]).md-focused, .md-toast-open-top .md-button.md-fab-top-left:not([disabled]):hover, .md-toast-open-top .md-button.md-fab-top-right:not([disabled]).md-focused, .md-toast-open-top .md-button.md-fab-top-right:not([disabled]):hover {
119 -webkit-transform: translate3d(0, 41px, 0);
120 transform: translate3d(0, 41px, 0); }
122 .md-toast-open-bottom .md-button.md-fab-bottom-left, .md-toast-open-bottom .md-button.md-fab-bottom-right {
123 -webkit-transform: translate3d(0, -42px, 0);
124 transform: translate3d(0, -42px, 0); }
125 .md-toast-open-bottom .md-button.md-fab-bottom-left:not([disabled]).md-focused, .md-toast-open-bottom .md-button.md-fab-bottom-left:not([disabled]):hover, .md-toast-open-bottom .md-button.md-fab-bottom-right:not([disabled]).md-focused, .md-toast-open-bottom .md-button.md-fab-bottom-right:not([disabled]):hover {
126 -webkit-transform: translate3d(0, -43px, 0);
127 transform: translate3d(0, -43px, 0); }
130 display: -webkit-flex;
131 display: -ms-flexbox;
138 .md-button-group > .md-button {
145 border-width: 1px 0px 1px 1px;
148 text-overflow: ellipsis;
149 white-space: nowrap; }
150 .md-button-group > .md-button:first-child {
151 border-radius: 2px 0px 0px 2px; }
152 .md-button-group > .md-button:last-child {
153 border-right-width: 1px;
154 border-radius: 0px 2px 2px 0px; }
156 @media screen and (-ms-high-contrast: active) {
157 .md-button.md-raised, .md-button.md-fab {
158 border: 1px solid #fff; } }