Added a magnifying glass icon to the search field and changed placeholder text. (#734)

* Adding magnifying glass to search field.

Signed-off-by: Kevin Putnam <[email protected]>

* Moved magnifying glass to the left and shifted text to right in search field.

Signed-off-by: Kevin Putnam <[email protected]>

* Embedded image in css to avoid sticky path issues.

Signed-off-by: Kevin Putnam <[email protected]>

* Reverting to relative path to .css

Signed-off-by: Kevin Putnam <[email protected]>

Author: intelkevinputnam

source/_themes/otc_tcs_sphinx_theme/searchbox.html

@@ -0,0 +1,9 @@
+{%- if builder != 'singlehtml' %}
+<div role="search">
+  <form id="rtd-search-form" class="wy-form" action="{{ pathto('search') }}" method="get">
+    <input type="text" name="q" id="clear-docs-search" placeholder="{{ _('Search documentation') }}" results="0"/>
+    <input type="hidden" name="check_keywords" value="yes" />
+    <input type="hidden" name="area" value="default" />
+  </form>
+</div>
+{%- endif %}

source/_themes/otc_tcs_sphinx_theme/static/mag-glass.png

@@ -36,6 +36,7 @@
 .wy-side-nav-search input[type=text] {
     border-radius: 0px;
     padding: 0px 0px;
+    padding-left: 20px;
     box-shadow: none;
     border: 0;
     outline: 0;
@@ -284,3 +285,9 @@ div.admonition ul {
 div#trademarks {
     color: gray;
 }
+
+
+#clear-docs-search {
+  background: url(./mag-glass.png) left no-repeat;
+  background-size: 15px 15px;
+}