From e6180e3b1818a0b7d76c31c58a8f359e6994812b Mon Sep 17 00:00:00 2001
From: Abdelrahman Abdelhafez <abdelrahman@maged.rocks>
Date: Mon, 11 Jan 2021 01:11:47 +0100
Subject: [PATCH 1/3] Format README code snippets

---
 README.md | 94 +++++++++++++++++++++++++++----------------------------
 1 file changed, 47 insertions(+), 47 deletions(-)

diff --git a/README.md b/README.md
index cf38a8e..573b534 100644
--- a/README.md
+++ b/README.md
@@ -30,39 +30,39 @@ npm install --save react-planet
 import { Planet } from 'react-planet';
 
 export function MyPlanet() {
-	return (
-		<Planet
-			centerContent={
-				<div
-					style={{
-						height: 100,
-						width: 100,
-						borderRadius: '50%',
-						backgroundColor: '#1da8a4',
-					}}
-				/>
-			}
-			open
-			autoClose
-		>
-			<div
-				style={{
-					height: 70,
-					width: 70,
-					borderRadius: '50%',
-					backgroundColor: '#9257ad',
-				}}
-			/>
-			<div
-				style={{
-					height: 70,
-					width: 70,
-					borderRadius: '50%',
-					backgroundColor: '#9257ad',
-				}}
-			/>
-		</Planet>
-	);
+  return (
+    <Planet
+      centerContent={
+        <div
+          style={{
+            height: 100,
+            width: 100,
+            borderRadius: '50%',
+            backgroundColor: '#1da8a4',
+          }}
+        />
+      }
+      open
+      autoClose
+    >
+      <div
+        style={{
+          height: 70,
+          width: 70,
+          borderRadius: '50%',
+          backgroundColor: '#9257ad',
+        }}
+      />
+      <div
+        style={{
+          height: 70,
+          width: 70,
+          borderRadius: '50%',
+          backgroundColor: '#9257ad',
+        }}
+      />
+    </Planet>
+  );
 }
 ```
 
@@ -71,11 +71,12 @@ export function MyPlanet() {
 <img src="doc/example2.png" width="40%">
 
 ```jsx
-<Planet centerContent={div style={...yourStlye}/>}
-        open
-        orbitRadius={120}
-        rotation={30}
-        ...
+<Planet
+	centerContent={<div style={yourStyle} />}
+	open
+	orbitRadius={120}
+	rotation={30}
+	...
 >
 ```
 
@@ -106,8 +107,8 @@ export function MyPlanet() {
 
 ```jsx
 <Planet
-    // set one of the orientations
-    satelliteOrientation="INSIDE"
+	// set one of the orientations
+	satelliteOrientation="INSIDE"
 
 ```
 
@@ -117,9 +118,9 @@ export function MyPlanet() {
 
 ```jsx
 <Planet
-    dragablePlanet
-    dragRadiusPlanet={20}
-    bounce
+	dragablePlanet
+	dragRadiusPlanet={20}
+	bounce
 ```
 
 ## Planetception
@@ -162,10 +163,9 @@ Code: [/src/stories/Planetception.stories.tsx](/src/stories/Planetception.storie
 
 ```jsx
 <Planet
-      mass={4}
-      tension={500}
-      friction={19}
-
+	mass={4}
+	tension={500}
+	friction={19}
 ```
 
 <br/>

From 31904dbc6660af8f57f808e3d963e7aa83a98386 Mon Sep 17 00:00:00 2001
From: Abdelrahman Abdelhafez <abdelrahman@maged.rocks>
Date: Mon, 11 Jan 2021 01:16:49 +0100
Subject: [PATCH 2/3] Format README code snippets

---
 README.md | 77 +++++++++++++++++++++++++++----------------------------
 1 file changed, 38 insertions(+), 39 deletions(-)

diff --git a/README.md b/README.md
index 573b534..34767be 100644
--- a/README.md
+++ b/README.md
@@ -72,9 +72,9 @@ export function MyPlanet() {
 
 ```jsx
 <Planet
