From e0bbb72f18fac598f09d35e3f89e9b41990b5753 Mon Sep 17 00:00:00 2001
From: Kavindu Manahara <cst20003@std.uwu.ac.lk>
Date: Sat, 4 May 2024 17:25:46 +0530
Subject: [PATCH] 1st stable version v0.1.0 release

---
 README.md                         | 2 +-
 package.json                      | 2 +-
 src/climbing-box-loader/index.tsx | 2 +-
 src/grid-loader/index.tsx         | 1 +
 4 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 7287263..060d4ab 100644
--- a/README.md
+++ b/README.md
@@ -215,7 +215,7 @@ Now you can use both components like bellow.
 _If you need change writer text color.add this line to your css file_
 
 ```css
- --rms-writer-color: your color;
+ --rms-writer-color: your color !important;
 ```
 
 </details>
diff --git a/package.json b/package.json
index a38c17f..dd3467c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "react-magic-spinners",
-  "version": "0.0.1-beta.3",
+  "version": "0.1.0",
   "description": "React Magic Spinners is a collection of loading spinners for React.js",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
diff --git a/src/climbing-box-loader/index.tsx b/src/climbing-box-loader/index.tsx
index 6b3ec0c..038b0aa 100644
--- a/src/climbing-box-loader/index.tsx
+++ b/src/climbing-box-loader/index.tsx
@@ -19,7 +19,7 @@ const ClimbingBoxLoader = ({
     borderWidth: size / 5,
     borderColor: color,
     borderStyle: "solid",
-    marginBottom: (2 * size) / 5,
+    marginBottom: (size) / 5,
   };
 
   return (
diff --git a/src/grid-loader/index.tsx b/src/grid-loader/index.tsx
index 3cc0479..7b95bab 100644
--- a/src/grid-loader/index.tsx
+++ b/src/grid-loader/index.tsx
@@ -28,6 +28,7 @@ const GridLoader = ({
       className={`rms-grid-loader-wrapper ${className}`}
       style={{
         backgroundColor,
+        width:"fit-content",
         gridTemplateColumns: `repeat(${columns}, 1fr)`,
         gridTemplateRows: `repeat(${rows}, 1fr)`,
         ...style,