checklist rebuild
This commit is contained in:
@@ -3,7 +3,7 @@ import { createTiptapEditor } from "solid-tiptap";
|
||||
import StarterKit from "@tiptap/starter-kit";
|
||||
import Placeholder from "@tiptap/extension-placeholder";
|
||||
import TaskList from "@tiptap/extension-task-list";
|
||||
import TaskItem from "@tiptap/extension-task-item";
|
||||
import { CustomTaskItem } from "./CustomTaskItem";
|
||||
import Image from "@tiptap/extension-image";
|
||||
import Underline from "@tiptap/extension-underline";
|
||||
import { X } from "lucide-solid";
|
||||
@@ -57,7 +57,7 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
||||
class: "not-prose pl-2",
|
||||
},
|
||||
}),
|
||||
TaskItem.configure({
|
||||
CustomTaskItem.configure({
|
||||
nested: true,
|
||||
HTMLAttributes: {
|
||||
class: "flex gap-2 items-start my-1",
|
||||
@@ -91,12 +91,10 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
||||
// Custom Task List Styling
|
||||
"[&_ul[data-type='taskList']]:list-none [&_ul[data-type='taskList']]:p-0",
|
||||
"[&_li[data-type='taskItem']]:flex [&_li[data-type='taskItem']]:items-start",
|
||||
"[&_li[data-type='taskItem']>label]:mr-3 [&_li[data-type='taskItem']>label]:mt-1 [&_li[data-type='taskItem']>label]:select-none",
|
||||
"[&_li[data-type='taskItem']>label>input]:w-5 [&_li[data-type='taskItem']>label>input]:h-5 [&_li[data-type='taskItem']>label>input]:cursor-pointer",
|
||||
"[&_li[data-type='taskItem']>div]:flex-1 [&_li[data-type='taskItem']>div]:min-w-0 [&_li[data-type='taskItem']>div]:min-h-[1.5rem]",
|
||||
"[&_li[data-type='taskItem']>div>p]:min-h-[1.5rem] [&_li[data-type='taskItem']>div>p]:m-0 [&_li[data-type='taskItem']>div>p]:w-full",
|
||||
"[&_li[data-type='taskItem']>div>p:empty]:after:content-['\\200B'] [&_li[data-type='taskItem']>div>p:empty]:after:inline-block",
|
||||
"[&_li[data-type='taskItem']>div>p>br]:after:content-['\\200B'] [&_li[data-type='taskItem']>div>p>br]:after:inline-block", // if tiptap adds br
|
||||
"[&_.tiptap-task-content]:flex-1 [&_.tiptap-task-content]:min-w-0 [&_.tiptap-task-content]:min-h-[1.5rem]",
|
||||
"[&_.tiptap-task-content>p]:min-h-[1.5rem] [&_.tiptap-task-content>p]:m-0 [&_.tiptap-task-content>p]:w-full",
|
||||
"[&_.tiptap-task-content>p:empty]:after:content-['\\200B'] [&_.tiptap-task-content>p:empty]:after:inline-block",
|
||||
"[&_.tiptap-task-content>p>br]:after:content-['\\200B'] [&_.tiptap-task-content>p>br]:after:inline-block", // if tiptap adds br
|
||||
props.class
|
||||
),
|
||||
},
|
||||
@@ -123,7 +121,7 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
||||
return (
|
||||
<div class="relative w-full h-full flex flex-col">
|
||||
<div
|
||||
class="absolute -top-4 -left-4 -right-4 h-8 cursor-pointer group flex items-center justify-center z-10"
|
||||
class="absolute -top-6 -left-4 -right-4 h-8 cursor-pointer group flex items-center justify-center z-10"
|
||||
onClick={() => {
|
||||
const e = editor();
|
||||
if (!e) return;
|
||||
@@ -131,7 +129,7 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
||||
}}
|
||||
title="Add empty line at the top"
|
||||
>
|
||||
<span class="opacity-0 group-hover:opacity-100 text-[10px] uppercase font-bold text-muted-foreground tracking-widest transition-opacity mt-2">
|
||||
<span class="opacity-0 group-hover:opacity-100 text-[10px] uppercase font-bold text-muted-foreground tracking-widest transition-opacity mt-1">
|
||||
Click to insert newline above
|
||||
</span>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user