Updated

Author: svekars

_static/css/custom.css

@@ -93,22 +93,49 @@
 }
 
 .pytorch-left-menu-search input[type=text] {
-    background-image: none;
+    background-image: url("../images/search-icon.svg");
 }
 
-.gsc-control-cse {
-   padding-left: 0px !important;
-   padding-bottom: 0px !important;
+.gsc-search-button-v2 {
+    display: none;
 }
 
-.gsc-search-button .gsc-search-button-v2:focus {
-   border: transparent !important;
-   outline: none;
-   box-shadow: none;
+.gsc-input-box {
+  border: 1px solid #ffffff;
+  background-color: #f3f4f7;
+  border-radius: 0;
+  width: 100%;
 }
-.gsc-search-button-v2:active {
-   border: none !important;
+
+.gsc-input-box {
+   background-image: url("../images/search-icon.svg");
+   background-repeat: no-repeat;
 }
-.gsc-search-button-v2 {
-   border: none !important;
+
+.gsc-input {
+  background-image: url("../images/search-icon.svg");
+  background-repeat: no-repeat;
+  background-size: 18px 18px;
+  background-position: 12px 10px;
+  font-size: 1rem;
+  color: #262626;
+}
+
+.gsst_a .gscb_a {
+    display: none;
+}
+
+.gsc-control-cse {
+    padding-bottom: 0;   
+}
+
+form.gsc-search-box {
+    margin-bottom: 0;
+    padding-bottom: 0;
+}
+
+.gs-search-image {
+    width: 16px;
+    height: 16px;
+    margin-right: 5px;
 }

_templates/layout.html

@@ -45,8 +45,11 @@
   <!-- Search box -->
   <div id="searchBox">
     <div class="searchbox" id="googleSearchBox">
+      <div class="gs-search-image">
+         <img src="../images/search-icon.svg"> 
+      </div>
       <script async src="https://cse.google.com/cse.js?cx=e65585f8c3ea1440e"></script>
-      <div class="gcse-search"></div>
+      <div class="gcse-search" data-placeholder="Search"></div>
     </div>
     <div id="sphinxSearchBox" style="display: none;">
       <div role="search">
@@ -58,13 +61,12 @@
       </div>
     </div>
   </div>
-    <!-- Radio buttons for search selection -->
   <form id="searchForm">
-    <label>
+    <label style="margin-bottom: 1rem">
       <input type="radio" name="searchType" value="google" checked>
       Google Search
     </label>
-    <label>
+    <label style="margin-bottom: 1rem">
       <input type="radio" name="searchType" value="sphinx">
       Sphinx Search
     </label>
@@ -98,7 +100,6 @@
       });
     });
   </script>
-  </script>
 
 {% endblock %}