Commit 17fc8383 authored by Steven's avatar Steven

fix(web): improve MemoEditor layout and timestamp popover styling

parent 150371d2
......@@ -192,7 +192,7 @@ const Editor = forwardRef(function Editor(props: EditorProps, ref: React.Forward
>
<textarea
className={cn(
"w-full my-1 text-base resize-none overflow-x-hidden overflow-y-auto bg-transparent outline-none placeholder:opacity-70 whitespace-pre-wrap break-words",
"w-full text-base resize-none overflow-x-hidden overflow-y-auto bg-transparent outline-none placeholder:opacity-70 whitespace-pre-wrap wrap-break-word",
// Focus mode: flex-1 h-0 to grow within flex container; Normal: h-full to fill wrapper
isFocusMode ? "flex-1 h-0" : "h-full",
)}
......
......@@ -67,7 +67,7 @@ export const TimestampPopover: FC = () => {
<PopoverTrigger asChild>
<button
type="button"
className="w-full text-sm text-muted-foreground -mb-1 text-left hover:text-foreground transition-colors cursor-pointer"
className="w-auto text-sm text-muted-foreground text-left hover:text-foreground transition-colors cursor-pointer"
>
{formatDate(createTime)}
</button>
......
......@@ -133,7 +133,11 @@ const MemoEditorImpl: React.FC<MemoEditorProps> = ({
{/* Exit button is absolutely positioned in top-right corner when active */}
<FocusModeExitButton isActive={state.ui.isFocusMode} onToggle={handleToggleFocusMode} title={t("editor.exit-focus-mode")} />
{memoName && <TimestampPopover />}
{memoName && (
<div className="w-full -mb-1">
<TimestampPopover />
</div>
)}
{/* Editor content grows to fill available space in focus mode */}
<EditorContent ref={editorRef} placeholder={placeholder} autoFocus={autoFocus} />
......
......@@ -35,7 +35,7 @@
"confirm": "Confirm",
"copy": "Copy",
"create": "Create",
"created-at": "Created At",
"created-at": "Created at",
"database": "Database",
"day": "Day",
"days": "Days",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment