How to customize Dropzone js?

Question

How do I customize Dropzone js? I searched for hours, but only gone in loops. I'm trying to go from this...

To something like this...

I don't need the background or any fancy styles, and the functionality already works. I Just mainly need the files to be like they are in the red box. But I don't know where to start.

Here is my main.js and css I used to style what you see in the first picture...

Dropzone.autoDiscover = false;

const myDropzone = new Dropzone("#my-dropzone", {
    url: "upload/",
    maxFiles: 2,
    maxFilesize: 20,
    acceptedFiles: '.csv, .xlsx',
    preview_image: false,
    inputLabelWithFiles: false,
    // autoProcessQueue: false,
    // uploadMultiple: True,
    // previewTemplate: '',
})

body {
    background-color: #f8f8f8;
}

.dz {
    border: dashed !important;
    border-color: #ccc !important;
    border-radius: 10px !important;
}

.dz:hover {
    background-color: aliceblue !important;
}

Answer 1

You could check this article

 new Dropzone(target, {
        ... 
        previewTemplate: previewTemplate,
        previewsContainer: "#previews",

Also, in the documentation