add content

docs/src/demos/Marks/TextStyle/index.vue

@@ -3,9 +3,18 @@
     <button @click="editor.chain().focus().fontFamily('Inter').run()">
       Inter
     </button>
-    <button @click="editor.chain().focus().fontFamily('Comic Sans MS').run()">
+    <button @click="editor.chain().focus().fontFamily('Comic Sans MS, Comic Sans').run()">
       Comic Sans
     </button>
+    <button @click="editor.chain().focus().fontFamily('serif').run()">
+      serif
+    </button>
+    <button @click="editor.chain().focus().fontFamily('monospace').run()">
+      monospace
+    </button>
+    <button @click="editor.chain().focus().fontFamily('cursive').run()">
+      cursive
+    </button>
 
     <editor-content :editor="editor" />
   </div>

docs/src/docPages/api/extensions/font-family.md

@@ -0,0 +1,20 @@
+# FontFamily
+
+## Installation
+::: warning Use with TextStyle
+This extension requires the [`TextStyle`](/api/nodes/text-style) mark.
+:::
+
+```bash
+# with npm
+npm install @tiptap/extension-font-family
+
+# with Yarn
+yarn add @tiptap/extension-font-family
+```
+
+## Source code
+[packages/extension-font-family/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-font-family/)
+
+## Usage
+<demo name="Extensions/FontFamily" highlight="" />

docs/src/docPages/api/marks/text-style.md

@@ -1,11 +1,12 @@
 # Text Style
+This mark renders a `<span>` HTML tag and enables you to add a list of styling related attributes, for example font-family, font-size, or font-color. The extension doesn’t add any styling attribute by default, but other extensions use it as the foundation, for example `FontFamily`.
 
 ## Installation
 ```bash
-# With npm
+# with npm
 npm install @tiptap/extension-text-style
 
-# Or: With Yarn
+# with Yarn
 yarn add @tiptap/extension-text-style
 ```
 

docs/src/docPages/api/nodes/bullet-list.md

@@ -5,7 +5,7 @@ Type <code>*&nbsp;</code>, <code>-&nbsp;</code> or <code>+&nbsp;</code> at the b
 
 ## Installation
 ::: warning Use with ListItem
-This extension requires the [`ListItem`](/api/nodes/list-item) extension.
+This extension requires the [`ListItem`](/api/nodes/list-item) node.
 :::
 
 ```bash

docs/src/docPages/api/nodes/list-item.md

@@ -3,7 +3,7 @@ The ListItem extension adds support for the `<li>` HTML tag. It’s used for bul
 
 ## Installation
 ::: warning Use with BulletList and/or OrderedList
-This extension requires the [`BulletList`](/api/nodes/bullet-list) or [`OrderedList`](/api/nodes/ordered-list) extension.
+This extension requires the [`BulletList`](/api/nodes/bullet-list) or [`OrderedList`](/api/nodes/ordered-list) node.
 :::
 
 ```bash

docs/src/docPages/api/nodes/ordered-list.md

@@ -5,7 +5,7 @@ Type <code>1.&nbsp;</code> (or any other number followed by a dot) at the beginn
 
 ## Installation
 ::: warning Use with ListItem
-This extension requires the [`ListItem`](/api/nodes/list-item) extension.
+This extension requires the [`ListItem`](/api/nodes/list-item) node.
 :::
 
 ```bash

docs/src/docPages/api/nodes/task-item.md

@@ -5,7 +5,7 @@ This extension doesn’t require any JavaScript framework, it’s based on plain
 
 ## Installation
 ::: warning Use with TaskList
-This extension requires the [`TaskList`](/api/nodes/task-list) extension.
+This extension requires the [`TaskList`](/api/nodes/task-list) node.
 :::
 
 ```bash

docs/src/links.yaml

@@ -132,6 +132,8 @@
           link: /api/extensions/dropcursor
         - title: Focus
           link: /api/extensions/focus
+        - title: FontFamily
+          link: /api/extensions/font-family
         - title: Gapcursor
           link: /api/extensions/gapcursor
         - title: History