From 6cf4b2d51802c1b197a84d1f66343ad483fc8aea Mon Sep 17 00:00:00 2001
From: Dennis Tang <dtang@gitlab.com>
Date: Tue, 26 Mar 2019 00:02:20 +0000
Subject: Update spinners in group list component

---
 app/assets/javascripts/groups/components/app.vue                 | 2 +-
 app/views/dashboard/groups/_groups.html.haml                     | 4 ++--
 app/views/explore/groups/_groups.html.haml                       | 4 ++--
 app/views/groups/_archived_projects.html.haml                    | 4 ++--
 app/views/groups/_shared_projects.html.haml                      | 4 ++--
 app/views/groups/_subgroups_and_projects.html.haml               | 4 ++--
 changelogs/unreleased/52366-improved-group-lists-ui-spinners.yml | 5 +++++
 7 files changed, 16 insertions(+), 11 deletions(-)
 create mode 100644 changelogs/unreleased/52366-improved-group-lists-ui-spinners.yml

diff --git a/app/assets/javascripts/groups/components/app.vue b/app/assets/javascripts/groups/components/app.vue
index 29dc2d6a8a3..aa50fd8ff62 100644
--- a/app/assets/javascripts/groups/components/app.vue
+++ b/app/assets/javascripts/groups/components/app.vue
@@ -244,7 +244,7 @@ export default {
     <gl-loading-icon
       v-if="isLoading"
       :label="s__('GroupsTree|Loading groups')"
-      :size="2"
+      size="md"
       class="loading-animation prepend-top-20"
     />
     <groups-component
diff --git a/app/views/dashboard/groups/_groups.html.haml b/app/views/dashboard/groups/_groups.html.haml
index db856ef7d7b..2f9dbf87d95 100644
--- a/app/views/dashboard/groups/_groups.html.haml
+++ b/app/views/dashboard/groups/_groups.html.haml
@@ -1,4 +1,4 @@
 .js-groups-list-holder
   #js-groups-tree{ data: { hide_projects: 'true', endpoint: dashboard_groups_path(format: :json), path: dashboard_groups_path, form_sel: 'form#group-filter-form', filter_sel: '.js-groups-list-filter', holder_sel: '.js-groups-list-holder', dropdown_sel: '.js-group-filter-dropdown-wrap' } }
-    .loading-container.text-center
-      = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
+    .loading-container.text-center.prepend-top-20
+      .spinner.spinner-md
diff --git a/app/views/explore/groups/_groups.html.haml b/app/views/explore/groups/_groups.html.haml
index ff57b39e947..a3249275d5e 100644
--- a/app/views/explore/groups/_groups.html.haml
+++ b/app/views/explore/groups/_groups.html.haml
@@ -1,4 +1,4 @@
 .js-groups-list-holder
   #js-groups-tree{ data: { hide_projects: 'true', endpoint: explore_groups_path(format: :json), path: explore_groups_path, form_sel: 'form#group-filter-form', filter_sel: '.js-groups-list-filter', holder_sel: '.js-groups-list-holder', dropdown_sel: '.js-group-filter-dropdown-wrap' } }
-    .loading-container.text-center
-      = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
+    .loading-container.text-center.prepend-top-20
+      .spinner.spinner-md
diff --git a/app/views/groups/_archived_projects.html.haml b/app/views/groups/_archived_projects.html.haml
index ed79f5790f0..48e9f630050 100644
--- a/app/views/groups/_archived_projects.html.haml
+++ b/app/views/groups/_archived_projects.html.haml
@@ -4,5 +4,5 @@
 
   %ul.content-list{ data: { hide_projects: 'false', group_id: group.id, path: group_path(group) } }
     .js-groups-list-holder
-      .loading-container.text-center
-        = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
+      .loading-container.text-center.prepend-top-20
+        .spinner.spinner-md
diff --git a/app/views/groups/_shared_projects.html.haml b/app/views/groups/_shared_projects.html.haml
index 4eb8367f633..2769b69add3 100644
--- a/app/views/groups/_shared_projects.html.haml
+++ b/app/views/groups/_shared_projects.html.haml
@@ -4,5 +4,5 @@
 
   %ul.content-list{ data: { hide_projects: 'false', group_id: group.id, path: group_path(group) } }
     .js-groups-list-holder
-      .loading-container.text-center
-        = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
+      .loading-container.text-center.prepend-top-20
+        .spinner.spinner-md
diff --git a/app/views/groups/_subgroups_and_projects.html.haml b/app/views/groups/_subgroups_and_projects.html.haml
index d53c8026df8..784f5ac233e 100644
--- a/app/views/groups/_subgroups_and_projects.html.haml
+++ b/app/views/groups/_subgroups_and_projects.html.haml
@@ -4,5 +4,5 @@
 
   %ul.content-list{ data: { hide_projects: 'false', group_id: group.id, path: group_path(group) } }
     .js-groups-list-holder
-      .loading-container.text-center
-        = icon('spinner spin 2x', class: 'loading-animation prepend-top-20')
+      .loading-container.text-center.prepend-top-20
+        .spinner.spinner-md
diff --git a/changelogs/unreleased/52366-improved-group-lists-ui-spinners.yml b/changelogs/unreleased/52366-improved-group-lists-ui-spinners.yml
new file mode 100644
index 00000000000..ab09272eaf4
--- /dev/null
+++ b/changelogs/unreleased/52366-improved-group-lists-ui-spinners.yml
@@ -0,0 +1,5 @@
+---
+title: Update spinners in group list component
+merge_request: 26572
+author:
+type: changed
-- 
cgit v1.2.1