fix(progressIndicators): update story of spinner and progress ring

innovaccer · Dec 6, 2024 · 506ca9b · 506ca9b
1 parent c258c78
commit 506ca9b
Show file tree

Hide file tree

Showing 4 changed files with 3 additions and 3 deletions.
diff --git a/core/components/atoms/progressRing/__stories__/Size.story.jsx b/core/components/atoms/progressRing/__stories__/Size.story.jsx
@@ -8,7 +8,7 @@ export const size = () => {
     <div className="d-flex">
       {sizes.map((ProgressRingSize, ind) => {
         return (
-          <div key={ind} className="mr-10">
+          <div key={ind} className="mr-10 d-flex flex-column align-items-center">
             <ProgressRing size={ProgressRingSize} value={30} />
             <br />
             <Text weight="strong">{ProgressRingSize.charAt(0).toUpperCase() + ProgressRingSize.slice(1)}</Text>

diff --git a/core/components/atoms/spinner/__stories__/Size.story.jsx b/core/components/atoms/spinner/__stories__/Size.story.jsx
@@ -8,7 +8,7 @@ export const size = () => {
     <div className="d-flex">
       {sizes.map((SpinnerSize, ind) => {
         return (
-          <div key={ind} className="mr-8">
+          <div key={ind} className="mr-8 d-flex flex-column align-items-center">
             <div className="h-75">
               <Spinner size={SpinnerSize} />
             </div>

diff --git a/docs/src/pages/components/progressIndicators/images/skeleton-loader-shape.png b/docs/src/pages/components/progressIndicators/images/skeleton-loader-shape.png
diff --git a/docs/src/pages/components/progressIndicators/usage.mdx b/docs/src/pages/components/progressIndicators/usage.mdx
@@ -64,7 +64,7 @@ Progress bar comes in **4 sizes** - extra small, small, regular and large.
 
 #### Skeleton Loaders - Image
 
-For images, skeleton loaders come in **2 shapes** - square and round. 
+For images, skeleton loaders come in **2 shapes** - round and square. 
 
 ![Skeleton Loaders - Image - Shape](./images/skeleton-loader-shape.png)
 <Caption>Skeleton Loaders - Image - Shape</Caption>