docs: update content

2021-03-09 11:17:48 +01:00
parent d49af82a85
commit 6f38e15450
7 changed files with 231 additions and 12 deletions
--- a/docs/src/demos/Guide/NodeViews/VueComponentContent/Component.vue
+++ b/docs/src/demos/Guide/NodeViews/VueComponentContent/Component.vue
@@ -0,0 +1,47 @@
+<template>
+  <node-view-wrapper class="vue-component">
+    <span class="label">Vue Component</span>
+
+    <node-view-content class="content" />
+  </node-view-wrapper>
+</template>
+
+<script>
+import { NodeViewWrapper, NodeViewContent } from '@tiptap/vue-2'
+
+export default {
+  components: {
+    NodeViewWrapper,
+    NodeViewContent,
+  },
+}
+</script>
+
+<style lang="scss">
+.vue-component {
+  border: 1px solid #adb5bd;
+  border-radius: 0.5rem;
+  margin: 1rem 0;
+  position: relative;
+}
+
+.label {
+  margin-left: 1rem;
+  background-color: #adb5bd;
+  font-size: 0.6rem;
+  letter-spacing: 1px;
+  font-weight: bold;
+  text-transform: uppercase;
+  color: #fff;
+  position: absolute;
+  top: 0;
+  padding: 0.25rem 0.75rem;
+  border-radius: 0 0 0.5rem 0.5rem;
+}
+
+.content {
+  margin: 2.5rem 1rem 1rem;
+  padding: 1rem;
+  border: 1px dashed #adb5bd;
+}
+</style>