edit [b-loading]

Author: ChanMenglin

src/components/base/Loading/b-loading.vue

@@ -1,9 +1,9 @@
 <template>
-  <div
-    :class="objClass"
-    role="status"
+  <div
+    :class="objClass"
+    role="status"
   >
-    <span class="sr-only">Loading...</span>
+    <span class="visually-hidden">Loading...</span>
   </div>
 </template>
 
@@ -31,8 +31,8 @@ export default {
   computed: {
     objClass: function() {
       let color = this.color ? `text-${this.color}` : "";
-      let size = this.size ? `spinner-border-${this.size}` : "";
-      return `spinner-${this.status} ${color} ${size}`;
+      let size = this.size ? `spinner-${this.status}-${this.size}` : "";
+      return `spinner-${this.status} ${size} ${color}`;
     }
   }
 };

src/pages/Demo/Base/b-loading-demo.vue

@@ -22,7 +22,7 @@
       </font>
       <b-loading status="grow" />
     </div>
-    <div class="row py-1">
+    <div class="row my-1">
       <font class="col-1">
         size:
       </font>
@@ -33,11 +33,13 @@
       <font class="col-1">
         sm:
       </font>
-      <b-loading size="sm" />
-      <b-loading
-        size="sm"
-        status="grow"
-      />
+      <div class="col-auto">
+        <b-loading size="sm" />
+        <b-loading
+          size="sm"
+          status="grow"
+        />
+      </div>
     </div>
     <div class="row py-1">
       <font class="col-1">