feat: rich text input

This commit is contained in:
Timothy J. Baek
2024-10-18 14:55:39 -07:00
parent 988a5e2b8d
commit 670441f548
5 changed files with 615 additions and 137 deletions

View File

@@ -34,6 +34,14 @@ math {
@apply rounded-lg;
}
.input-prose {
@apply prose dark:prose-invert prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line;
}
.input-prose-sm {
@apply prose dark:prose-invert prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line text-sm;
}
.markdown-prose {
@apply prose dark:prose-invert prose-p:my-0 prose-img:my-1 prose-headings:my-1 prose-pre:my-0 prose-table:my-0 prose-blockquote:my-0 prose-ul:-my-0 prose-ol:-my-0 prose-li:-my-0 whitespace-pre-line;
}
@@ -179,3 +187,21 @@ input[type='number'] {
.bg-gray-950-90 {
background-color: rgba(var(--color-gray-950, #0d0d0d), 0.9);
}
.ProseMirror {
@apply h-full;
}
.ProseMirror:focus {
outline: none;
}
.placeholder::after {
content: attr(data-placeholder);
cursor: text;
pointer-events: none;
float: left;
@apply absolute inset-0 z-0 text-gray-700 dark:text-gray-500;
}