diff --git a/docs/adding_new_shape/Readme.md b/docs/adding_new_shape/Readme.md
index 8d266c9c6..3b92eff2d 100644
--- a/docs/adding_new_shape/Readme.md
+++ b/docs/adding_new_shape/Readme.md
@@ -207,9 +207,11 @@ To ensure the robustness of the flowchart shapes, there are implementation of co
 To run the Cypress tests, follow these steps:
 
 1. Ensure you have all dependencies installed by running:
+
    ```bash
    npm install
    ```
+
 2. Start the Cypress test runner:
 
    ```bash
diff --git a/packages/mermaid/src/docs/adding_new_shape/Readme.md b/packages/mermaid/src/docs/adding_new_shape/Readme.md
index 3d0e1c22d..e53d7a05c 100644
--- a/packages/mermaid/src/docs/adding_new_shape/Readme.md
+++ b/packages/mermaid/src/docs/adding_new_shape/Readme.md
@@ -11,6 +11,7 @@ Before starting with shape creation, it's essential to familiarize yourself with
 ## Available Utilities
 
 ### 1. `labelHelper`
+
 - **Purpose**: This function creates and inserts labels inside SVG shapes.
 - **Features**:
   - Handles both HTML labels and plain text.
@@ -18,30 +19,35 @@ Before starting with shape creation, it's essential to familiarize yourself with
   - Ensures proper positioning of labels within shapes.
 
 ### 2. `updateNodeBounds`
+
 - **Purpose**: Updates the bounding box dimensions (width and height) of a node.
 - **Usage**:
   - Adjusts the size of the node to fit the content or shape.
   - Useful for ensuring that shapes resize appropriately based on their content.
 
 ### 3. `insertPolygonShape`
+
 - **Purpose**: Inserts a polygon shape into an SVG container.
 - **Features**:
   - Handles the creation and insertion of complex polygonal shapes.
   - Configures the shape's appearance and positioning within the SVG container.
 
 ### 4. `getNodeClasses`
+
 - **Purpose**: Returns the appropriate CSS classes for a node based on its configuration.
 - **Usage**:
   - Dynamically applies CSS classes to nodes for styling purposes.
   - Ensures that nodes adhere to the desired design and theme.
 
 ### 5. `createPathFromPoints`
+
 - **Purpose**: Generates an SVG path string from an array of points.
 - **Usage**:
   - Converts a list of points into a smooth path.
   - Useful for creating custom shapes or paths within the SVG.
 
 ### 6. `generateFullSineWavePoints`
+
 - **Purpose**: Generates points for a sine wave, useful for creating wavy-edged shapes.
 - **Usage**:
   - Facilitates the creation of shapes with wavy or sine-wave edges.
@@ -52,7 +58,14 @@ Before starting with shape creation, it's essential to familiarize yourself with
 To utilize these utilities, simply import them from the `utils.ts` file into your shape creation script. These helpers will streamline the process of building and customizing SVG shapes, ensuring consistent results across your projects.
 
 ```typescript
-import { labelHelper, updateNodeBounds, insertPolygonShape, getNodeClasses, createPathFromPoints, generateFullSineWavePoints } from './utils.ts';
+import {
+  labelHelper,
+  updateNodeBounds,
+  insertPolygonShape,
+  getNodeClasses,
+  createPathFromPoints,
+  generateFullSineWavePoints,
+} from './utils.ts';
 ```
 
 ## Example Usage
@@ -65,10 +78,10 @@ import { labelHelper, insertPolygonShape } from './utils.ts';
 const svgContainer = document.getElementById('svgContainer');
 
 // Insert a polygon shape
-insertPolygonShape(svgContainer, /* shape-specific parameters */);
+insertPolygonShape(svgContainer /* shape-specific parameters */);
 
 // Create and insert a label inside the shape
-labelHelper(svgContainer, /* label-specific parameters */);
+labelHelper(svgContainer /* label-specific parameters */);
 ```
 
 ## Adding New Shapes
