Cardoza_Construction/TasGrid
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Tabe controls stable

Browse Source
This commit is contained in:
Timothy Cardoza
2026-03-13 16:11:57 -05:00
parent cb8c81c299
commit abbdb993d5
4 changed files with 39 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/TableBubbleMenu.tsx
+6 -6
View File
@@ -1,7 +1,7 @@
import { type Component, createSignal, createEffect, For } from "solid-js";
import {
Trash2,
Type
import {
Trash2,
Type
} from "lucide-solid";
import { cn } from "@/lib/utils";
import type { Editor } from "@tiptap/core";
@@ -132,10 +132,10 @@ export const TableBubbleMenu: Component<TableBubbleMenuProps> = (props) => {
];
return (
<div
<div
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",
isVisible() ? "h-10 opacity-100 mb-2" : "h-0 opacity-0 pointer-events-none"
"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-9 opacity-100" : "h-0 opacity-0 pointer-events-none"
)}
onMouseDown={(e) => {
e.preventDefault();
src/components/TaskDetail.tsx
+3 -3
View File
@@ -233,10 +233,10 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
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 */}
<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="shrink-0 mt-0.5">
<Select<any>
@@ -496,7 +496,7 @@ export const TaskDetail: Component<TaskDetailProps> = (props) => {
</div>
{/* 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" />}>
<TaskEditor
content={props.task.content}
src/components/TaskEditor.tsx
+29 -27
View File
@@ -322,36 +322,38 @@ export const TaskEditor: Component<TaskEditorProps> = (props) => {
// Handle full screen images as before
return (
<div class="relative w-full flex flex-col flex-1">
<div
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;
e.chain().insertContentAt(0, '<p></p>').focus('start').run();
}}
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">
Click to insert newline above
</span>
</div>
<div class="w-full h-full flex flex-col">
<Show when={editor()}>
{(e) => <TableBubbleMenu editor={e()} />}
</Show>
<div
ref={editorRef}
class="w-full flex-1 cursor-text"
onClick={(e) => {
const target = e.target as HTMLElement;
if (target.tagName.toLowerCase() === 'img') {
setFullscreenImage((target as HTMLImageElement).src);
} else if (e.target === editorRef) {
// Focus end if clicking on padding below content
editor()?.chain().focus().run();
}
}}
/>
<div class="w-full flex-1 flex flex-col">
<div
class="w-full h-8 cursor-pointer group flex items-center justify-center shrink-0 transition-all"
onClick={() => {
const e = editor();
if (!e) return;
e.chain().insertContentAt(0, '<p></p>').focus('start').run();
}}
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">
Click to insert newline above
</span>
</div>
<div
ref={editorRef}
class="w-full flex-1 cursor-text"
onClick={(e) => {
const target = e.target as HTMLElement;
if (target.tagName.toLowerCase() === 'img') {
setFullscreenImage((target as HTMLImageElement).src);
} else if (e.target === editorRef) {
// Focus end if clicking on padding below content
editor()?.chain().focus().run();
}
}}
/>
</div>
{/* Note Preview Popover */}
<Show when={previewNote() && store.notes.find(n => n.id === previewNote()!.noteId)}>
src/views/NotepadView.tsx
+1 -1
View File
@@ -567,7 +567,7 @@ export const NotepadView: Component<{
{/* Editor Instance */}
<div class={cn(
"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
content={note().content}