| @@ -26,15 +26,16 @@ | ||
| 26 | 26 | border-radius: 10px; |
| 27 | 27 | box-shadow: 0 2px 5px rgba(0,0,0,.20); |
| 28 | 28 | } |
| 29 | 29 | .vbo-toast-wrapper .toast-message-content.error { |
| 30 | - background-color: rgba(153, 0, 0, 0.20) | |
| 30 | + background-color: rgba(153, 0, 0, 0.90); | |
| 31 | + color: #ddd !important; | |
| 31 | 32 | } |
| 32 | 33 | .vbo-toast-wrapper .toast-message-content.success { |
| 33 | - background-color: rgba(112, 204, 135, 0.40); | |
| 34 | + background-color: rgba(112, 204, 135, 0.90); | |
| 34 | 35 | } |
| 35 | 36 | .vbo-toast-wrapper .toast-message-content.warning { |
| 36 | - background-color: rgba(224, 137, 80, 0.35); | |
| 37 | + background-color: rgba(224, 137, 80, 0.90); | |
| 37 | 38 | } |
| 38 | 39 | .vbo-toast-wrapper .toast-message-content.notice { |
| 39 | 40 | background-color: #fff; |
| 40 | 41 | } |
| @@ -41,9 +42,10 @@ | ||
| 41 | 42 | |
| 42 | 43 | /* toast hidden positions */ |
| 43 | 44 | .vbo-toast-wrapper.top-left, |
| 44 | 45 | .vbo-toast-wrapper.top-center, |
| 45 | -.vbo-toast-wrapper.top-right { | |
| 46 | +.vbo-toast-wrapper.top-right, | |
| 47 | +.vbo-toast-wrapper.center-center { | |
| 46 | 48 | /* |
| 47 | 49 | Use a higher margin to avoid seeing the toast on |
| 48 | 50 | browsers (like Safari) that lets the user to scroll |
| 49 | 51 | even if the page reached the end. |
| @@ -59,9 +61,10 @@ | ||
| 59 | 61 | .vbo-toast-wrapper.top-right, |
| 60 | 62 | .vbo-toast-wrapper.bottom-right { |
| 61 | 63 | right: 10px; |
| 62 | 64 | } |
| 63 | -.vbo-toast-wrapper.top-center { | |
| 65 | +.vbo-toast-wrapper.top-center, | |
| 66 | +.vbo-toast-wrapper.center-center { | |
| 64 | 67 | left: 50%; |
| 65 | 68 | transform: translate(-50%, -100%); |
| 66 | 69 | } |
| 67 | 70 | |
| @@ -75,8 +78,12 @@ | ||
| 75 | 78 | left: 50%; |
| 76 | 79 | transform: translate(-50%, 100%); |
| 77 | 80 | } |
| 78 | 81 | |
| 82 | +.vbo-toast-wrapper.center-center { | |
| 83 | + opacity: 0; | |
| 84 | +} | |
| 85 | + | |
| 79 | 86 | /* toast slide-in positions */ |
| 80 | 87 | |
| 81 | 88 | .vbo-toast-wrapper.top-left.toast-slide-in, |
| 82 | 89 | .vbo-toast-wrapper.top-center.toast-slide-in, |
| @@ -95,8 +102,14 @@ | ||
| 95 | 102 | .vbo-toast-wrapper.bottom-center.toast-slide-in { |
| 96 | 103 | transform: translate(-50%, 0%); |
| 97 | 104 | } |
| 98 | 105 | |
| 106 | +.vbo-toast-wrapper.center-center.toast-slide-in { | |
| 107 | + top: 50%; | |
| 108 | + transform: translate(-50%, -50%); | |
| 109 | + opacity: 1; | |
| 110 | +} | |
| 111 | + | |
| 99 | 112 | /* shake effect */ |
| 100 | 113 | |
| 101 | 114 | .vbo-toast-wrapper.do-shake { |
| 102 | 115 | backface-visibility: hidden; |
| @@ -184,5 +197,5 @@ | ||
| 184 | 197 | font-weight: 500; |
| 185 | 198 | } |
| 186 | 199 | .vbo-pushnotif-wrapper .push-notif-text .push-notif-title + .push-notif-body { |
| 187 | 200 | margin-top: 5px; |
| 188 | -} | |
| 201 | +} | |
