Introduce panel system for match information

Change-Id: Id209cb9d928f4511d02ade47543c3486a611313e
diff --git a/dev/scss/main/buttongroup.scss b/dev/scss/main/buttongroup.scss
index 269b5c1..7d0031a 100644
--- a/dev/scss/main/buttongroup.scss
+++ b/dev/scss/main/buttongroup.scss
@@ -57,7 +57,7 @@
       margin-top: $border-size
     }
     > span {
-      display: block;
+      display: block !important;
       border-width: 0;
       text-decoration:none;
       text-align: center;
@@ -76,6 +76,11 @@
   }
 }
 
+.button-group.button-view {
+  font-size: 10pt;
+  color: $nearly-white;
+}
+
 
 ul.menu.button-group-list {
   border-top-right-radius: 8px;
diff --git a/dev/scss/main/kwic.scss b/dev/scss/main/kwic.scss
index 63f143b..6950559 100644
--- a/dev/scss/main/kwic.scss
+++ b/dev/scss/main/kwic.scss
@@ -142,7 +142,8 @@
   li.active + li.active {
     border-top: $border-size solid $light-grey;
     padding-top: 3 * $border-size;
-    > ul.action.right {
+    // > ul.action.right {
+    .button-group.button-view {
       padding-top: 3 * $border-size;
     }
   }
@@ -229,15 +230,6 @@
   }
 }
 
-// More is defined in vc.scss
-p.ref div.action.bottom {
-  display: inline-block;
-  margin-right: .5em;
-  > span {
-    position: relative;
-    box-shadow: none;
-  }
-}
 
 /**
  * Active
@@ -260,9 +252,13 @@
   span {
     display: inline; // !important;
   }
-  ul.action {
+  .button-group.button-view {
     display: block;
   }
+/*  ul.action {
+    display: block;
+  }
+*/
   div.match-wrap {
     min-height: 20pt;
     div.snippet {
@@ -411,7 +407,13 @@
  * Actions
  */
 
+#search > ol > li .button-group.button-view {
+  display: none;
+}
+
+/*
 ul.action {
+
   display: none;
   //  background-color: $dark-orange;
   font-size: 12pt;
@@ -457,4 +459,4 @@
     }
   }
 }
-
+*/
diff --git a/dev/scss/main/matchinfo.scss b/dev/scss/main/matchinfo.scss
index 212fad0..6bce8b8 100644
--- a/dev/scss/main/matchinfo.scss
+++ b/dev/scss/main/matchinfo.scss
@@ -30,8 +30,6 @@
   display: none !important;
 }
 
-// TODO:
-//   This is now a view
 div.matchinfo {
   position: relative;
   width: 100%;
@@ -237,48 +235,21 @@
   }
 }
 
-// TODO:
-//   Probably obsolete now, as it will become part of the panel system
-div.matchinfo ul.action.image {
-  display: block;
-  position: absolute;
-  right: 0;
-  top: 0;
-  z-index: 20;
-  margin: 0;
-  padding: 0;
-  width: $right-match-distance;
-  li {
-    cursor: pointer;
-    color: $nearly-white;
-    text-decoration: none;
-    > span {
-      @include blind;
-    }
-    border-width: 0;
-    // z-index: 8;
-    text-decoration:none;
-    text-align: center;
-    font-style: normal;
-    
-    &.download::after {
-	    font-family: 'FontAwesome';
-	    content: $fa-download;
-    }
-    
-    &.close::after {
-	    font-family: 'FontAwesome';
-	    content: $fa-close;
-    }
+div.button-group.button-panel.button-matchinfo {
+  display: inline-block;
+  margin-right: .5em;
+  > span {
+    position: relative;
+    box-shadow: none;
   }
 }
 
-
-div.metatable + div.matchtable,
-div.metatable + div.matchtree {
+div.matchinfo .view + .view {
   margin-top: 4 * $border-size !important;
 }
 
+
+// Metatable
 div.metatable > dl {
   display: flex;
   flex-direction: row;
diff --git a/dev/scss/main/panel.scss b/dev/scss/main/panel.scss
index 960066d..40ce48a 100644
--- a/dev/scss/main/panel.scss
+++ b/dev/scss/main/panel.scss
@@ -5,17 +5,6 @@
   position: relative;
   width: 100%;
   display: block;
-  > div {
-    /*
-    border: {
-      style: solid;
-      width: $border-size;
-    }
-    &:empty {
-      border-width: 0;
-    }
-   */
-  }
 }
 
 div.view {
@@ -23,13 +12,10 @@
   padding-top: $border-size;
   display: block;
   width: 100%;
-  .button-group {
-    color: white;
-  }
 }
 
 
-#search div.view {
+div.result.panel .view {
   border: 1px solid $kwic-border;
   background-color: $dark-orange;
 }
\ No newline at end of file