fix(docs): Correct Markdown formatting for lists with code blocks

Signed-off-by: Aryan Nair <[email protected]>

Author: AryanCruise

src/components/StartKeploy.js

@@ -3,6 +3,11 @@ import Tabs from "@theme/Tabs";
 import TabItem from "@theme/TabItem";
 import CodeBlock from "@theme/CodeBlock";
 import Link from "@docusaurus/Link";
+// Add this line at the top of StartKeploy.js
+import '../css/custom.css';
+
+// ... your other imports like import React from 'react';
+// ... the rest of your component code
 
 export default function StartKeploy() {
   return (
@@ -21,63 +26,63 @@ export default function StartKeploy() {
         <TabItem value="go" label="Go">
           <br />
           <p>
-            <strong>Record the test cases</strong>
+            <strong>1. Record the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy record -c "go run main.go"`}
           </CodeBlock>
           <p>
-            <strong>Run the test cases</strong>
+            <strong>2. Run the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy test -c "go run main.go" --delay 10`}
           </CodeBlock>
         </TabItem>
 
         <TabItem value="node" label="Node.js">
           <br />
           <p>
-            <strong>Record the test cases</strong>
+            <strong>1. Record the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy record -c "npm start"`}
           </CodeBlock>
           <p>
-            <strong>Run the test cases</strong>
+            <strong>2. Run the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy test -c "npm start" --delay 10`}
           </CodeBlock>
         </TabItem>
 
         <TabItem value="java" label="Java">
           <br />
           <p>
-            <strong>Record the test cases</strong>
+            <strong>1. Record the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy record -c "mvn spring-boot:run"`}
           </CodeBlock>
           <p>
-            <strong>Run the test cases</strong>
+            <strong>2. Run the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy test -c "mvn spring-boot:run" --delay 10`}
           </CodeBlock>
         </TabItem>
 
         <TabItem value="python" label="Python">
           <br />
           <p>
-            <strong>Record the test cases</strong>
+            <strong>1. Record the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy record -c "python app.py"`}
           </CodeBlock>
           <p>
-            <strong>Run the test cases</strong>
+            <strong>2. Run the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy test -c "python app.py" --delay 10`}
           </CodeBlock>
         </TabItem>

src/components/StartKeployDocker.js

@@ -22,16 +22,16 @@ export default function StartKeploy() {
         <TabItem value="docker" label="Docker">
           <br />
           <p>
-            <strong>Record the test cases</strong>
+            <strong>1. Record the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy record -c "docker run -p <appPort>:<hostPort> --name <containerName> --network keploy-network --rm <applicationImage>" --containerName "<containerName>" --delay 10`}
           </CodeBlock>
 
           <p>
-            <strong>Run the test cases</strong>
+            <strong>2. Run the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy test -c "docker run -p <appPort>:<hostPort> --name <containerName> --network keploy-network --rm <applicationImage>" --containerName "<containerName>" --delay 20`}
           </CodeBlock>
         </TabItem>
@@ -40,16 +40,16 @@ export default function StartKeploy() {
         <TabItem value="docker-compose" label="Docker Compose">
           <br />
           <p>
-            <strong>Record the test cases</strong>
+            <strong>1. Record the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy record -c "docker compose up" --container-name <containerName> --build-delay 100`}
           </CodeBlock>
 
           <p>
-            <strong>Run the test cases</strong>
+            <strong>2. Run the test cases</strong>
           </p>
-          <CodeBlock language="bash">
+          <CodeBlock language="bash" className="my-code-block">
             {`keploy test -c "docker compose up" --container-name <containerName> --build-delay 50 --delay 20`}
           </CodeBlock>
         </TabItem>

src/css/custom.css

@@ -740,6 +740,10 @@ a {
   text-decoration: inherit;
 }
 
+.my-code-block {
+  margin-left: 1rem;
+}
+
 textarea {
   resize: vertical;
 }