Merge pull request #25 from unicef-polymer/develop

Develop - Expose fitInto for toast msg and fix layout issue
unicef-polymer · Aug 11, 2017 · 66a603d · 66a603d
2 parents 4a981b4 + 21eca03
commit 66a603d
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 6 deletions.
diff --git a/bower.json b/bower.json
@@ -1,7 +1,7 @@
 {
   "name": "etools-file",
   "description": "This element will allow you to select and prepare the files you are gonna upload.",
-  "version": "1.2.3",
+  "version": "1.2.4",
   "license": "https://github.com/unicef-polymer/etools-file/blob/master/LICENSE.md",
   "main": "etools-file.html",
   "dependencies": {

diff --git a/etools-file.html b/etools-file.html
@@ -51,7 +51,9 @@
 
   <template>
     <style include="etools-file-style additional-columns-displayed-style">
-
+      .toast-style {
+        min-width: 330px;
+      }
     </style>
 
     <paper-input-container always-float-label disabled$="[[disabled]]" invalid$="[[invalid]]">
@@ -166,7 +168,7 @@
 
     </paper-input-container>
 
-    <paper-toast id="fileAlreadySelectedToast" always-on-top></paper-toast>
+    <paper-toast class="toast-style" id="fileAlreadySelectedToast" fit-into="[[toastFitInto]]" always-on-top></paper-toast>
 
   </template>
 
@@ -271,7 +273,8 @@
           hideDeleteBtn: {
             type: Boolean,
             reflectToAttribute: true,
-          }
+          },
+          toastFitInto: Object
         },
 
         observers: [
@@ -453,7 +456,7 @@
 
         _displayAlreadySelectedWarning: function(filesAlreadySelected) {
           // show a warning with the already selected files
-          var toastWarningMessage = '<p><strong>The following file are already selected:</strong><p>';
+          var toastWarningMessage = '<p><strong>The following files are already selected:</strong><p>';
           filesAlreadySelected.forEach(function(alreadySelectedFile) {
             toastWarningMessage += '<p>' + alreadySelectedFile.file_name + '</p>';
           });

diff --git a/style/additional-columns-displayed-style.html b/style/additional-columns-displayed-style.html
@@ -15,7 +15,7 @@
 
       }
       :host([activate-file-types][show-upload-date]) .file-name-wrapper {
-        width: calc(100% - 375px);
+        width: calc(100% - 385px);
         padding-right: 15px;
         box-sizing: border-box;
       }