Improve Readme

README.md

@@ -32,14 +32,16 @@ Install:
 $ npm install --save @deltablot/dropzone
 # or with yarn:
 $ yarn add @deltablot/dropzone
+# or with bun:
+$ bun add @deltablot/dropzone
 ```
 
 First argument is an element to bind to, second argument is the [`options`](./src/options.js) object.
 
 Use as **ES6 module** (recommended):
 
 ```js
-import { Dropzone } from "dropzone";
+import { Dropzone } from "@deltablot/dropzone";
 const dropzone = new Dropzone("#elementId", { url: "/file/post" });
 ```
 
@@ -55,6 +57,14 @@ bundlers](https://github.com/dropzone/dropzone-examples)
 
 Note: this library must be used in a [secure context](https://developer.mozilla.org/en-US/docs/Web/Security/Secure_Contexts) (works only over HTTPS or locally).
 
+<hr>
+
+**CSS**
+
+```css
+@import "@deltablot/dropzone/src/dropzone";
+```
+
 ## Not using a package manager or bundler?
 
 Use the standalone files like this:

src/dropzone.scss

@@ -49,6 +49,11 @@
 
   $image-border-radius: 20px;
 
+  min-height: 150px;
+  border: 1px solid rgba(0, 0, 0, 0.8);
+  border-radius: 5px;
+  padding: 20px 20px;
+
   &.dz-clickable {
     cursor: pointer;
 
@@ -62,10 +67,7 @@
     }
   }
 
-  min-height: 150px;
-  border: 1px solid rgba(0, 0, 0, 0.8);
-  border-radius: 5px;
-  padding: 20px 20px;
+
 
   &.dz-started {
     .dz-message {
@@ -185,11 +187,11 @@
           }
         }
         &:not(:hover) {
+          overflow: hidden;
+          text-overflow: ellipsis;
           span {
             border: 1px solid transparent;
           }
-          overflow: hidden;
-          text-overflow: ellipsis;
         }
 
       }