From 6e7c4d584ff2e6725cbdc1f167663253abe392a2 Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 10 Mar 2026 03:22:06 +0000 Subject: [PATCH 1/3] Initial plan From 77eba765de1b65aca81dfeb77e24fa76a233732d Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 10 Mar 2026 03:29:26 +0000 Subject: [PATCH 2/3] Initial plan for Kindle UI fixes Co-authored-by: nkanf-dev <172456830+nkanf-dev@users.noreply.github.com> --- package-lock.json | 54 ----------------------------------------------- 1 file changed, 54 deletions(-) diff --git a/package-lock.json b/package-lock.json index a775569..876ebba 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1397,9 +1397,6 @@ "cpu": [ "arm64" ], - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1420,9 +1417,6 @@ "cpu": [ "arm64" ], - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1443,9 +1437,6 @@ "cpu": [ "riscv64" ], - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1466,9 +1457,6 @@ "cpu": [ "x64" ], - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1489,9 +1477,6 @@ "cpu": [ "x64" ], - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1667,9 +1652,6 @@ "arm" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1684,9 +1666,6 @@ "arm" ], "dev": true, - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1701,9 +1680,6 @@ "arm64" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1718,9 +1694,6 @@ "arm64" ], "dev": true, - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1735,9 +1708,6 @@ "loong64" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1752,9 +1722,6 @@ "loong64" ], "dev": true, - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1769,9 +1736,6 @@ "ppc64" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1786,9 +1750,6 @@ "ppc64" ], "dev": true, - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1803,9 +1764,6 @@ "riscv64" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1820,9 +1778,6 @@ "riscv64" ], "dev": true, - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ @@ -1837,9 +1792,6 @@ "s390x" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1854,9 +1806,6 @@ "x64" ], "dev": true, - "libc": [ - "glibc" - ], "license": "MIT", "optional": true, "os": [ @@ -1871,9 +1820,6 @@ "x64" ], "dev": true, - "libc": [ - "musl" - ], "license": "MIT", "optional": true, "os": [ From 3838b93012baa6fd5245ea2dbaff3f9f3e15288b Mon Sep 17 00:00:00 2001 From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com> Date: Tue, 10 Mar 2026 03:32:39 +0000 Subject: [PATCH 3/3] Fix Kindle-style UI: button hover borders, focus rings, and invisible icons Co-authored-by: nkanf-dev <172456830+nkanf-dev@users.noreply.github.com> --- src/app/App.css | 6 +++- src/index.css | 52 ---------------------------------- src/styles/HeldPagesPanel.css | 9 ++++-- src/styles/ReaderViewport.css | 6 ++++ src/styles/WorkspaceCanvas.css | 13 +++++---- 5 files changed, 25 insertions(+), 61 deletions(-) diff --git a/src/app/App.css b/src/app/App.css index 4a82c61..e048395 100644 --- a/src/app/App.css +++ b/src/app/App.css @@ -4,11 +4,14 @@ --kindle-gray: #6b7280; --kindle-border: #e8e4e0; --kindle-accent: #4a90e2; + --kindle-subtle: #c8c4be; + --kindle-danger: #ef4444; --font-serif: "Georgia", "Times New Roman", serif; } -/* 拖拽时全局禁止选中 */ +/* 拖拽/平移时全局禁止选中 */ body.is-dragging { user-select: none !important; cursor: grabbing !important; } +body.is-panning { user-select: none !important; cursor: grabbing !important; } /* 适配 UI 风格的滚动条 */ ::-webkit-scrollbar { width: 6px; height: 6px; } @@ -64,6 +67,7 @@ body, html { .kindle-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); } .kindle-btn:active { transform: scale(0.95); } .kindle-btn.outline { background: transparent; color: var(--kindle-ink); border: 1px solid var(--kindle-ink); } +.kindle-btn.outline:hover { background: var(--kindle-ink); color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.1); } .leaf-main-container { flex: 1; diff --git a/src/index.css b/src/index.css index 08a3ac9..1aa21cc 100644 --- a/src/index.css +++ b/src/index.css @@ -3,66 +3,14 @@ line-height: 1.5; font-weight: 400; - color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); - background-color: #242424; - font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - body { margin: 0; - display: flex; - place-items: center; min-width: 320px; min-height: 100vh; } - -h1 { - font-size: 3.2em; - line-height: 1.1; -} - -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: #1a1a1a; - cursor: pointer; - transition: border-color 0.25s; -} -button:hover { - border-color: #646cff; -} -button:focus, -button:focus-visible { - outline: 4px auto -webkit-focus-ring-color; -} - -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; - } - a:hover { - color: #747bff; - } - button { - background-color: #f9f9f9; - } -} diff --git a/src/styles/HeldPagesPanel.css b/src/styles/HeldPagesPanel.css index 855a77e..7f37064 100644 --- a/src/styles/HeldPagesPanel.css +++ b/src/styles/HeldPagesPanel.css @@ -35,6 +35,8 @@ opacity: 0.5; } +.view-toggle button:hover:not(.active) { opacity: 0.75; background: rgba(0,0,0,0.05); } + .view-toggle button.active { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.1); @@ -110,14 +112,15 @@ .del-btn-ux { background: none; border: none; - color: #eee; + color: var(--kindle-subtle); font-size: 1.1rem; cursor: pointer; padding: 0 4px; + transition: color 0.2s; } -.held-item-ux:hover .del-btn-ux { color: #ccc; } -.del-btn-ux:hover { color: #ef4444 !important; } +.held-item-ux:hover .del-btn-ux { color: var(--kindle-gray); } +.del-btn-ux:hover { color: var(--kindle-danger) !important; } .card-title-ux { font-size: 0.85rem; font-weight: 600; color: var(--kindle-ink); } .card-note-ux { font-size: 0.7rem; color: var(--kindle-gray); font-style: italic; } diff --git a/src/styles/ReaderViewport.css b/src/styles/ReaderViewport.css index 7b261ad..74975f3 100644 --- a/src/styles/ReaderViewport.css +++ b/src/styles/ReaderViewport.css @@ -29,6 +29,8 @@ transition: all 0.2s; } +.mode-btn:hover:not(.active) { background: rgba(0,0,0,0.06); color: var(--kindle-ink); } + .mode-btn.active { background: #fff; color: var(--kindle-ink); box-shadow: 0 1px 3px rgba(0,0,0,0.1); @@ -39,8 +41,12 @@ border-radius: 4px; color: var(--kindle-ink); padding: 4px 10px; cursor: pointer; font-family: var(--font-serif); font-size: 0.75rem; + transition: all 0.2s; } +.ux-btn:hover { background: #f0ede9; border-color: var(--kindle-gray); } +.ux-btn:active { background: #e8e4e0; transform: scale(0.97); } + .kindle-scroll-canvas { flex: 1; overflow: auto; diff --git a/src/styles/WorkspaceCanvas.css b/src/styles/WorkspaceCanvas.css index e62a606..4600ecb 100644 --- a/src/styles/WorkspaceCanvas.css +++ b/src/styles/WorkspaceCanvas.css @@ -18,8 +18,10 @@ .pane-badge { font-size: 0.6rem; font-weight: 800; padding: 2px 6px; background: var(--kindle-ink); color: #fff; border-radius: 2px; } .pane-title { font-size: 0.8rem; font-weight: 600; color: var(--kindle-gray); flex: 1; } -.pane-actions button { background: none; border: none; cursor: pointer; padding: 4px 8px; color: var(--kindle-gray); } -.pane-actions button:hover { color: var(--kindle-ink); } +.pane-actions button { background: none; border: none; cursor: pointer; padding: 4px 8px; color: var(--kindle-gray); border-radius: 3px; transition: all 0.2s; } +.pane-actions button:hover { color: var(--kindle-ink); background: rgba(0,0,0,0.05); } +.pane-actions button:active { transform: scale(0.93); } +.pane-actions button.danger:hover { color: var(--kindle-danger); background: rgba(239,68,68,0.08); } .kindle-floating-window { position: absolute; @@ -40,9 +42,10 @@ } .floating-header .title { flex: 1; font-size: 0.7rem; font-weight: 700; color: var(--kindle-gray); } -.actions button { background: none; border: none; cursor: pointer; color: #888; padding: 4px; } -.actions button:hover { color: var(--kindle-ink); } -.actions button.danger:hover { color: #ef4444; } +.actions button { background: none; border: none; cursor: pointer; color: #888; padding: 4px; border-radius: 3px; transition: all 0.2s; } +.actions button:hover { color: var(--kindle-ink); background: rgba(0,0,0,0.05); } +.actions button:active { transform: scale(0.93); } +.actions button.danger:hover { color: var(--kindle-danger); background: rgba(239,68,68,0.08); } .floating-body { flex: 1; position: relative; overflow: hidden; }