feat(css): css now optional

moved necessary css for hiding file input to inline styles

README.md

@@ -8,7 +8,7 @@
 [![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg)](https://conventionalcommits.org)
 [![Twitter](https://img.shields.io/twitter/url/https/github.com/alexsasharegan/vue-transmit.svg?style=social)](https://twitter.com/intent/tweet?text=Wow:&url=https%3A%2F%2Fgithub.com%2Falexsasharegan%2Fvue-transmit)
 
-A Vue.js drag & drop uploader based on Dropzone.js (`~26kB`, `~9kB` gzipped). Many thanks to [Matias Meno](https://gitlab.com/meno/dropzone/tree/master) for paving the way with the original Dropzone.js! [Check it out](https://gitlab.com/meno/dropzone/tree/master) for any of your non-vue projects. 🙌
+A Vue.js drag & drop uploader based on Dropzone.js (`~30kB`, `~10kB` gzipped). Many thanks to [Matias Meno](https://gitlab.com/meno/dropzone/tree/master) for paving the way with the original Dropzone.js! [Check it out](https://gitlab.com/meno/dropzone/tree/master) for any of your non-vue projects. 🙌
 
 ## Features
 

package.json

@@ -19,7 +19,7 @@
     "build": "npm run clean && cross-env NODE_ENV=production webpack --progress --hide-modules",
     "dev": "npm run clean && cross-env NODE_ENV=development webpack --progress --hide-modules -w",
     "test": "php -S localhost:3000 -t ./test/",
-    "lib-size": "gzip -c dist/vue-transmit.min.js | wc -c",
+    "lib-size": "gzip -c dist/vue-transmit.esm.min.js | wc -c",
     "release": "standard-version",
     "release:publish": "git push --follow-tags origin master; npm publish"
   },

src/components/VueTransmit.vue

@@ -19,7 +19,7 @@
     <input type="file"
            ref="hiddenFileInput"
            :multiple="multiple"
-           class="v-transmit__input--hidden"
+           :style="fileInputStyles"
            :class="[maxFilesReachedClass]"
            :accept="filesToAccept"
            :capture="capture"
@@ -32,15 +32,6 @@
   $drop-color:#e1f5fe;
   $drop-color-alt:#fafafa;
 
-  .v-transmit__input--hidden {
-    visibility: hidden !important;
-    position: absolute !important;
-    top: 0 !important;
-    left: 0 !important;
-    height: 0px !important;
-    width: 0px !important;
-  }
-
   .v-transmit__upload-area {
     width: 100%;
     border-radius: 1rem;
@@ -92,6 +83,14 @@ export default {
         "Accept": "application/json",
         "Cache-Control": "no-cache",
         "X-Requested-With": "XMLHttpRequest"
+      },
+      fileInputStyles: {
+        visibility: "hidden !important",
+        position: "absolute !important",
+        top: "0 !important",
+        left: "0 !important",
+        height: "0px !important",
+        width: "0px !important",
       }
     }
   },

test/index.php

@@ -21,8 +21,6 @@
           crossorigin="anonymous"></script>
   <script>
     <?= file_get_contents(__DIR__. "/../dist/vue-transmit.browser.js" ); ?>
-
-    ;Vue.use(VueTransmit)
   </script>
   <style>
     <?= file_get_contents(__DIR__. "/../dist/vue-transmit.css" ); ?>