docs: audit grammar issues (#6203)

* docs: audit grammar mistakes

* fix code block language

* revert change

* let's get another

website/docs/guides/markdown-features/markdown-features-plugins.mdx

@@ -8,13 +8,13 @@ slug: /markdown-features/plugins
 Sometimes, you may want to extend or tweak your Markdown syntax. For example:
 
 - How do I embed youtube videos using the image syntax (`![](https://youtu.be/yKNxeF4KMsY)`)?
-- How do I style links that are on its own line differently, e.g., like a social card?
+- How do I style links that are on their own lines differently, e.g., as a social card?
 - How do I make every page start with a copyright notice?
 
 And the answer is: create an MDX plugin! MDX has a built-in [plugin system](https://mdxjs.com/advanced/plugins/) that can be used to customize how the Markdown files will be parsed and transformed to JSX. There are three typical use-cases of MDX plugins:
 
 - Using existing [remark plugins](https://github.com/remarkjs/remark/blob/main/doc/plugins.md#list-of-plugins) or [rehype plugins](https://github.com/rehypejs/rehype/blob/main/doc/plugins.md#list-of-plugins);
-- Creating remark/rehype plugins to tranform the elements generated by existing MDX syntax;
+- Creating remark/rehype plugins to transform the elements generated by existing MDX syntax;
 - Creating remark/rehype plugins to introduce new syntaxes to MDX.
 
 If you play with the [MDX playground](https://mdx-git-renovate-babel-monorepo-mdx.vercel.app/playground), you would notice that the MDX transpilation has two intermediate steps: Markdown AST (MDAST), and Hypertext AST (HAST), before arriving at the final JSX output. MDX plugins also come in two forms:
@@ -24,7 +24,7 @@ If you play with the [MDX playground](https://mdx-git-renovate-babel-monorepo-md
 
 :::tip
 
-Use plugins to introduce shorter syntax for the most commonly used JSX elements in your project. The [admonition](./markdown-features-admonitions.mdx) syntax that we offer is also generated by a [Remark plugin](https://github.com/elviswolcott/remark-admonitions), and you could do the same for your own use-case.
+Use plugins to introduce shorter syntax for the most commonly used JSX elements in your project. The [admonition](./markdown-features-admonitions.mdx) syntax that we offer is also generated by a [Remark plugin](https://github.com/elviswolcott/remark-admonitions), and you could do the same for your own use case.
 
 :::
 
@@ -41,7 +41,7 @@ These are all typical use-cases of Remark plugins, which can also be a source of
 
 ## Installing plugins {#installing-plugins}
 
-An MDX plugin is usually a npm package, so you install them like other npm packages using npm. Take the [math plugins](./markdown-features-math-equations.mdx) as example.
+An MDX plugin is usually an npm package, so you install them like other npm packages using npm. Take the [math plugins](./markdown-features-math-equations.mdx) as an example.
 
 ```bash npm2yarn
 npm install --save remark-math@3 rehype-katex@4
@@ -56,9 +56,9 @@ There's recently a trend in the Remark/Rehype ecosystem to migrate to ES Modules
 <details>
   <summary>How are <code>remark-math</code> and <code>rehype-katex</code> different?</summary>
 
-In case you are wondering how Remark and Rehype are different, here is a good example. `remark-math` operates on the Markdown AST, where it sees text like `$...$`, and all it does is transforms that to the JSX `<span class="math math-inline">...</span>` without doing too much with the content. This decouples the extraction of math formulae from their rendering, which means you can swap $\KaTeX$ out with other math renderers, like MathJax (with [`rehype-mathjax`](https://github.com/remarkjs/remark-math/tree/main/packages/rehype-mathjax)), just by replacing the Rehype plugin.
+In case you are wondering how Remark and Rehype are different, here is a good example. `remark-math` operates on the Markdown AST, where it sees text like `$...$`, and all it does is transform that to the JSX `<span class="math math-inline">...</span>` without doing too much with the content. This decouples the extraction of math formulae from their rendering, which means you can swap $\KaTeX$ out with other math renderers, like MathJax (with [`rehype-mathjax`](https://github.com/remarkjs/remark-math/tree/main/packages/rehype-mathjax)), just by replacing the Rehype plugin.
 
-Next, the `rehype-katex` operates on the Hypertext AST where everything has been converted to HTML-like tags already. It traverses all the elements with `math` class, and uses $\KaTeX$ to parse and render the content to actual HTML.
+Next, the `rehype-katex` operates on the Hypertext AST where everything has been converted to HTML-like tags already. It traverses all the elements with `math` class and uses $\KaTeX$ to parse and render the content to actual HTML.
 
 </details>
 
@@ -112,7 +112,7 @@ module.exports = {
 };
 ```
 
-You should check your plugin's documentation for options it supports.
+You should check your plugin's documentation for the options it supports.
 
 ## Creating new rehype/remark plugins
 
@@ -124,7 +124,7 @@ The writeup below is **not** meant to be a comprehensive guide to creating a plu
 
 :::
 
-For example, let's make a plugin that visits every `h2` heading and adds a `Section X. ` prefix. First, create your plugin source file anywhere—you can even publish it as a separate NPM package and install it like explained above. We would put ours at `src/remark/section-prefix.js`. A remark/rehype plugin is just a function that receives the `options` and returns a `transformer` which operates on the AST.
+For example, let's make a plugin that visits every `h2` heading and adds a `Section X. ` prefix. First, create your plugin source file anywhere—you can even publish it as a separate NPM package and install it like explained above. We would put ours at `src/remark/section-prefix.js`. A remark/rehype plugin is just a function that receives the `options` and returns a `transformer` that operates on the AST.
 
 ```js "src/remark/section-prefix.js"
 const visit = require('unist-util-visit');