JSFiddle - React, Tailwind, and code Playground

by Imri Paloja

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">

<div class="container">

  <table>
    <caption>
      Your uploaded files, and files you have access too
    </caption>
    <thead>
      <tr>
        <th scope="col">
          <label for="files_upload">
                    <input type="file" id="files" multiple="" hidden="">
                    <label onclick="choose_files()" for="files" class="file-btn"></label>
                    <span id="file-names"></span>
                    <button onclick="files_upload()">Upload</button>
                </label>
        </th>
        <th scope="col">
          <label for="FileTypeFilter">
                    <select id="FILE_TYPE" name="FILE_TYPE"><option value="*" id="all" onclick="Filter()" selected="" title="FileType">all file types</option>
	<option value="png" id="png" onclick="Filter('png')">png</option>
	
	<option value="avif" id="avif" onclick="Filter('avif')">avif</option>
	
	<option value="jpeg" id="jpeg" onclick="Filter('jpeg')">jpeg</option>
	
	<option value="vnd.oasis.opendocument.text" id="vnd.oasis.opendocument.text" onclick="Filter('vnd.oasis.opendocument.text')">vnd.oasis.opendocument.text</option>
	
	<option value="vnd.oasis.opendocument.presentation" id="vnd.oasis.opendocument.presentation" onclick="Filter('vnd.oasis.opendocument.presentation')">vnd.oasis.opendocument.presentation</option>
	
	<option value="vnd.oasis.opendocument.spreadsheet" id="vnd.oasis.opendocument.spreadsheet" onclick="Filter('vnd.oasis.opendocument.spreadsheet')">vnd.oasis.opendocument.spreadsheet</option>
	
	<option value="json" id="json" onclick="Filter('json')">json</option>
	
	<option value="vnd.oasis.opendocument.graphics" id="vnd.oasis.opendocument.graphics"...

CSS

html, body {
  color: #454545 !important;
}

table {
  width: 100% ;
}

.container {
  margin-top: 5% !important;
}