diff options
-rw-r--r-- | index.php | 20 | ||||
-rw-r--r-- | style.css | 47 |
2 files changed, 37 insertions, 30 deletions
@@ -52,6 +52,13 @@ function classify($root, $dirname, $filename) { if ($filename === '..') { return [ [ 'dir', 'parent' ], $stat]; } $classes = array(); + + if (stat_is_link($stat)) { + $classes[] = 'link'; + $lstat = $stat; + $stat = stat($filepath); + } + if ($parts == 0) { // in the top-level if (stat_is_dir($stat) && is_dir($filepath.'/os')) { @@ -70,7 +77,6 @@ function classify($root, $dirname, $filename) { } } if ($filename[0] === '.' || substr($filename, -1) === '~') { $classes[] = 'hidden'; } - if (stat_is_link($stat)) { $classes[] = 'link'; } if (stat_is_dir( $stat)) { $classes[] = 'dir'; } if (stat_is_file($stat)) { $classes[] = 'file'; } @@ -78,6 +84,9 @@ function classify($root, $dirname, $filename) { if (preg_match("/\.tar(\..z|\.bz2)?$/", $filename) == 1) { $classes[] = 'tar'; } $classes[] = pathinfo($filename, PATHINFO_EXTENSION); + if (isset($lstat)) { + $stat = $lstat; + } return [ $classes, $stat ]; } @@ -143,11 +152,14 @@ if (!is_dir($root.'/'.$dirname)) { if ($filename === '..' && is_root($root,$dirname)) { continue; } list($classes, $stat) = classify($root, $dirname, $filename); echo "\t\t\t\t<tr class=\"".implode(' ', $classes)."\">"; + + echo "<td>"; + echo "<a href=\"".htmlentities($filename)."\">".htmlentities($filename)."</a>"; if (stat_is_link($stat)) { - echo "<td><a href=\"".htmlentities($filename)."\">".htmlentities($filename)."</a> -> ".htmlentities(readlink($root.'/'.$dirname.'/'.$filename))."</td>"; - } else { - echo "<td><a href=\"".htmlentities($filename)."\">".htmlentities($filename)."</a></td>"; + $target = readlink($root.'/'.$dirname.'/'.$filename); + echo " -> <a href=\"".htmlentities($target)."\">".htmlentities($target)."</a>"; } + echo "</td>"; if ($filename === '..') { echo '<td></td><td></td>'; @@ -19,42 +19,37 @@ td.number { text-align: right; } -td a { - margin-left: 20px; -} - tr:hover { box-shadow: inset 0 0 0 1px #bcd; } -td a:before { +/* Make room for a 16x16 icon on the left, with 4px padding between it + * and the text. */ +td a:first-of-type { + margin-left: 20px; +} +td a:first-of-type::before { width: 16px; height: 16px; margin-left: -20px; margin-right: 4px; } -/* inode */ - +/* generic inode information ---------------------------------------- */ tr.hidden { /*opacity: 0.5;*/ display: none; } - -tr.link a:before { content: url("link.png"); } - -tr.dir a:after { content: "/"; } -tr.dir a:before { content: url("dir.png"); } -tr.dir.parent a:before { content: url("parent.png"); } - -tr.file a:before { content: url("file.png"); } - -/* domain */ - -tr.dir.repo a:before { content: url("repo.png"); } -tr.file.pkg.tar a:before { content: url("pkg.png"); } -tr.file.iso a:before { content: url("iso.png"); } -tr.file.tar a:before { content: url("tar.png"); } -tr.file.txt a:before { content: url("txt.png"); } -tr.file.torrent a:before { content: url("torrent.png"); } - +tr.dir a::after { content: "/"; } +tr.dir a:first-of-type::before { content: url("dir.png"); } +tr.dir.parent a:first-of-type::before { content: url("parent.png"); } +tr.link a:first-of-type::before { content: url("link.png"); } +tr.file a:first-of-type::before { content: url("file.png"); } +/* domain-specific information -------------------------------------- */ +tr.dir.repo a:first-of-type::before { content: url("repo.png"); } tr.arch td { background:#7fc3e5; } tr.para td { background:#9fa6e3; } -tr.community {} +tr.community { /* TODO: we should indicate this somehow */ } +/* file extension information --------------------------------------- */ +tr.file.pkg.tar a:first-of-type::before { content: url("pkg.png"); } +tr.file.iso a:first-of-type::before { content: url("iso.png"); } +tr.file.tar a:first-of-type::before { content: url("tar.png"); } +tr.file.txt a:first-of-type::before { content: url("txt.png"); } +tr.file.torrent a:first-of-type::before { content: url("torrent.png"); } |