docs: new cli install fragment

assets/docs/fragments/cli-installation.md

@@ -0,0 +1,62 @@
+### CLI Installation
+Follow the [AsyncAPI CLI installation](https://github.com/asyncapi/cli#installation) instructions below, based on your computer’s operating system.
+
+<details>
+<summary>MacOS</summary>
+
+`brew`
+<br/>
+You can install in MacOS via brew: `brew install asyncapi`.
+
+`pkg`
+<br/>
+Each release of CLI produces a MacOS dedicated pkg file that enables you to install this CLI as MacOS application.
+
+```
+# Download latest release. To download specific release, your link should look similar to https://github.com/asyncapi/cli/releases/download/v0.13.0/asyncapi.pkg. All releases are listed in https://github.com/asyncapi/cli/releases
+curl -OL https://github.com/asyncapi/cli/releases/latest/download/asyncapi.pkg
+# Install AsyncAPI CLI
+sudo installer -pkg asyncapi.pkg -target /
+```
+
+</details>
+
+<details>
+<summary>Linux</summary>
+
+You can install in Linux via `dpkg`, a debian package manager:
+
+1. `curl -OL https://github.com/asyncapi/cli/releases/latest/download/asyncapi.deb` 
+2. `sudo dpkg -i asyncapi.deb`
+
+</details>
+
+<details>
+<summary>Other OS</summary>
+
+[Read further AsyncAPI CLI installation instructions for different operating systems](https://github.com/asyncapi/cli#installation).
+</details>
+
+#### Using NPM and Node.js
+Alternitavely, you can install the [AsyncAPI CLI](https://github.com/asyncapi/cli#installation) with Node.js `>=v10` and [NPM](https://nodejs.org/en/download/package-manager/).
+
+<details>
+<summary>Install CLI globally</summary>
+
+Install AsyncAPI CLI _globally_ with the following command:
+
+```
+npm install -g @asyncapi/cli
+```
+</details>
+
+<details>
+<summary>Install specific CLI version</summary>
+
+To install a specific version of the AsyncAPI CLI, pass the `verion` during installation:
+
+```
+npm install -g @asyncapi/cli@{version}
+```
+
+</details>

components/MDX.js

@@ -38,7 +38,7 @@ function getMDXComponents() {
     h1: props => <h1 {...props} className={`${props.className || ''} my-4 font-heading antialiased font-semibold tracking-heading text-gray-900 text-2xl`} />,
     h2: props => <h2 {...props} className={`${props.className || ''} mb-4 mt-6 font-heading antialiased font-semibold tracking-heading text-gray-900 text-2xl`} />,
     h3: props => <h3 {...props} className={`${props.className || ''} mb-4 mt-6 font-heading antialiased font-medium tracking-heading text-gray-900 text-lg`} />,
-    h4: props => <h4 {...props} className={`${props.className || ''} my-4 font-heading antialiased font-medium text-lg text-gray-900`} />,
+    h4: props => <h4 {...props} className={`${props.className || ''} my-4 font-heading antialiased font-medium text-md text-gray-900`} />,
     h5: props => <h5 {...props} className={`${props.className || ''} my-4 font-heading antialiased text-md font-bold`} />,
     h6: props => <h6 {...props} className={`${props.className || ''} my-4 font-heading antialiased text-sm font-bold text-gray-900 uppercase`} />,
     blockquote: props => <blockquote {...props} className={`${props.className || ''} italic font-body antialiased text-gray-700 border-l-4 border-gray-400 pl-4 pt-1 pb-1 pr-1 my-4 bg-white`} />,