Dark mode, country, interface language, and search language configs can now be set in the search query by appending each option as a url parameter. Supported args are: 'dark', 'lang_search', 'lang_interface', and 'ctry' Ex: /search?q=%s&dark=1&lang_search=lang_en... These config settings persist across page navigation and switching result type, but will be reset if the main search bar is used. See #144
		
			
				
	
	
		
			60 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			60 lines
		
	
	
		
			2.6 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| {% if mobile %}
 | |
|     <header>
 | |
|         <div class="bz1lBb">
 | |
|             <form class="Pg70bf" id="search-form" method="POST">
 | |
|                 <a class="logo-link mobile-logo"
 | |
|                    href="/"
 | |
|                    style="display:flex; justify-content:center; align-items:center; color:#685e79; font-size:18px; ">
 | |
|                     <span style="color: #685e79">Whoogle</span>
 | |
|                 </a>
 | |
|                 <div class="H0PQec" style="width: 100%;">
 | |
|                     <div class="sbc esbc autocomplete">
 | |
|                         <input id="search-bar" autocapitalize="none" autocomplete="off" class="noHIxc" name="q"
 | |
|                                style="background-color: {{ '#000' if dark_mode else '#fff' }};
 | |
|                                        color: {{ '#685e79' if dark_mode else '#000' }};
 | |
|                                        border: {{ '1px solid #685e79' if dark_mode else '' }}"
 | |
|                                spellcheck="false" type="text" value="{{ query }}">
 | |
|                         <input name="tbm" value="{{ search_type }}" style="display: none">
 | |
|                         <div class="sc"></div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </form>
 | |
|         </div>
 | |
|     </header>
 | |
| {% else %}
 | |
|     <header>
 | |
|         <div class="logo-div">
 | |
|             <a class="logo-link" href="/">
 | |
|                 <span style="color: #685e79">Whoogle</span>
 | |
|             </a>
 | |
|         </div>
 | |
|         <div class="search-div">
 | |
|             <form id="search-form" class="search-form" id="sf" method="POST">
 | |
|                 <div class="autocomplete" style="width: 100%; flex: 1">
 | |
|                     <div style="width: 100%; display: flex">
 | |
|                         <input id="search-bar" autocapitalize="none" autocomplete="off" class="noHIxc" name="q"
 | |
|                                spellcheck="false" type="text" value="{{ query }}"
 | |
|                                style="background-color: {{ '#000' if dark_mode else '#fff' }};
 | |
|                                        color: {{ '#685e79' if dark_mode else '#000' }};
 | |
|                                        border: {{ '1px solid #685e79' if dark_mode else '' }}">
 | |
|                         <input name="tbm" value="{{ search_type }}" style="display: none">
 | |
|                         <div class="sc"></div>
 | |
|                     </div>
 | |
|                 </div>
 | |
|             </form>
 | |
|         </div>
 | |
|     </header>
 | |
| {% endif %}
 | |
| 
 | |
| <script>
 | |
|     const searchBar = document.getElementById("search-bar");
 | |
| 
 | |
|     searchBar.addEventListener("keyup", function (event) {
 | |
|         if (event.keyCode !== 13) {
 | |
|             handleUserInput(searchBar);
 | |
|         } else {
 | |
|             document.getElementById("search-form").submit();
 | |
|         }
 | |
|     });
 | |
| </script>
 |