fixed css icons - now using text-indent

diff --git a/index.php b/index.php
index 1e7a509fa8c4fa30e04a1a5e3d30cbfb30022774..aaa05bcbfa4612119116bf3e58bdfcb7c68775de 100755 (executable)
--- a/index.php
+++ b/index.php
@@ -440,7 +440,8 @@ if($GLOBALS['useflash']) echo('/<a href="?f&playlist&dir='.str_replace('%2F', '/
 class="icon ifplay">F</a>'); ?>
 </td>
 <td colspan="100%"><?=unxss($dir)?></td></tr>
-<tr><td>^</td><td>&nbsp;</td><td colspan="100%" class="directory"><span class="icon ifolder">[DIR]</span> <a href="?dir=<?=rawurlencode($parent_dir)?>">.. (<?=$parent_dir?>)</a></td></tr>
+<tr><td>^</td><td>&nbsp;</td><td colspan="100%" class="directory"><span class="icon ifolder">[DIR] </span><a href="?dir=<?=rawurlencode($parent_dir)?>">.. 
+(<?=$parent_dir?>)</a></td></tr>
 <?php
 
 $i = 0;
@@ -464,7 +465,8 @@ for($s=2;$s;$s--) { while(($item = readdir($dd)) != false) {
                        '<td><a href="#up">'.$i.'</a></td><td class="btntd"><a href="?download&playlist&dir='.$temp.'" class="icon iplay">P</a>/'.
                        '<a href="?download&recursive&playlist&dir='.$temp.'" class="icon irplay">R</a>');
                        if($GLOBALS['useflash']) echo('/<a href="?f&playlist&dir='.$temp.'" target="'.$GLOBALS['flash_player_frame'].'" class="icon ifplay">F</a>');
-                       echo('</td><td colspan="100%"><span class="icon ifolder">[DIR]</span> <a href="?dir='.$temp.'">'.unxss(str_replace('_', ' ', $item))."</a></td></tr>\n");
+                       echo('</td><td colspan="100%"><span class="icon ifolder">[DIR] </span><a href="?dir='.$temp.'">'.unxss(str_replace('_', ' ', 
+$item))."</a></td></tr>\n");
                }
 } rewinddir($dd); }
 if($sort > 1) {

diff --git a/jbx/themes/default/jukebox.css b/jbx/themes/default/jukebox.css
index 04ad2218c041219b22726dff253cf93ed1958f14..b36f12ae2171860b6ea17a3418441922191b56f2 100755 (executable)
--- a/jbx/themes/default/jukebox.css
+++ b/jbx/themes/default/jukebox.css
@@ -39,6 +39,7 @@ table {
 td {
        border: 0px solid blue;
        margin: 0px;
+       padding-left: 3px;
 }
 
 .odd * {
@@ -96,14 +97,20 @@ tr:hover * a {
 
 /* Icon Classes */
 
-*.icon { text-decoration: none; width: 16px; height: 16px; display: inline; font-size: 0; padding: 12px 16px 4px 0; margin:0; background-repeat:no-repeat; }
-*.icon, *.icon * a:hover { text-decoration: none; }
+*.icon {
+       display:inline-block; width:16px; height:16px;
+       margin:0; padding:0; overflow:hidden; 
+       text-decoration: none; text-indent: 99999px;
+       background-repeat:no-repeat; 
+}
+
+.btntd { min-width:75px; }
 
 *.iplay                { background-image: url(icons/playlist.png); }
 *.irplay       { background-image: url(icons/recursive.png); }
 *.ifplay       { background-image: url(icons/play.png); }
 *.ifstop       { background-image: url(icons/stop.png); }
-*.ifolder      { background-image: url(icons/folder.png); }
+*.ifolder      { background-image: url(icons/folder.png); margin-right: 3px; }
 *.ilogout      { background-image: url(icons/logout.png); }
 *.isearch      { background-image: url(icons/search.png); }
 *.ihome                { background-image: url(icons/home.png); }