some player styling

2 files changed, 22 insertions, 17 deletions

diff --git a/apps/media/css/music.css b/apps/media/css/music.css
index eef300c63fa..f8e41064fd8 100644
--- a/apps/media/css/music.css
+++ b/apps/media/css/music.css
@@ -1,8 +1,8 @@
-#folderlist li { margin-bottom:10px; }
-#folderlist button.prettybutton { font-size:1em; width:10ex; }
+#folderlist li { margin-bottom:1em; }
+#folderlist button.prettybutton { font-size:1em; width:10em; }
 li button.right.prettybutton { font-size:1em; }
-#collection { padding-top:1em; position:relative; width:70ex; float:left; }
-#collection li.album,#collection li.song { margin-left:3ex; }
+#collection { padding-top:1em; position:relative; width:70em; float:left; }
+#collection li.album,#collection li.song { margin-left:3em; }
 #leftcontent img.remove { display:none; float:right; cursor:pointer; }
 #leftcontent li:hover img.remove { display:inline; }
 #collection li button { float:right; }
@@ -10,7 +10,7 @@ li button.right.prettybutton { font-size:1em; }
 .template { display:none; }
 
 #collection li { padding-right:10px; }
-#searchresults input.play, #searchresults input.add { float:right; height:16px; width:16px; }
+#searchresults input.play, #searchresults input.add { float:left; height:1em; width:1em; }
 #collection tr.collapsed td.album, #collection tr.collapsed td.title { color:#ddd; }
 a.expander { float:right; display:block; }
-tr.active { background-color:#ccc; }
+tr.active { background-color:#eee; }
diff --git a/apps/media/css/player.css b/apps/media/css/player.css
index 0074bf9b9a4..98a76e82f0d 100644
--- a/apps/media/css/player.css
+++ b/apps/media/css/player.css
@@ -1,11 +1,16 @@
-#controls ul.jp-controls{ padding:0; }
-#controls ul.jp-controls li{ display:inline; }
-div.jp-progress{position:absolute;overflow:hidden;background-color:#293b51;top:1em;left:10em;width:15em;height:1.2em;}
-div.jp-seek-bar{background:url("../img/jplayer.blue.monday.png") 0 -202px repeat-x;width:0;height:100%;cursor:pointer;}
-div.jp-play-bar{background:url("../img/jplayer.blue.monday.png") 0 -218px repeat-x;width:0;height:100%;}
-div.jp-seeking-bg{background:url("../img/pbar-ani.gif");}
-a.jp-mute,a.jp-unmute{height:1.2em;width:1.5em;top:1em;left:26em;}
-div.jp-volume-bar{position:absolute;overflow:hidden;background:url("../img/jplayer.blue.monday.png") 0 -250px repeat-x;width:4em;height:0.4em;cursor:pointer;top:1.3em;left:28em;}
-div.jp-volume-bar-value{background:url("../img/jplayer.blue.monday.png") 0 -256px repeat-x;width:0;height:0.4em;}
-div.jp-current-time,div.jp-duration{position:absolute;font-size:.64em;font-style:oblique;top:1em;left:16.8em;width:22em;}
-div.jp-duration{text-align:right;}
+#controls ul.jp-controls { padding:0; }
+#controls ul.jp-controls li { display:inline; }
+#controls ul.jp-controls li a { position:absolute; padding:.8em 1em; }
+a.jp-play, a.jp-pause { left:2.5em; }
+a.jp-next { left:5em; }
+
+div.jp-progress { position:absolute; overflow:hidden; top:.5em; left:8em; width:15em; height:1.2em; padding:0; }
+div.jp-seek-bar { background:#eee; width:0; height:100%; cursor:pointer; }
+div.jp-play-bar { background:#ccc; width:0; height:100%; }
+div.jp-seeking-bg { background:url("../img/pbar-ani.gif"); }
+div.jp-current-time,div.jp-duration { position:absolute; font-size:.64em; font-style:oblique; top:1em; left:13.5em; width:22em; }
+div.jp-duration { text-align:right; }
+
+a.jp-mute,a.jp-unmute { left:24em; }
+div.jp-volume-bar { position:absolute; overflow:hidden; background:#eee; width:4em; height:0.4em; cursor:pointer; top:1.3em; left:27em; }
+div.jp-volume-bar-value { background:#ccc; width:0; height:0.4em; }