move supported lang into callout

Author: devalog

fern/products/docs/pages/component-library/default-components/code-blocks.mdx

@@ -4,7 +4,24 @@ description: 'Learn how to enhance your documentation with customizable code blo
 max-toc-depth: 2
 ---
 
-The `<CodeBlock>` component displays code examples with syntax highlighting powered by [Shiki](https://shiki.matsu.io/). Code blocks support line highlighting, focusing, titles, and deep linking to make your code examples more readable and interactive.
+The `<CodeBlock>` component displays code examples with syntax highlighting. Code blocks support line highlighting, focusing, titles, and deep linking to make your code examples more readable and interactive.
+
+<Note>
+  Fern supports [Shiki](https://shiki.matsu.io/) syntax highlighting for the following languages:
+
+  - `curl`
+  - `python`
+  - `javascript` (aliases: `js`, `node`)
+  - `typescript` (aliases: `ts`)
+  - `go`
+  - `ruby`
+  - `csharp`
+  - `php`
+  - `swift`
+  - `rust`
+
+  If you specify a language that's not on this list, Fern will still display the code block but without syntax highlighting.
+</Note>
 
 ## Usage
 
@@ -22,23 +39,6 @@ console.log("hello world")
 ```
 ````
 
-## Supported languages
-
-Fern supports syntax highlighting for the following languages in code blocks:
-
-- `curl`
-- `python`
-- `javascript` (aliases: `js`, `node`)
-- `typescript` (aliases: `ts`)
-- `go`
-- `ruby`
-- `csharp`
-- `php`
-- `swift`
-- `rust`
-
-If you specify a language that's not in this list, Fern will still display the code block but without syntax highlighting.
-
 ## Variants
 
 ### Titles