|
26 | 26 | } |
27 | 27 | } |
28 | 28 |
|
29 | | -// Support for toastr plugin (in material they are snackbars) |
30 | | -// http://codeseven.github.io/toastr/ |
| 29 | +// Support for SnackbarJS plugin |
| 30 | +// https://github.com/FezVrasta/snackbarjs |
31 | 31 |
|
32 | 32 | .snackbar { |
33 | | - display: inline-block; |
34 | | - position: fixed; |
35 | | - z-index: 99999; |
36 | | - left: 20px; |
37 | | - bottom: 0; |
38 | | - min-width: 288px; |
39 | | - max-width: 568px; |
40 | | - padding: 14px 15px; |
41 | | - margin-bottom: 20px; |
42 | | - |
| 33 | + // Style |
| 34 | + background-color: #323232; |
43 | 35 | color: @darkbg-text; |
44 | 36 | font-size: 14px; |
45 | | - background-color: #323232; |
46 | 37 | border-radius: 2px; |
47 | 38 | .shadow-z-1; |
48 | 39 |
|
49 | | - opacity: 0; |
50 | | - -webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in; |
51 | | - transition: transform 0.2s ease-in-out, opacity 0.2s ease-in; |
52 | | - |
| 40 | + // Animation |
| 41 | + height: 0; |
| 42 | + -moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s; |
| 43 | + -webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s; |
| 44 | + transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, padding 0 linear 0.2s, height 0 linear 0.2s; |
| 45 | + -moz-transform: translateY(200%); |
53 | 46 | -webkit-transform: translateY(200%); |
54 | 47 | transform: translateY(200%); |
55 | | - |
56 | 48 | } |
57 | 49 |
|
58 | 50 | .snackbar.snackbar-opened { |
59 | | - opacity: 1; |
| 51 | + // Style |
| 52 | + padding: 14px 15px; |
| 53 | + margin-bottom: 20px; |
| 54 | + |
| 55 | + // Animation |
| 56 | + height: auto; |
| 57 | + -moz-transition: -moz-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s; |
| 58 | + -webkit-transition: -webkit-transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s; |
| 59 | + transition: transform 0.2s ease-in-out, opacity 0.2s ease-in, height 0 linear 0.2s, height 0 linear 0.2s; |
| 60 | + -moz-transform: none; |
60 | 61 | -webkit-transform: none; |
61 | 62 | transform: none; |
62 | 63 | } |
63 | | - |
64 | | -.snackbar.toast { |
65 | | - border-radius: 200px; |
66 | | -} |
0 commit comments