Merge branch '708-annotation-with-three-digit' into 'devel_12.2.x'

Resolve "Search results with three digit number display correction"

See merge request !661

CHANGELOG

 minerva (12.2.0~beta.2) unstable; urgency=medium
+  * Bug fix: too many annotations (>=100) caused misaligning in the left panel 
+    (#708)
   * Bug fix: text was outside the popup window (#711)
   * Bug fix: custom semantic zooming contains multiple overlays checkbox was 
     disabled (#715) 

frontend-js/src/main/css/global.css

@@ -546,16 +546,28 @@ Plugin tabs
     overflow: auto;
 }
 
-.minerva-annotation-row-odd {
+.minerva-annotation-row-odd, .minerva-annotation-row-even {
+    height: 26px;
     padding: 5px;
+}
+
+.minerva-annotation-row-odd {
     background-color: #EAEAEA;
 }
 
 .minerva-annotation-row-even {
-    padding: 5px;
     background-color: #ffffff;
 }
 
+.minerva-annotation-counter {
+    min-width: 28px;
+    float: left;
+}
+
+.minerva-annotation-body {
+    float: left;
+}
+
 .minerva-overview-button {
     color: #FFFFFF;
     height: 36px;

frontend-js/src/main/js/gui/leftPanel/GuiUtils.js

@@ -402,21 +402,22 @@ GuiUtils.prototype.createAnnotationList = function (annotations, options) {
       } else {
 
         var row = document.createElement("div");
-        row.style.height = "26px";
         if (j % 2 === 0) {
           row.className = "minerva-annotation-row-odd";
         } else {
           row.className = "minerva-annotation-row-even";
         }
 
-        var header = document.createElement("div");
-        header.style.width = "28px";
-        header.style.float = "left";
-        header.innerHTML = "[" + cntAnnotations + "]";
-        row.appendChild(header);
+        row.appendChild(Functions.createElement({
+          type: "div",
+          className: "minerva-annotation-counter",
+          content: "[" + cntAnnotations + "]"
+        }));
 
-        var body = document.createElement("div");
-        body.style.float = "left";
+        var body = Functions.createElement({
+          type: "div",
+          className: "minerva-annotation-body"
+        });
         body.appendChild(link);
         row.appendChild(body);
         groupContainer.appendChild(row);