change order of examples

Author: devalog

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

@@ -57,83 +57,83 @@ documentation site with the same language will automatically sync and switch to
 match. Language preferences are stored in client-side local storage and persist
 across browser sessions.
 
-Tabs **without** the `language` property don't stay in sync with other tabs on your site. In the below example, choosing a language in
-either set of tabs doesn't affect the other set of tabs:
+In the example below, choosing a language in either set of tabs will automatically update both sets to match:
 
 <Tabs>
-  <Tab title="TypeScript">
+  <Tab title="TypeScript" language="typescript">
     ```typescript
     console.log("First code block!");
     ```
   </Tab>
-  <Tab title="Python">
+  <Tab title="Python" language="python">
     ```python
     print("First code block!")
     ```
   </Tab>
-  <Tab title="Java">
+  <Tab title="Java" language="java">
     ```java
     System.out.println("First code block!");
     ```
   </Tab>
 </Tabs>
 
 <Tabs>
-  <Tab title="TypeScript">
+  <Tab title="TypeScript" language="typescript">
     ```typescript
-    console.log("Second code block – this won't sync with the one above!");
+    console.log("Second code block – language syncs with the one above!");
     ```
   </Tab>
-  <Tab title="Python">
+  <Tab title="Python" language="python">
     ```python
-    print("Second code block – this won't sync with the one above!")
+    print("Second code block – language syncs with the one above!")
     ```
   </Tab>
-  <Tab title="Java">
+  <Tab title="Java" language="java">
     ```java
-    System.out.println("Second code block – this won't sync with the one above!");
+    System.out.println("Second code block – language syncs with the one above!");
     ```
   </Tab>
 </Tabs>
 
-Compare this to tabs **with** the `language` property. Choosing a language in either set below will automatically update both sets to match:
+<Note title="Tabs and CodeBlocks integration">
+  Language-enabled `Tabs` automatically synchronize with [`CodeBlocks` in that same language](/docs/writing-content/components/code-blocks#language-synchronization).
+</Note>
+
+Tabs **without** the `language` property don't stay in sync with other tabs on your site. In the below example, choosing a language in
+either set of tabs doesn't affect the other set of tabs:
 
 <Tabs>
-  <Tab title="TypeScript" language="typescript">
+  <Tab title="TypeScript">
     ```typescript
     console.log("First code block!");
     ```
   </Tab>
-  <Tab title="Python" language="python">
+  <Tab title="Python">
     ```python
     print("First code block!")
     ```
   </Tab>
-  <Tab title="Java" language="java">
+  <Tab title="Java">
     ```java
     System.out.println("First code block!");
     ```
   </Tab>
 </Tabs>
 
 <Tabs>
-  <Tab title="TypeScript" language="typescript">
+  <Tab title="TypeScript">
     ```typescript
-    console.log("Second code block – language syncs with the one above!");
+    console.log("Second code block – this won't sync with the one above!");
     ```
   </Tab>
-  <Tab title="Python" language="python">
+  <Tab title="Python">
     ```python
-    print("Second code block – language syncs with the one above!")
+    print("Second code block – this won't sync with the one above!")
     ```
   </Tab>
-  <Tab title="Java" language="java">
+  <Tab title="Java">
     ```java
-    System.out.println("Second code block – language syncs with the one above!");
+    System.out.println("Second code block – this won't sync with the one above!");
     ```
   </Tab>
 </Tabs>
-
-<Note title="Tabs and CodeBlocks integration">
-  Language-enabled `Tabs` automatically synchronize with [`CodeBlocks` in that same language](/docs/writing-content/components/code-blocks#language-synchronization).
-</Note>