fix: make sure hiding search icon before showing spinner icon (#215)

style: change spinner icon size to 1.35em
hugomods · Feb 20, 2024 · 7fe1301 · 7fe1301
1 parent a33e085
commit 7fe1301
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/assets/search/js/form.ts b/assets/search/js/form.ts
@@ -201,6 +201,7 @@ export default class Form {
  })
  })
 
+ this.spinner.show()
  engine.init().then(() => {
  this.input.removeAttribute('disabled')
  }).catch((err) => {

diff --git a/assets/search/js/spinner.ts b/assets/search/js/spinner.ts
@@ -31,6 +31,9 @@ export default class Spinner {
 
  show() {
  this.getSearchIcon().classList.add('disabled')
- this.getElement().classList.remove('disabled')
+ // delay for making sure the search icon was hidden.
+ setTimeout(() => {
+ this.getElement().classList.remove('disabled')
+ }, 1)
  }
 }
diff --git a/layouts/partials/search/assets/js-resource.html b/layouts/partials/search/assets/js-resource.html
@@ -59,7 +59,7 @@
  "history" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "clock" "size" "2em"))
  "meta" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "info-circle" "size" "2em"))
  "search" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "search" "size" "1.25em"))
- "spinner" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "arrow-clockwise" "size" "1.25em"))
+ "spinner" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "arrow-clockwise" "size" "1.35em"))
  "lang" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "translate" "size" "1em"))
  "sort" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "sort-down" "size" "1em"))
  "expand" (partial "icons/icon" (dict "vendor" "bootstrap" "name" "chevron-expand" "size" "1em"))