diff --git a/frontend-v2/src/lib/components/layout/AppShell.svelte b/frontend-v2/src/lib/components/layout/AppShell.svelte
index f4c44b7..d034b21 100644
--- a/frontend-v2/src/lib/components/layout/AppShell.svelte
+++ b/frontend-v2/src/lib/components/layout/AppShell.svelte
@@ -79,6 +79,21 @@
if (file) handleUpload(file);
}
+ function onPasteBox(e: ClipboardEvent) {
+ const items = e.clipboardData?.items;
+ if (!items) return;
+ for (const item of items) {
+ if (item.type.startsWith('image/')) {
+ const file = item.getAsFile();
+ if (file) {
+ e.preventDefault();
+ handleUpload(file);
+ }
+ break;
+ }
+ }
+ }
+
// Brain sidebar sub-items
interface BrainFolder { id: string; name: string; item_count: number; }
interface BrainTag { id: string; name: string; item_count: number; }
@@ -144,10 +159,15 @@
e.preventDefault()} ondrop={onRailDrop}>
-
+
+
+
+ {#if uploadStatus === 'uploading'}Uploading...{:else if uploadStatus === 'done'}Saved!{:else}Paste screenshot{/if}
+
+
+
@@ -415,24 +435,49 @@
border-top: 1px solid var(--shell-line);
}
- .rail-upload {
+ .rail-upload-row {
display: flex;
- align-items: center;
- gap: 8px;
- padding: 9px 12px;
- border-radius: 999px;
+ gap: 4px;
+ align-items: stretch;
+ }
+ .paste-box {
+ flex: 1;
+ padding: 7px 10px;
+ border-radius: 10px;
border: 1px dashed var(--shell-line);
background: none;
color: var(--shell-muted);
- font-size: 0.78rem;
+ font-size: 0.72rem;
font-family: inherit;
+ cursor: text;
+ transition: all 160ms;
+ outline: none;
+ min-height: 0;
+ overflow: hidden;
+ white-space: nowrap;
+ }
+ .paste-box:focus {
+ border-color: var(--shell-ink);
+ border-style: solid;
+ color: var(--shell-ink);
+ background: rgba(255,255,255,0.2);
+ }
+ .upload-icon-btn {
+ width: 32px;
+ flex-shrink: 0;
+ border-radius: 10px;
+ border: 1px solid var(--shell-line);
+ background: none;
+ color: var(--shell-muted);
+ display: flex;
+ align-items: center;
+ justify-content: center;
cursor: pointer;
transition: all 160ms;
}
- .rail-upload:hover {
- border-color: var(--shell-ink);
- color: var(--shell-ink);
+ .upload-icon-btn:hover {
background: rgba(255,255,255,0.3);
+ color: var(--shell-ink);
}
.rail-date {