make pos-labels centered over their gridline, and more compact

GMOD · Mar 1, 2012 · 75b211a · 75b211a
1 parent 3f416f7
commit 75b211a
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 5 deletions.
diff --git a/genome.css b/genome.css
@@ -111,10 +111,10 @@ div.gridline {
 
 div.pos-label {
     position: absolute;
-    left: 0px;
-    background-color: #ddd;
+    left: -0.35em;
+    top: 0px;
     z-index: 100;
-    padding: 4px;
+    margin: 1px;
     font-family: sans-serif;
 }
 

diff --git a/js/StaticTrack.js b/js/StaticTrack.js
@@ -15,9 +15,10 @@ StaticTrack.prototype.fillBlock = function(blockIndex, block,
 					   leftBase, rightBase, scale,
 					   padding, stripeWidth) {
     var posLabel = document.createElement("div");
+    var numtext = Util.addCommas( leftBase );
     posLabel.className = this.labelClass;
-    posLabel.appendChild(document.createTextNode(Util.addCommas(leftBase)));
-    posLabel.style.top = "0px";// y + "px";
+    posLabel.style.left = "-" + Number(numtext.length)/1.7 + "ex";
+    posLabel.appendChild( document.createTextNode( numtext ) );
     block.appendChild(posLabel);
     this.heightUpdate(this.posHeight, blockIndex);
 };