fix: align note thumbnails with content edges

Remove extra top and left padding from the note record index so thumbnails align with the content area. Draw keyboard focus outlines inward to keep them visible within the scroll viewport, and cover alignment in the Electron layout regression test.

Release note: Note thumbnails now align with the content area, and keyboard focus outlines remain visible at the list edges.
This commit is contained in:
mesalogo
2026-09-23 23:03:09 +08:00
parent cebd513da8
commit 344008aaec
3 changed files with 10 additions and 3 deletions
+2 -2
View File
@@ -1382,7 +1382,7 @@
}
}
.magic-note-records { display: grid; gap: var(--space-3); padding: var(--space-2); }
.magic-note-records { display: grid; gap: var(--space-3); padding: 0 var(--space-2) var(--space-2) 0; }
.magic-note-records[hidden] { display: none; }
.magic-note-record {
display: grid;
@@ -1405,7 +1405,7 @@
@media (forced-colors: active) {
.magic-note-record[aria-current="true"] { border-color: Highlight; }
}
.magic-note-record:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.magic-note-record:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.magic-note-record time { color: var(--text-secondary); font-size: var(--font-caption); }
.magic-note-record__summary { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.magic-note-record__image { display: block; min-width: 0; text-align: center; }