Only show search when JS is enabled

[leoheitmannruiz]

Hey, thanks for the lovely theme!!

What do you think about only showing the search bar when JS is enabled? I feel like this would be a caring touch :)

I know very little about this type of development, but can't you have an empty div, which is filled with the search, in case JS is enabled? Is it that simple?

[alex-shpak]

Hi!
I thought about it, option could be to have search box hidden by default and unhide it with JS, not sure if it worth an extra JS script tho

[alex-shpak]

Perhaps like this
search.html

{{ if default true .Site.Params.BookSearch }}
<div class="book-search hidden">
  <input type="text" id="book-search-input" placeholder="{{ i18n "Search" }}" aria-label="{{ i18n "Search" }}" maxlength="64" data-hotkeys="s/" />
  <div class="book-search-spinner hidden"></div>
  <ul id="book-search-results"></ul>
</div>
<script>document.querySelector(".book-search").classList.remove("hidden")</script>
{{ end }}

[leoheitmannruiz]

I tested this and it LGTM. Very cool!