filewiz css

by Mladen Mihajlovic

HTML

<!-- Title -->
<div class="Border">
  <table id="TitleTable">
    <tr id="Title">
      <td>FileWiz <span id="Version">v1.0</span></td>
    </tr>
    <tr id="SubTitle">
      <td>(c) 2005 Mladen Mihajlovic. All rights reserved.</td>
    </tr>
  </table>
</div>
<br />
<!-- /Title -->

<div class="Border">
  <table class="FileList">
    <caption>
      <div style="float:right;display:inline;"><select>
          <option>Select Action</option>
          <option>Rename File</option>
          <option>Delete File(s)</option>
        </select></div>Listing for
    </caption>
    <thead>
      <tr>

        <th class="icon"><a href="index.php?path=&sort=" title="Go up a directory"><img src="themes/images/dir_up.gif"></a></th>
        <th><a href="index.php?path=&sort=name">Name</a></th>
        <th><a href="index.php?path=&sort=size">Size</a></th>
        <th><a href="index.php?path=&sort=modified">Modified</a></th>
        <th class="permissions">Permissions</th>
        <th class="selector"><input type="checkbox" id="" name="selectedFile" checked="true"></th>
      </tr>
    </thead>
    <tbody>
      <!-- -->
      <tr>
        <td class="icon"><img src="themes/images/dir.gif"></td>
        <td><a href="index.php?path=<?=$item->path?>&sort=<?=$sort?>">NAME</a></td>
        <td>2,232 Kb</td>
        <td class="date">2019-01-01</td>
        <td class="permissions">xrrd</td>
        <td class="selector"></td>


      </tr>

    </tbody>
    <tfoot>
      <tr>
        <td colspan="6"><?=count($items)?> items(s) listed</td>
      </tr>
    </tfoot>
  </table>
</div>
<br />
<div class="Border">
  <table class="FormPanel">
    <caption>Extra Functions</caption>
    <tbody>
      <tr>
        <td id="Panel1">
          <form>Upload a file to this directory:<br />
            <input type="hidden" name="path" value="<?=$path?>">
            <input type="hidden" name="action" value="upload">
            <input type="file" class="FileInput"><br />
            <input type="submit"...

CSS

body {
  font-family: "Trebuchet MS";
  font-size: 10pt;
}

td {
  font-size: 10pt;
}

#input {
  border: 1px solid #4C77B6;
  color: #000;
  background: #DFE6EF;

}

.Border {
  border: 1px solid #072A66;
  padding: 1px;
  width: 100%;
}

#TitleTable {
  border-collapse: collapse;
  border: 1px solid #fff;
  width: 100%;
}

#Title td {
  color: #fff;
  background: #527CB4;
  padding: 5px;
  border: 1px solid #fff;
  margin: 0px;
  font-size: 25pt;
  font-style: italic;
  font-weight: bold;
  width: auto;
  background: linear-gradient(0deg, #5176B6 0%, #77B0F2 100%);
}

#SubTitle td {
  padding: 5px;
  color: #3A4F6C;
  b----ackground: #CBD5E5;
  background: linear-gradient(0deg, #B3C1D8 0%, #D2DBE8 100%);
  border: 1px solid #fff;
  text-align: right;
  font-style: italic;
}

#Version {
  font-size: 8pt;
  font-weight: normal;
}

.Box {
  color: #333;
  background: #E4EAF2;
  padding: 5px;
  border: 1px solid #fff;
}

.FormPanel {
  border-collapse: collapse;
  color: #333;
  background: #E4EAF2;
  border: 1px solid #fff;
  width: 100%;
}

.FormPanel caption {
  color: #fff;
  text-align: left;
  vertical-align: middle;
  background: #6492D3;
  font-weight: bold;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #5176B5;
  padding: 5px;
  filter: progid:DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr=#5278B7, endColorStr=#6899DA);
}

.FormPanel td {
  padding: 5px;
  border: 1px solid #fff;
}

.FormPanel #Panel1 {
  width: 50%;
}

.FormPanel .FileInput {
  width: 100%;
}

.FileList {
  font-size: 10pt;
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #fff;
}

.FileList caption {
  color: #fff;
  text-align: left;
  vertical-align: middle;
  background: #6492D3;
  font-weight: bold;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #5176B5;
  padding: 5px;
  filter:...