Tabe controls stable
This commit is contained in:
@@ -134,8 +134,8 @@ export const TableBubbleMenu: Component<TableBubbleMenuProps> = (props) => {
|
|||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
class={cn(
|
class={cn(
|
||||||
"sticky top-0 z-[150] w-full bg-background/80 backdrop-blur-md border-b border-border transition-all duration-300 ease-in-out overflow-hidden flex flex-col",
|
"relative z-[150] w-full bg-background/80 backdrop-blur-md border-b border-border transition-all duration-300 ease-in-out overflow-hidden flex flex-col",
|
||||||
isVisible() ? "h-10 opacity-100 mb-2" : "h-0 opacity-0 pointer-events-none"
|
isVisible() ? "h-9 opacity-100" : "h-0 opacity-0 pointer-events-none"
|
||||||
)}
|
)}
|
||||||
onMouseDown={(e) => {
|
onMouseDown={(e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|||||||
@@ -233,10 +233,10 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
|
|||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
class="w-full sm:max-w-2xl px-0 sm:px-0 flex flex-col h-full bg-background border-l border-border shadow-2xl"
|
class="w-full sm:max-w-2xl p-0 gap-0 flex flex-col h-full bg-background border-l border-border shadow-2xl"
|
||||||
>
|
>
|
||||||
{/* Header Area */}
|
{/* Header Area */}
|
||||||
<div class="px-6 pt-6 pb-2 shrink-0">
|
<div class="px-6 pt-6 pb-0 shrink-0">
|
||||||
<div class="flex items-start gap-4">
|
<div class="flex items-start gap-4">
|
||||||
<div class="shrink-0 mt-0.5">
|
<div class="shrink-0 mt-0.5">
|
||||||
<Select<any>
|
<Select<any>
|
||||||
@@ -496,7 +496,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Content Area */}
|
{/* Content Area */}
|
||||||
<div class="flex-1 overflow-y-auto px-6 py-4 pb-20 flex flex-col gap-6">
|
<div class="flex-1 overflow-y-auto px-6 pb-20 flex flex-col">
|
||||||
<Suspense fallback={<div class="h-32 animate-pulse bg-muted/20 rounded-lg" />}>
|
<Suspense fallback={<div class="h-32 animate-pulse bg-muted/20 rounded-lg" />}>
|
||||||
<TaskEditor
|
<TaskEditor
|
||||||
content={props.task.content}
|
content={props.task.content}
|
||||||
|
|||||||
@@ -322,9 +322,13 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
|||||||
|
|
||||||
// Handle full screen images as before
|
// Handle full screen images as before
|
||||||
return (
|
return (
|
||||||
<div class="relative w-full flex flex-col flex-1">
|
<div class="w-full h-full flex flex-col">
|
||||||
|
<Show when={editor()}>
|
||||||
|
{(e) => <TableBubbleMenu editor={e()} />}
|
||||||
|
</Show>
|
||||||
|
<div class="w-full flex-1 flex flex-col">
|
||||||
<div
|
<div
|
||||||
class="absolute -top-6 -left-4 -right-4 h-8 cursor-pointer group flex items-center justify-center z-10"
|
class="w-full h-8 cursor-pointer group flex items-center justify-center shrink-0 transition-all"
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const e = editor();
|
const e = editor();
|
||||||
if (!e) return;
|
if (!e) return;
|
||||||
@@ -332,13 +336,10 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
|||||||
}}
|
}}
|
||||||
title="Add empty line at the top"
|
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-1">
|
<span class="opacity-0 group-hover:opacity-100 text-[10px] uppercase font-bold text-muted-foreground tracking-widest transition-opacity">
|
||||||
Click to insert newline above
|
Click to insert newline above
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<Show when={editor()}>
|
|
||||||
{(e) => <TableBubbleMenu editor={e()} />}
|
|
||||||
</Show>
|
|
||||||
<div
|
<div
|
||||||
ref={editorRef}
|
ref={editorRef}
|
||||||
class="w-full flex-1 cursor-text"
|
class="w-full flex-1 cursor-text"
|
||||||
@@ -352,6 +353,7 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
|
|||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
{/* Note Preview Popover */}
|
{/* Note Preview Popover */}
|
||||||
<Show when={previewNote() && store.notes.find(n => n.id === previewNote()!.noteId)}>
|
<Show when={previewNote() && store.notes.find(n => n.id === previewNote()!.noteId)}>
|
||||||
|
|||||||
@@ -567,7 +567,7 @@ export const NotepadView: Component<{
|
|||||||
{/* Editor Instance */}
|
{/* Editor Instance */}
|
||||||
<div class={cn(
|
<div class={cn(
|
||||||
"grow shrink-0 flex flex-col",
|
"grow shrink-0 flex flex-col",
|
||||||
hasTopViewer() ? "border-none rounded-none p-0 shadow-none mb-0 min-h-full" : "min-h-[300px] mb-4 p-4 border border-border/50 rounded-xl bg-background shadow-sm"
|
hasTopViewer() ? "border-none rounded-none p-0 shadow-none mb-0 min-h-full" : "min-h-[300px] mb-4 px-4 pt-0 pb-4 border border-border/50 rounded-xl bg-background shadow-sm"
|
||||||
)}>
|
)}>
|
||||||
<TaskEditor
|
<TaskEditor
|
||||||
content={note().content}
|
content={note().content}
|
||||||
|
|||||||
Reference in New Issue
Block a user