From 576813588d047dc7df5c118c36dff8d8176b8f42 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Philipp=20Ku=CC=88hn?= <kontakt@philipp-kuehn.com>
Date: Mon, 8 Mar 2021 13:43:33 +0100
Subject: [PATCH] update svelte example again

---
 docs/src/docPages/installation/svelte.md | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/docs/src/docPages/installation/svelte.md b/docs/src/docPages/installation/svelte.md
index 862531dd..d1d9f8ed 100644
--- a/docs/src/docPages/installation/svelte.md
+++ b/docs/src/docPages/installation/svelte.md
@@ -7,7 +7,7 @@ The following guide describes how to integrate tiptap with your Svelte project.
 
 TODO
 
-Svelte REPL: https://svelte.dev/repl/c839da77db2444e5b23a752266613639?version=3.31.2
+Svelte REPL: https://svelte.dev/repl/3651789dcfcb40de80b1ba36263d4bbd?version=3.31.2
 
 App.svelte
 ```html
@@ -24,18 +24,22 @@ Editor.svelte
   import { onMount, onDestroy } from 'svelte'
   import { Editor } from '@tiptap/core'
   import { defaultExtensions } from '@tiptap/starter-kit'
+
   let element
   let editor
+
   onMount(() => {
     editor = new Editor({
       element: element,
       extensions: defaultExtensions(),
+      content: '<p>Hello <strong>Svelte</strong>!<p>',
       onTransaction: () => {
         // force re-render so `editor.isActive` works as expected
         editor = editor
       },
     })
   })
+
   onDestroy(() => {
     editor.destroy()
   })
@@ -54,4 +58,11 @@ Editor.svelte
 {/if}
 
 <div bind:this={element} />
+
+<style>
+  button.active {
+    background: black;
+    color: white;
+  }
+</style>
 ```