Support for meta-data columns in templates

Change-Id: I09a404ed53a55ee1ac40c0b41f8fd56f8dcbafed
diff --git a/dev/scss/main/kwic-new.scss b/dev/scss/main/kwic-new.scss
index 670897a..de6bcf3 100644
--- a/dev/scss/main/kwic-new.scss
+++ b/dev/scss/main/kwic-new.scss
@@ -2,6 +2,7 @@
 @import "../util";
 
 $border-size: 2px;
+$font-size: 10pt;
 
 #search {
   position: relative;
@@ -20,7 +21,7 @@
   margin: 0;
   padding: 0;
   border: 1px solid $kwic-border;
-  font-size: 10pt;
+  font-size: $font-size;
 
   > li {
     display: table-row;
@@ -33,15 +34,22 @@
       overflow-y: visible;
       white-space: nowrap;
       background-color: $light-green;
+      // border-top: 1px solid lighten($light-green, 10%);
+      border: {
+        color: $dark-green;
+        style: solid;
+        width: 1px 0;
+      }
       color: $nearly-white;
       font-size: 80%;
       padding: 0 5pt;
     }
-/*
     &:first-of-type div.meta {
-      background-color: blue;
+      border-top-width: 0;
     }
-*/
+    &:last-of-type div.meta {
+      border-bottom-width: 0;
+    }
   }
 }
 
@@ -56,6 +64,7 @@
 #search {
   div.meta, div.match-main {
     position: relative;
+	  cursor: pointer;
   }
   /*
 	    &:not(.active):not(:target) {
@@ -71,7 +80,6 @@
 	    overflow-x: hidden;
 	    overflow-y: visible;
 	    white-space: normal;
-	    cursor: pointer;
     }
   }
 }
@@ -85,7 +93,9 @@
 	text-overflow: ellipsis;
 	text-indent: 0;
 	text-shadow: $light-shadow;
+  font-size: 0;
   > span, mark {
+    font-size: $font-size;
 	  padding: 5pt 0 6pt 0;
     white-space: no-wrap !important;
     > span {
@@ -94,6 +104,8 @@
   }
   > mark, > span.match {
     font-weight: bold;
+    color: $black;
+    text-shadow: none;
     padding-left: 4pt;
     padding-right: 2pt;
   }
@@ -216,7 +228,7 @@
 	      left: 0; // 5pt margin-top
 	    }
 	    > span {
-        color: black;
+        // color: black;
         line-height: 1.4em;
         width: auto;
         &.context-left {
@@ -250,7 +262,7 @@
   }
   p.ref {
     display: block;
-	  color: white;
+	  color: $nearly-white;
 	  padding: 3pt 10pt 3pt 3pt;
 	  padding-right: $right-match-distance;
 	  margin: 0pt;
@@ -343,7 +355,7 @@
   display: none;
   //  background-color: $dark-orange;
   font-size: 12pt;
-  color: white;
+  color: $nearly-white;
   text: {
     shadow: none;
     indent: 0;
@@ -358,6 +370,7 @@
   }
   &.right {
     position: absolute;
+    z-index: 4;
     width: $right-match-distance;
     float: right;
     text-align: center;
@@ -367,7 +380,7 @@
     top: 0;
     li {
       cursor: pointer;
-      color: white;
+      color: $nearly-white;
       text-decoration: none;
 
       > span {
diff --git a/dev/scss/main/matchinfo.scss b/dev/scss/main/matchinfo.scss
index 340f12b..f712ae0 100644
--- a/dev/scss/main/matchinfo.scss
+++ b/dev/scss/main/matchinfo.scss
@@ -200,7 +200,6 @@
       // margin-right: -1 * $right-match-distance;
       width: $right-match-distance;
       li {
-        background-color: green;
         cursor: pointer;
         color: $nearly-white;
         text-decoration: none;
diff --git a/dev/scss/util.scss b/dev/scss/util.scss
index ed737f1..834484b 100644
--- a/dev/scss/util.scss
+++ b/dev/scss/util.scss
@@ -17,6 +17,8 @@
 $ids-pink-1:   rgb(193,   0,  43); // Lexik
 $ids-pink-2:   rgb(250, 243, 222); // Lexik
 
+$black: #333;
+
 /**
  * Orange Colors
  */