Add title and placeholder search field help text

Refs pombase/pombase-gocam#142

Author: kimrutherford

gocam_view/templates/gocam_view/index.html

@@ -216,6 +216,9 @@
   color: #3076b0;
   text-decoration: underline;
 }
+#search-box input {
+  width: 16em;
+}
 </style>
 
 <script type="module">
@@ -1229,7 +1232,8 @@
     <div id="cy"></div>
   <div id="panel-buttons" style="display: none">
 {% if full_or_widget == 'full' %}
-    <button id="show-search" title="Search" onclick="showSearch()">
+    <button id="show-search" title="Search using activity names, gene names or model names or IDs"
+            onclick="showSearch()">
      <img src='data:image/svg+xml;charset=utf-8,<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg fill="%23000000" height="10mm" width="10mm" viewBox="0 0 500 500" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg"> <g> <path d="M483.4,454.444l-121.3-121.4c28.7-35.2,46-80,46-128.9c0-112.5-91.5-204.1-204.1-204.1S0,91.644,0,204.144 s91.5,204,204.1,204c48.8,0,93.7-17.3,128.9-46l121.3,121.3c8.3,8.3,20.9,8.3,29.2,0S491.8,462.744,483.4,454.444z M40.7,204.144 c0-90.1,73.2-163.3,163.3-163.3s163.4,73.3,163.4,163.4s-73.3,163.4-163.4,163.4S40.7,294.244,40.7,204.144z"/> </g> </svg>'/>
     </button>
 {% endif %}
@@ -1258,7 +1262,7 @@
 <div id="cy-panel">
 {% if full_or_widget == 'full' %}
   <div id="search-box" style="display: none">
-    <input id="search-input" placeholder="Search ..."/>
+    <input id="search-input" width="30" placeholder="Search for activies or models ..."/>
   </div>
 {% endif %}
   <div id="cy-panel-contents">