Update the throbber

Last updated on
14 May 2023

This documentation needs review. See "Help improve this page" in the sidebar.

It's easy to replace the standard blue spinning wheel ("throbber") from stable9 theme in a sub-theme with the new one in Olivero, for example in a Search API Autocomplete form.

Standard stable9 throbber

stable9 throbber

Olivero throbber

Olivero Throbber

Add CSS in your theme

To update the throbber, simply add the code below in your themes CSS file and clear caches.
 

/**
 * @file
 *
 * Replaces standard throbber from stable9 with Olivero's.
 *
 * Copied and edited from:
 * core/themes/stable9/css/system/components/autocomplete-loading.module.css
 *
 */

.js input.form-autocomplete {
  background-image: none;
}
.js input.form-autocomplete.ui-autocomplete-loading {
  background-image: url(/core/themes/olivero/images/throbber.svg);
  background-position: 98% center;
}

Help improve this page

Page status: Needs review

You can: