JSFiddle - React, Tailwind, and code Playground

by dumptyd

HTML

<link rel="stylesheet" href="https://bootswatch.com/paper/bootstrap.min.css">
<div class="container">
  <div class="fi-container">
    <input type="file" class="fi form-control">
    <div class="fi-custom">Click to upload a file</div>
  </div>
</div>

CSS

.fi-container {
  position: relative;
  margin: 100px;
}

.fi {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

.fi-custom {
  border: 1px solid #bbb;
  padding: 5px;
  text-align: center;
  cursor: pointer;
}