fix: update svelte example

src/content/editor/getting-started/install/svelte.mdx

@@ -46,63 +46,70 @@ To actually start using Tiptap, you’ll need to add a new component to your app
 
 This is the fastest way to get Tiptap up and running with SvelteKit. It will give you a very basic version of Tiptap, without any buttons. No worries, you will be able to add more functionality soon.
 
-```html
+```svelte
 <script>
-  import { onMount, onDestroy } from 'svelte'
-  import { Editor } from '@tiptap/core'
-  import StarterKit from '@tiptap/starter-kit'
-
-  let element
-  let editor
-
-  onMount(() => {
-    editor = new Editor({
-      element: element,
-      extensions: [StarterKit],
-      content: '<p>Hello World! 🌍️ </p>',
-      onTransaction: () => {
-        // force re-render so `editor.isActive` works as expected
-        editor = editor
-      },
-    })
-  })
-
-  onDestroy(() => {
-    if (editor) {
-      editor.destroy()
-    }
-  })
+	import { onMount, onDestroy } from 'svelte';
+	import { Editor } from '@tiptap/core';
+	import StarterKit from '@tiptap/starter-kit';
+
+	let element;
+	let editor;
+
+	onMount(() => {
+		editor = new Editor({
+			element: element,
+			extensions: [StarterKit],
+			content: '<p>Hello World! 🌍️ </p>',
+			onTransaction: () => {
+				// force re-render so `editor.isActive` works as expected
+				editor = editor;
+			},
+		});
+	});
+
+	onDestroy(() => {
+		if (editor) {
+			editor.destroy();
+		}
+	});
 </script>
 
 {#if editor}
-<button on:click="{()" ="">
-  editor.chain().focus().toggleHeading({ level: 1}).run()} class:active={editor.isActive('heading',
-  { level: 1 })} > H1
-</button>
-<button on:click="{()" ="">
-  editor.chain().focus().toggleHeading({ level: 2 }).run()} class:active={editor.isActive('heading',
-  { level: 2 })} > H2
-</button>
-<button on:click="{()" ="">
-  editor.chain().focus().setParagraph().run()} class:active={editor.isActive('paragraph')}> P
-</button>
+	<button
+		on:click={() => editor.chain().focus().toggleHeading({ level: 1 }).run()}
+		class:active={editor.isActive('heading', { level: 1 })}
+	>
+		H1
+	</button>
+	<button
+		on:click={() => editor.chain().focus().toggleHeading({ level: 2 }).run()}
+		class:active={editor.isActive('heading', { level: 2 })}
+	>
+		H2
+	</button>
+	<button
+		on:click={() => editor.chain().focus().setParagraph().run()}
+		class:active={editor.isActive('paragraph')}
+	>
+		P
+	</button>
 {/if}
 
-<div bind:this="{element}" />
+<div bind:this={element} />
 
 <style>
-  button.active {
-    background: black;
-    color: white;
-  }
+	button.active {
+		background: black;
+		color: white;
+	}
 </style>
 ```
 
 ## Add it to your app
 
 Now, let’s replace the content of `src/routes/+page.svelte` with the following example code to use our new `Tiptap` component in our app.
 
-```html
+```svelte
 <script>
   import Tiptap from '$lib/Tiptap.svelte'
 </script>