diff --git a/packages/effects/plugins/src/tiptap/style.css b/packages/effects/plugins/src/tiptap/style.css index 2d8052c1d..3f5f6cc8f 100644 --- a/packages/effects/plugins/src/tiptap/style.css +++ b/packages/effects/plugins/src/tiptap/style.css @@ -1,9 +1,5 @@ @reference "@vben/tailwind-config/theme"; -.vben-tiptap-content > * + * { - @apply mt-3; -} - .vben-tiptap-content h1 { @apply text-2xl font-bold leading-[1.4]; } @@ -50,8 +46,6 @@ .vben-tiptap-content img, .vben-tiptap-content .vben-tiptap__image { - @apply my-4 block h-auto rounded-2xl border border-border; - max-width: min(100%, 640px); } diff --git a/packages/effects/plugins/src/tiptap/tiptap.vue b/packages/effects/plugins/src/tiptap/tiptap.vue index 6dd99d3d8..2c4da366b 100644 --- a/packages/effects/plugins/src/tiptap/tiptap.vue +++ b/packages/effects/plugins/src/tiptap/tiptap.vue @@ -28,6 +28,7 @@ const props = withDefaults(defineProps(), { extensions: undefined, imageUpload: undefined, minHeight: 240, + maxHeight: 400, placeholder: $t('ui.tiptap.placeholder'), previewable: true, toolbar: true, @@ -41,9 +42,14 @@ const contentMinHeight = computed(() => ? `${props.minHeight}px` : props.minHeight, ); +const contentMaxHeight = computed(() => + typeof props.maxHeight === 'number' + ? `${props.maxHeight}px` + : props.maxHeight, +); const tiptapContentClass = cn( 'vben-tiptap-content vben-tiptap__content', - 'text-foreground min-h-(--vben-tiptap-min-height) leading-7 outline-none', + 'text-foreground max-h-(--vben-tiptap-max-height) min-h-(--vben-tiptap-min-height) overflow-auto leading-7 outline-none', ); const blobUrlTracker = new Set(); const editor = useEditor({ @@ -154,7 +160,10 @@ onBeforeUnmount(() => {