Update

Author: svekars

_static/css/custom.css

@@ -95,47 +95,3 @@
 .pytorch-left-menu-search input[type=text] {
     background-image: url("../images/search-icon.svg");
 }
-
-.gsc-search-button-v2 {
-    display: none;
-}
-
-.gsc-input-box {
-  border: 1px solid #ffffff;
-  background-color: #f3f4f7;
-  border-radius: 0;
-  width: 100%;
-}
-
-.gsc-input-box {
-   background-image: url("../images/search-icon.svg");
-   background-repeat: no-repeat;
-}
-
-.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;
-}

_static/css/custom2.css

@@ -41,3 +41,69 @@
 input[type="radio"] {
     accent-color: #ee4c2c;
 }
+
+.gsst_b {
+    display: none;
+}
+
+#gsc-i-id1 {
+    height: 1.5rem;
+    text-indent: 12px !important; 
+    font-size: 1rem !important;
+    font-family: "FreightSansi";
+    background-image: url(../images/search-icon.svg) !important;
+    background-repeat: no-repeat !important;
+    background-size: 18px 18px !important;
+    background-position: 5px 0px !important;
+    padding-left: 20px !important;
+}
+
+#gsc-i-id1::placeholder {
+  font-family: 'FreightSans';
+  font-size: 1rem;
+  color: #262626;
+}
+
+.gsc-control-cse {
+   padding: 0 !important;
+   border-radius: 0px !important;
+   border: none !important;;
+   overflow: hidden;
+}
+
+#___gcse_0 {
+    height: 44px !important;
+    padding: 0 !important;
+}
+
+table.gsc-search-box td.gsc-input {
+    padding-right: 0 !important;
+}
+
+table.gsc-search-box td {
+    height: 44px;
+    margin-bottom: 0 !important;
+    padding-bottom: 0 !important;
+}
+
+.gsc-search-button-v2 {
+    display: none;
+}
+
+.gs_id50 {
+    width: 308px;
+}
+
+.gsib_a {
+    padding: 0px 8px 4px 9px !important;
+}
+
+.gsc-input-box {
+    border-radius: 0px !important;
+    border: none !important; 
+}
+
+form.gsc-search-box {
+    margin-bottom 0px;
+}
+

_templates/layout.html

@@ -45,16 +45,13 @@
   <!-- 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" data-placeholder="Search"></div>
+      <div class="gcse-search"</div>
     </div>
     <div id="sphinxSearchBox" style="display: none;">
       <div role="search">
         <form id="rtd-search-form" class="wy-form" action="{{ pathto('search') }}" method="get">
-          <input type="text" name="q" placeholder="Search {{ search_project }}" />
+          <input type="text" name="q" placeholder="Search Docs" />
           <input type="hidden" name="check_keywords" value="yes" />
           <input type="hidden" name="area" value="default" />
         </form>
@@ -68,7 +65,7 @@
     </label>
     <label style="margin-bottom: 1rem">
       <input type="radio" name="searchType" value="sphinx">
-      Sphinx Search
+      Classic Search
     </label>
   </form>
 
@@ -98,9 +95,19 @@
         localStorage.setItem('searchType', selectedSearchType);
         toggleSearchBox(selectedSearchType);
       });
+      // Set placeholder text for Google search box
+      window.onload = function() {
+        var placeholderText = "Search Docs";
+        var googleSearchboxText = document.querySelector("#gsc-i-id1");
+        if (googleSearchboxText) {
+          googleSearchboxText.placeholder = placeholderText;
+          googleSearchboxText.style.fontFamily = 'FreightSans';
+          googleSearchboxText.style.fontSize = "1.2rem"; 
+          googleSearchboxText.style.color = '#262626';
+        } 
+      };
     });
   </script>
-
 {% endblock %}
 
 {% block footer %}