JSFiddle - React, Tailwind, and code Playground
HTML
<form method="POST" action="myurl">
<div class="b px-4 py-2 mt-4"><span class="bb">+</span> <br /><small> Drag & drop your text files here</small>
<input type="file" name="file">
</form><
CSS
/*Copied from bootstrap */
.btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: normal;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
}
/*Also */
.btn-success {
color: #fff;
background-color: #5cb85c;
border-color: #4cae4c;
}
/* This is copied from https://github.com/blueimp/jQuery-File-Upload/blob/master/css/jquery.fileupload.css */
.fileinput-button {
position: relative;
overflow: hidden;
}
/*Also*/
.fileinput-button input {
position: absolute;
top: 0;
right: 0;
margin: 0;
opacity: 0;
-ms-filter:'alpha(opacity=0)';
font-size: 200px;
direction: ltr;
cursor: pointer;
}