style: improve MDX content formatting and JSX attribute consistency.

Signed-off-by: Lee Calcote <lee.calcote@layer5.io>

Author: leecalcote

content-learn/mastering-kubernetes-for-engineers/deploying-wordpress-and-mysql-with-persistent-volumes-with-meshery/sql/import-designs.mdx

@@ -24,18 +24,14 @@ import wp7 from "../../../../src/assets/images/learning-path/sql/wp7.png";
    - Select `Kubernetes Manifest` from the "Design Type" dropdown menu.
 
 <br />
-<a href={wp1}>
-  <img src={wp1} width="100%" align="center" />
-</a>
+<a href={wp1}><img src={wp1} width="100%" align="center" /></a>
 
 _Figure: Import modal_
 
 - Choose `File Upload` for the upload method, and select the file you just downloaded.
 - Then, click on `Import`.
   <br />
-  <a href={wp2}>
-  <img src={wp2} width="100%" align="center" />
-</a>
+  <a href={wp2}><img src={wp2} width="100%" align="center" /></a>
 
   _Figure: Import mysql-deployment_
 
@@ -44,22 +40,18 @@ _Figure: Import modal_
    Clicking on the names of the designs on the `Designs` tab displays the visual representations of the various Kubernetes resources and their relationships on the canvas.
 
    <br />
-   <a href={wp3}>
-  <img src={wp3} width="100%" align="center" />
-</a>
+   <a href={wp3}><img src={wp3} width="100%" align="center" /></a>
 
   _Figure: Imported designs on canvas_
 
 4. Now, follow the same steps to import the `wordpress-deployment` file.
 
 <br />
-<a href={wp4}>
-  <img src={wp4} width="100%" align="center" />
-</a>
+<a href={wp4}><img src={wp4} width="100%" align="center" /></a>
 
 _Figure: wordpress-deployment_
 
-<h2 class="chapter-sub-heading">Merging the Designs</h2>
+<h2 className="chapter-sub-heading">Merging the Designs</h2>
 
 Next, you will combine the WordPress and MySQL designs into a single design file. By merging these designs, you can manage and deploy both resources together.
 
@@ -69,27 +61,21 @@ To merge the MySQL deployment design with the WordPress deployment design:
 
 <br />
 
-<a href={wp5}>
-  <img src={wp5} width="100%" align="center" />
-</a>
+<a href={wp5}><img src={wp5} width="100%" align="center" /></a>
 
 _Figure: drag and drop design_
 
 2. This action will open a merge modal asking if you want to merge the design, Click on `Merge`.
 
 <br />
-<a href={wp6}>
-  <img src={wp6} width="100%" align="center" />
-</a>
+<a href={wp6}><img src={wp6} width="100%" align="center" /></a>
 
 _Figure: merge modal_
 
 3. Click on `Save As` and enter `wordpress-mysql-deployment` as the new file name.
 
 <br />
-<a href={wp7}>
-  <img src={wp7} width="100%" align="center" />
-</a>
+<a href={wp7}><img src={wp7} width="100%" align="center" /></a>
 
 _Figure: save design_
 

content-learn/mastering-service-meshes-for-developers/introduction-to-service-meshes/linkerd/getting-started.mdx

@@ -13,11 +13,11 @@ import InstallLinkerd from "../../../../src/assets/images/learn-layer5/linkerd/i
 
 <ChapterStyle>
 
-<h2 class="chapter-sub-heading">Setup Linkerd</h2>
+<h2 className="chapter-sub-heading">Setup Linkerd</h2>
 
 Now that we have a Kubernetes cluster and Meshery, we are ready to download and deploy Linkerd resources.
 
-<h2 class="chapter-sub-heading">Steps</h2>
+<h2 className="chapter-sub-heading">Steps</h2>
 
 1. [Install Linkerd](#1)
 1. [Verify install](#2)
@@ -29,24 +29,20 @@ Now that we have a Kubernetes cluster and Meshery, we are ready to download and
 
 Using Meshery, select `Linkerd` from the `Management` menu.
 
-<a href={LinkerdAdapter}>
-  <img src={LinkerdAdapter} />
-</a>
+<a href={LinkerdAdapter}><img src={LinkerdAdapter} /></a>
 
 In the Linkerd management page:
 
 1. Type `linkerd` into the namespace field.
 1. Click the (+) icon on the `Install` card and select `Latest Linkerd` to install the latest version of Linkerd.
 
-   <a href={InstallLinkerd}>
-     <img src={InstallLinkerd} align="center" />
-   </a>{" "}
+   <a href={InstallLinkerd}><img src={InstallLinkerd} align="center" /></a>{" "}
 
 <h3>Alternative: Manual Installation</h3>
 
 Perform the below steps if the above steps doesn't work for you.
 
-<h4 class="chapter-alt-heading">Download `linkerd` CLI</h4>
+<h4 className="chapter-alt-heading">Download `linkerd` CLI</h4>
 
 On a \*nix system, you can setup linkerd by doing the following:
 
@@ -77,7 +73,7 @@ We can use a new feature in linkerd to check if the cluster is ready for install
 linkerd check --pre
 ```
 
-<h4 class="chapter-alt-heading">Install Linkerd:</h4>
+<h4 className="chapter-alt-heading">Install Linkerd:</h4>
 
 Deploy Linkerd custom resources:
 

gatsby-config.js

@@ -467,6 +467,9 @@ module.exports = {
       resolve: "gatsby-plugin-mdx",
       options: {
         extensions: [".mdx", ".md"],
+        mdxOptions: {
+          remarkPlugins: [],
+        },
         gatsbyRemarkPlugins: [],
       },
     },