css/playscreen.css
changeset 22 4e1e66b2fdf1
parent 20 8b0a464fb5ac
child 24 b557f4bae85f
--- a/css/playscreen.css	Mon Apr 22 18:42:40 2013 +0200
+++ b/css/playscreen.css	Wed Apr 24 17:54:48 2013 +0200
@@ -45,11 +45,15 @@
 }
 
 .lock-button {
-	width: 36px; background-position: -36px -54px;
+	width: 72px; height: 24px; margin: 3px 4px; background-position: -36px -42px;
 }
 
-.lock-button.locked {
-	background-position: -36px -36px;
+.lock-button.locked, .lock-button:hover {
+	background-position: -36px -18px;
+}
+
+.lock-button.locked:hover {
+    background-position: -36px -42px;
 }
 
 .duration, .time-separator, .current-time {
@@ -61,7 +65,7 @@
 	width: 6px; text-align: center;
 }
 .duration, .current-time {
-	width: 120px; margin: 0 8px;
+	width: 100px; margin: 0 8px;
 }
 .current-time {
 	text-align: right; color: #CCCCCC;
@@ -93,7 +97,7 @@
 }
 
 .home-button {
-	background-position: -36px -18px;
+	background-position: -72px 0;
 }
 
 .play-canvas {
@@ -159,20 +163,21 @@
 
 .play-localtweets {
     left: 390px;
+    width: 450px;
     position: absolute;
     z-index: 2;
 }
 
-.play-localtweets .tweet {
-	width: 320px; background: #666666; padding: 4px;
+.tweet {
+    background: #666666; padding: 4px; min-height: 32px;
 }
 
 .tweet img {
-	width: 20px; height: 20px; float: left;
+	width: 32px; height: 32px; float: left;
 }
 
 .tweet p {
-	margin-left: 24px; font-size: 12px;
+	margin-left: 36px; font-size: 15px; text-shadow: 0 0 2px #000000; line-height: 16px;
 }
 
 .tweet a {
@@ -180,49 +185,46 @@
 }
 
 .play-tagcloud {
-	left: 720px;
+	right: 0;
 	top: 5px;
     position: absolute;
-    width: 296px;
+    width: 140px;
 }
 
 .play-tagcloud li {
     cursor: pointer;
-    float: left;
-    height: 16px;
-    line-height: 16px;
+    height: 20px;
+    padding: 3px 0;
     text-align: center;
-    width: 98px;
-    display: inline-block;
-    margin-bottom: -6px;
 }
 
 .play-tagcloud li.selected {
 	background: #FFFF00; color: #000000;
 }
 
-.play-tagcloud li:nth-child(3n+2) {
-	margin-top: 5px;
-}
-
-.play-tagcloud li:nth-child(3n) {
-	margin-top: 10px;
-}
-
 .user-tweets {
-	position: absolute; left: 730px; top: 300px; bottom: 0; right: 0; display: none;
+	position: absolute; left: 420px; top: 40px; bottom: 40px; right: 60px; display: none;
+	background: rgba(64,64,64,.8); border-radius: 10px; z-index: 4; box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
 }
 
 .user-tweets-head {
-	font-size: 14px; text-align: center;
+	font-size: 14px; text-align: center; margin: 10px 0 0;
 }
 
 .user-tweets-list {
-	position: absolute; left: 0; top: 20px; bottom: 0; right: 0; overflow: auto;
+	position: absolute; left: 10px; top: 30px; bottom: 10px; right: 10px; overflow: auto;
+}
+
+.close-user-tweets {
+    float: right; font-size: 20px; font-weight: bold; margin: 5px; text-decoration: none; color: #FFFFFF;
 }
 
 .user-tweets-list .tweet {
-	background: #666666; font-size: 12px; padding: 4px; margin: 5px 0;
+	margin-bottom: 10px; cursor: hand;
+}
+
+.user-tweets-list .tweet:hover {
+    background: #808080; cursor: pointer;
 }
 
 .user-name {