@@ -80,6 +93,7 @@ To add a new shape:
 - **Create the shape function**: Create a new file of name of the shape and export a function in the `shapes` directory that generates your shape. The file and function should follow the pattern used in existing shapes and return an SVG element.
 
 - **Example**:
+
   ```typescript
   import { Node } from '$root/rendering-util/types.d.ts';
 
@@ -96,6 +110,7 @@ To add a new shape:
 - **Register the shape**: Add your shape to the `shapes` object in the main shapes module. This allows your shape to be recognized and used within the system.
 
 - **Example**:
+
   ```typescript
   import { myNewShape } from './shapes/myNewShape';
 
@@ -112,14 +127,17 @@ This contains algorithms and utilities for calculating intersection points for v
 ## Shape Intersection Functions
 
 ### 1. `Ellipse`
+
 Calculates the intersection points for an ellipse.
 
 **Usage**:
+
 ```javascript
 import intersectEllipse from './intersect-ellipse.js';
 
 const intersection = intersectEllipse(node, rx, ry, point);
 ```
+
 - **Parameters**:
   - `node`: The SVG node element.
   - `rx`: The x-radius of the ellipse.
@@ -127,44 +145,49 @@ const intersection = intersectEllipse(node, rx, ry, point);
   - `point`: The point from which the intersection is calculated.
 
 ### 2. `intersectRect`
+
 Calculates the intersection points for a rectangle.
 
 **Usage**:
+
 ```javascript
 import intersectRect from './intersect-rect.js';
 
 const intersection = intersectRect(node, point);
 ```
+
 - **Parameters**:
   - `node`: The SVG node element.
   - `point`: The point from which the intersection is calculated.
 
 ### 3. `intersectPolygon`
+
 Calculates the intersection points for a polygon.
 
 **Usage**:
+
 ```javascript
 import intersectPolygon from './intersect-polygon.js';
 
 const intersection = intersectPolygon(node, polyPoints, point);
 ```
+
 - **Parameters**:
   - `node`: The SVG node element.
   - `polyPoints`: Array of points defining the polygon.
   - `point`: The point from which the intersection is calculated.
 
-
 ## Cypress Tests
 
-To ensure the robustness of the flowchart shapes, there are implementation of comprehensive Cypress test cases in ```newShapes.spec.ts``` file. These tests cover various aspects such as:
+To ensure the robustness of the flowchart shapes, there are implementation of comprehensive Cypress test cases in `newShapes.spec.ts` file. These tests cover various aspects such as:
 
 - **Shapes**: Testing new shapes like `bowTieRect`, `waveRectangle`, `trapezoidalPentagon`, etc.
 - **Looks**: Verifying shapes under different visual styles (`classic` and `handDrawn`).
-- **Directions**: Ensuring correct rendering in all flow directions of arrows : 
-  - `TB` ```(Top -> Bottom)```
-  - `BT` ```(Bottom -> Top)```
-  - `LR` ```(Left -> Right)```
-  - `RL` ```(Right -> Left)```
+- **Directions**: Ensuring correct rendering in all flow directions of arrows :
+  - `TB` `(Top -> Bottom)`
+  - `BT` `(Bottom -> Top)`
+  - `LR` `(Left -> Right)`
+  - `RL` `(Right -> Left)`
 - **Labels**: Testing shapes with different labels, including:
   - No labels
   - Short labels
@@ -180,8 +203,12 @@ To run the Cypress tests, follow these steps:
 1. Ensure you have all dependencies installed by running:
    ```bash
    npm install
+   ```
 2. Start the Cypress test runner:
-   ```bash 
+
+   ```bash
    cypress open --env updateSnapshots=true
 
-3. Select the test suite from the Cypress interface to run all the flowchart shape tests.
\ No newline at end of file
+   ```
+
+3. Select the test suite from the Cypress interface to run all the flowchart shape tests.