update components

dashboard-ui/bower_components/emby-webcomponents/toast/toast.css

@@ -0,0 +1,26 @@
+.toast {
+    position: fixed;
+    min-width: 288px;
+    box-sizing: border-box;
+    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
+    border-radius: 2px;
+    font-size: 14px;
+    cursor: default;
+    -webkit-transition: -webkit-transform .3s ease-out;
+    transition: transform .3s ease-out;
+    background: #303030;
+    color: #fff;
+    min-height: initial;
+    padding: 1em 1.5em;
+    bottom: 1em;
+    left: 1em;
+    font-size: 110%;
+    z-index: 9999999;
+    -webkit-transform: translateY(200px);
+    transform: translateY(200px);
+}
+
+    .toast.visible {
+        -webkit-transform: none;
+        transform: none;
+    }

dashboard-ui/bower_components/emby-webcomponents/toast/toast.js

@@ -1,6 +1,21 @@
-define(['paper-toast'], function () {
+define(['css!./toast'], function () {
 
-    var toastId = 0;
+    function remove(elem) {
+
+        setTimeout(function () {
+            elem.parentNode.removeChild(elem);
+        }, 300);
+    }
+
+    function animateRemove(elem) {
+
+        setTimeout(function () {
+
+            elem.classList.remove('visible');
+            remove(elem);
+
+        }, 3300);
+    }
 
     return function (options) {
 
@@ -10,16 +25,17 @@ define(['paper-toast'], function () {
             };
         }
 
-        var elem = document.createElement("paper-toast");
-        elem.setAttribute('text', options.text);
-        elem.id = 'toast' + (toastId++);
+        var elem = document.createElement("div");
+        elem.classList.add('toast');
+        elem.innerHTML = options.text;
 
         document.body.appendChild(elem);
 
-        // This timeout is obviously messy but it's unclear how to determine when the webcomponent is ready for use
-        // element onload never fires
         setTimeout(function () {
-            elem.show();
+            elem.classList.add('visible');
+
+            animateRemove(elem);
+
         }, 300);
     };
 });