opensource/kilocode
3
0
Fork 0
mirror of https://github.com/Kilo-Org/kilocode.git synced 2026-09-01 15:32:11 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): stop diff content bleeding through sticky tool card headers (#12415)

Browse Source
This commit is contained in:
Marius
2026-07-20 18:11:03 +02:00
committed by GitHub
parent 0cf9f902e0
commit a695930d79
2 changed files with 30 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.changeset/edit-tool-sticky-header.md
+5
View File
@@ -0,0 +1,5 @@
---
"kilo-code": patch
---
Fix diff content painting through and above the sticky headers of expanded Edit, Write, and Apply Patch tool cards when scrolling large diffs.
packages/kilo-ui/src/components/basic-tool.css
+25
View File
@@ -286,6 +286,31 @@ html[data-theme="kilo-vscode"] [data-component="tool-part-wrapper"][data-part-ty
}
}
/* Expanded edit/write/apply_patch triggers stick to the top while their diff scrolls
underneath, so they must stay opaque in every state; otherwise diff rows show
through the header. !important because the trigger hover rule below uses a
translucent hover background and would re-open the leak on hover. */
:is([data-component="edit-tool"], [data-component="write-tool"], [data-component="apply-patch-tool"])
> [data-component="collapsible"]
> [data-slot="collapsible-trigger"][aria-expanded="true"] {
background-color: var(--background-stronger) !important;
}
/* The sticky headers pin to the visible top edge of the transcript. The message
list's 12px top padding otherwise leaves a strip above the stuck trigger where
the scrolling diff stays visible. Both the trigger and the inner file header
consume --sticky-accordion-top, so they shift up together and stay flush. */
:is([data-component="edit-tool"], [data-component="write-tool"], [data-component="apply-patch-tool"]) {
--sticky-accordion-top: -12px;
}
/* The inner file accordion sticks below the compact 28px tool trigger. The inline
default offset (37px) matches the taller upstream trigger and leaves a gap where
diff rows peek through between the two stuck headers. */
[data-component="accordion"][data-scope="apply-patch"] {
--sticky-accordion-offset: 28px !important;
}
/* Reposition copy button tooltip to appear below (not above) to avoid clipping */
[data-component="tool-output"] [data-slot="markdown-copy-button"]::after {
bottom: auto;