Fixed a bug in positioning/sizing the vertical lines of box items

src/timeline/component/css/item.css

@@ -7,11 +7,6 @@
   background-color: #D5DDF6;
   display: inline-block;
   padding: 5px;
-
-  /* TODO: enable css transitions
-  -webkit-transition: top .4s ease-in-out, bottom .4s ease-in-out;
-  transition:         top .4s ease-in-out, bottom .4s ease-in-out;
-  /**/
 }
 
 .vis.timeline .item.selected {
@@ -70,11 +65,6 @@
   width: 0;
   border-left-width: 1px;
   border-left-style: solid;
-
-  /* TODO: enable css transitions
-  -webkit-transition: height .4s ease-in-out, top .4s ease-in-out;
-  transition:         height .4s ease-in-out, top .4s ease-in-out;
-  /**/
 }
 
 .vis.timeline .item .content {

src/timeline/component/css/itemset.css

@@ -5,11 +5,6 @@
   margin: 0;
 
   box-sizing: border-box;
-
-  /* FIXME: get transition working for rootpanel and itemset
-  -webkit-transition: height 4s ease-in-out;
-  transition:         height 4s ease-in-out;
-  /**/
 }
 
 .vis.timeline .itemset .background,
@@ -40,15 +35,3 @@
 .vis.timeline  .group:last-child {
   border-bottom: none;
 }
-
-/*
-.vis.timeline.top .group {
-  border-top: 1px solid #bfbfbf;
-  border-bottom: none;
-}
-
-.vis.timeline.bottom .group {
-  border-top: none;
-  border-bottom: 1px solid #bfbfbf;
-}
-*/

src/timeline/component/item/ItemBox.js

@@ -216,9 +216,12 @@ ItemBox.prototype.repositionY = function() {
     line.style.height = (this.parent.top + this.top + 1) + 'px';
   }
   else { // orientation 'bottom'
+    var itemSetHeight = this.parent.itemSet.props.height; // TODO: this is nasty
+    var lineHeight = itemSetHeight - this.parent.top - this.parent.height + this.top;
+
     box.style.top     = (this.parent.height - this.top - this.height || 0) + 'px';
-    line.style.top    = (this.parent.height - this.top - 1) + 'px';
-    line.style.height = this.top + 'px';
+    line.style.top    = (itemSetHeight - lineHeight) + 'px';
+    line.style.height = (lineHeight) + 'px';
   }
 
   dot.style.top = (-this.props.dot.height / 2) + 'px';