--- a/css/playscreen.css Tue Mar 19 12:27:34 2013 +0100
+++ b/css/playscreen.css Thu Mar 21 18:48:12 2013 +0100
@@ -16,20 +16,31 @@
}
.play-block {
- width: 248px; height: 30px;
+ width: 402px; height: 30px;
+}
+
+.play-button, .next-button {
+ float: left; width: 30px; margin: 5px; font-size: 18px;
+ line-height: 20px; height: 20px; cursor: pointer;
}
-.play-button {
- float: left; margin: 5px; font-size: 18px;
- line-height: 20px;
+.duration, .time-separator, .current-time {
+ float: left; height: 30px;
+ font-size: 20px; line-height: 30px;
}
-.duration {
- float: right; font-size: 20px; margin: 0 8px; line-height: 30px;
+.time-separator {
+ width: 10px; text-align: center;
+}
+.duration, .current-time {
+ width: 140px; margin: 0 8px;
+}
+.current-time {
+ text-align: right; color: #CCCCCC;
}
.explain-block {
- width: 494px; height: 30px; padding: 0 5px;
+ width: 340px; height: 30px; padding: 0 5px;
}
.keyword-search {
@@ -50,11 +61,7 @@
}
.play-bottom {
- position: absolute; top: 86px; bottom: 8px; overflow: hidden; width: 100%;
-}
-
-.play-dataviz {
- float: left; height: 672px; width: 100%; position: relative; margin-left: 8px; overflow: hidden;
+ position: absolute; left: 8px; top: 86px; bottom: 8px; right: 8px; overflow: hidden;
}
.play-svg {
@@ -129,3 +136,15 @@
margin-top: 10px;
}
+.local-position, .global-position {
+ position: absolute; height: 1px;
+ background: #FF00FC;
+}
+
+.global-position {
+ left: 0; width: 125px;
+}
+
+.local-position {
+ left: 155px; width: 215px;
+}