-	centerContent={<div style={yourStyle} />}
-	open
-	orbitRadius={120}
+  centerContent={<div style={yourStyle} />}
+  open
+  orbitRadius={120}
 	rotation={30}
 	...
 >
@@ -86,18 +86,18 @@ export function MyPlanet() {
 
 ```jsx
 <Planet
-	orbitStyle={(defaultStyle) => ({
-		...defaultStyle,
-		borderWidth: 4,
-		borderStyle: 'dashed',
-		borderColor: '#6f03fc',
-	})}
-	centerContent={<div className={classes.planetSmall} />}
-	open
+  orbitStyle={(defaultStyle) => ({
+    ...defaultStyle,
+    borderWidth: 4,
+    borderStyle: 'dashed',
+    borderColor: '#6f03fc',
+  })}
+  centerContent={<div className={classes.planetSmall} />}
+  open
 >
-	<div className={classes.satellite1} />
-	<div className={classes.satellite2} />
-	<div className={classes.satellite3} />
+  <div className={classes.satellite1} />
+  <div className={classes.satellite2} />
+  <div className={classes.satellite3} />
 </Planet>
 ```
 
@@ -107,9 +107,8 @@ export function MyPlanet() {
 
 ```jsx
 <Planet
-	// set one of the orientations
-	satelliteOrientation="INSIDE"
-
+  // set one of the orientations
+  satelliteOrientation="INSIDE"
 ```
 
 ## Bring it to life
@@ -118,9 +117,9 @@ export function MyPlanet() {
 
 ```jsx
 <Planet
-	dragablePlanet
-	dragRadiusPlanet={20}
-	bounce
+  dragablePlanet
+  dragRadiusPlanet={20}
+  bounce
 ```
 
 ## Planetception
@@ -137,23 +136,23 @@ Code: [/src/stories/Planetception.stories.tsx](/src/stories/Planetception.storie
 
 ```jsx
 <Planet
-	centerContent={<YourButton0 />}
-	hideOrbit
-	autoClose
-	orbitRadius={60}
-	bounceOnClose
-	rotation={105}
-	// the bounce direction is minimal visible
-	// but on close it seems the button wobbling a bit to the bottom
-	bounceDirection="BOTTOM"
+  centerContent={<YourButton0 />}
+  hideOrbit
+  autoClose
+  orbitRadius={60}
+  bounceOnClose
+  rotation={105}
+  // the bounce direction is minimal visible
+  // but on close it seems the button wobbling a bit to the bottom
+  bounceDirection="BOTTOM"
 >
-	<YourButton1 />
-	<YourButton2 />
-	<YourButton3 />
-	<div />
-	<div />
-	<div />
-	<div />
+  <YourButton1 />
+  <YourButton2 />
+  <YourButton3 />
+  <div />
+  <div />
+  <div />
+  <div />
 </Planet>
 ```
 
@@ -163,9 +162,9 @@ Code: [/src/stories/Planetception.stories.tsx](/src/stories/Planetception.storie
 
 ```jsx
 <Planet
-	mass={4}
-	tension={500}
-	friction={19}
+  mass={4}
+  tension={500}
+  friction={19}
 ```
 
 <br/>

From 4044bb27cbdc1a430edbbf74632ba016a7ef453c Mon Sep 17 00:00:00 2001
From: Abdelrahman Abdelhafez <abdelrahman@maged.rocks>
Date: Mon, 11 Jan 2021 01:18:08 +0100
Subject: [PATCH 3/3] Format README code snippets

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 34767be..ef9c8f5 100644
--- a/README.md
+++ b/README.md
@@ -75,8 +75,8 @@ export function MyPlanet() {
   centerContent={<div style={yourStyle} />}
   open
   orbitRadius={120}
-	rotation={30}
-	...
+  rotation={30}
+  ...
 >
 ```