timeline/css/timeline.css
changeset 102 2f1ef2ded30c
parent 98 abead2de6332
child 103 b9a417017e19
--- a/timeline/css/timeline.css	Fri Oct 04 11:26:40 2013 +0200
+++ b/timeline/css/timeline.css	Fri Oct 04 15:39:08 2013 +0200
@@ -40,6 +40,7 @@
 .Tl-UniversLabels li:before {
     content: "."; position: absolute; height: 1px; text-indent: -9999px;
     width: 760px; top: 0; background: #DEDEDE; z-index: 5;
+    background: linear-gradient(to right, rgba(220,220,220,1) 80px, rgba(220,220,220,.1) 140px );
     background: -moz-linear-gradient(to right, rgba(220,220,220,1) 80px, rgba(220,220,220,.1) 140px );
     background: -webkit-linear-gradient(left, rgba(220,220,220,1) 80px, rgba(220,220,220,.1) 140px );
 }
@@ -58,6 +59,7 @@
 
 .Tl-Grid {
     position: absolute; top: 0; bottom: 0; overflow: hidden;
+    background: linear-gradient(to right, #cccccc 0, #f8f8f8 10%, #ffffff 20%, #ffffff 80%, #f8f8f8 90%, #cccccc 100% );
     background: -moz-linear-gradient(to right, #cccccc 0, #f8f8f8 10%, #ffffff 20%, #ffffff 80%, #f8f8f8 90%, #cccccc 100% );
     background: -webkit-linear-gradient(left,  #cccccc 0, #f8f8f8 10%, #ffffff 20%, #ffffff 80%, #f8f8f8 90%, #cccccc 100% );
 }
@@ -103,6 +105,15 @@
     position: absolute; margin-left: -2px; margin-top: 8px; background: rgba(0,0,0,.9);
 }
 
+.Tl-Occurrence-Favorite {
+    position: absolute; bottom: -8px; right: -8px; width: 16px; height: 16px; background: url(../img/favstar-small.png);
+}
+
+.Tl-Occurrence-Participation {
+    position: absolute; top: -8px; right: -8px; text-align: right; line-height: 14px; font-size: 10px; color: #ffffff; background: #009e1e;
+    padding: 0 4px; border-radius: 8px; border: 1px solid #ffffff; font-weight: bold;
+}
+
 .Tl-Overlay-Container {
     position: absolute; top: 0;
 }
@@ -144,8 +155,28 @@
     min-height: 135px; font-size: 12px; position: relative;
 }
 
-.Tl-Detail-Image {
-    float: left;
+.Tl-Detail-Image-Wrapper {
+    float: left; position: relative; width: 135px; height: 135px; background: #e0e0e0;
+}
+
+.Tl-Detail-Favorite {
+    float: right; width: 20px; height: 20px; background-image: url(../img/favstars-large.png);
+}
+
+.Tl-Detail-Favorite:hover, .Tl-Detail-isFavorite {
+    background-position: -20px 0;
+}
+
+.Tl-Detail-isFavorite:hover  {
+    background-position: 0 0;
+}
+
+.Tl-Detail-Participation {
+    position: absolute; bottom: 0; right: 0; padding: 10px; background: rgba(0,0,0,.5); color: #ffffff; font-size: 12px;
+}
+
+.Tl-Participation-Icon {
+    width: 13px; height: 13px; display: inline-block; margin: 0 0 -2px 5px; background: url(../img/participation-icon.png);
 }
 
 .Tl-Detail-Title {