### Goal Create an amazing loading icon to be used across GitLab. ### Basic Roadmap - [x] Add new `.spinner` css to the GitLab codebase - [x] Update the existing gitlab-ui component to make use of the new `.spinner` class - [x] Migrate existing HAML, Vue and JS files from using `.fa-spinner` to using `.spinner` - [x] Remove the font awesome spinner css, helpers and icons ### How to migrate There are 3 basic scenarios. * `.fa-spinner` * `= spinner` * `icon('spinner spin')` Each of these instances should be replaced with a loading icon which is generated from the [`loading_icon`](https://gitlab.com/gitlab-org/gitlab/-/merge_requests/36969/diffs) rails helper. **Note:** If the migration is taking place within a Vue, the [GlLoadingIcon](https://gitlab-org.gitlab.io/gitlab-ui/?path=/story/base-loading-icon--default) component should be used. ### Tips Always determine the domain-specific CSS that affects a `.fa-spinner` instance you are migrating to avoid introducing regressions caused by that CSS not matching the HTML produced by `loading_icon`. For example, read the description of this regression caused by a similar situation in https://gitlab.com/gitlab-org/gitlab/-/issues/246502 ### Additional information If you come across dormant code (definitely possible while working on a legacy migration) simply repurpose an open issue to remove the dormant code