You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: .agentkanban/tasks/doing/task_20260311_113751643_dvk9wk_we_need_a_wikilink_alias_search_with_completion.md
+79Lines changed: 79 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -140,3 +140,82 @@ Implementation complete. All TODO items checked off. Here's what was done:
140
140
- Tests: all 503 pass
141
141
142
142
[user]
143
+
144
+
Test feed back:
145
+
146
+
If the search area in the side bar is too small, then the completion menu is hidden behind the task section below. Could the completion menu have a higher z-index so that it always sits above?
147
+
148
+
Could the font size of everything in the search area be bigger so that it matches the text size of the editor generally
149
+
150
+
[agent]
151
+
152
+
Working in task file: `task_20260311_113751643_dvk9wk_we_need_a_wikilink_alias_search_with_completion.md`.
153
+
154
+
Two issues from testing — both are CSS fixes in `search.css`:
155
+
156
+
### 1. Dropdown z-index
157
+
158
+
The dropdown has `z-index: 100` but it's **inside** the search webview's iframe, so z-index can't escape the webview boundary. The dropdown can only overlay content within **its own** webview — it can't overlay the Tasks webview below it because VS Code renders each sidebar view in its own isolated iframe.
159
+
160
+
**Realistic fix**: The dropdown already uses `position: absolute` and `z-index: 100`. The issue is that the webview's `<html>` and `<body>` have constrained height/overflow. We need `overflow: visible` on the body so the dropdown can visually extend beyond the webview's visible area. The current CSS already has `overflow: visible` on `html, body` — but VS Code might clip the webview container. Unfortunately, we can't control the VS Code iframe clipping.
161
+
162
+
**Alternative approach**: Since we can't escape the iframe, the best we can do is ensure the dropdown doesn't get clipped *within* the webview. The webview likely has a small fixed height from VS Code. Two options:
163
+
-**A)** Use a fixed/viewport-positioned dropdown that renders at the bottom of the viewport (like VS Code's own command palette), so it uses all available space within the iframe
164
+
-**B)** Accept that the panel needs some minimum height and document it — VS Code sidebar views don't support cross-view overflow
165
+
166
+
I'll go with **A** — position the dropdown as `position: fixed` relative to the viewport, so it uses all available iframe space regardless of the panel's scroll position.
167
+
168
+
[comment] Option B I'll accept the restriction - can we just prevent the search area from scrolling, I'd rather just expand the panel down
169
+
170
+
### 2. Font size
171
+
172
+
Currently using `text-xs` (0.75rem / 12px) for the input and entries. I'll bump everything to use `text-sm` (0.875rem / 14px) for the input and entry labels, and `text-xs` for the detail text. This should match the editor's default font size.
173
+
174
+
Both fixes are straightforward CSS changes. Ready to implement.
175
+
176
+
[user] See inline comments
177
+
178
+
[agent]
179
+
180
+
Working in task file: `task_20260311_113751643_dvk9wk_we_need_a_wikilink_alias_search_with_completion.md`.
181
+
182
+
Implemented both fixes per your feedback (Option B for dropdown):
183
+
184
+
### Changes to `search.css`
185
+
186
+
1.**Dropdown positioning** — Changed from `position: absolute` to `position: relative`. The dropdown now flows naturally within the webview content, pushing the panel down. User expands the Search panel to see results. Removed `max-height` and `overflow-y: auto` constraints so all results are visible. Set `html, body` to `overflow: hidden` to prevent internal scrolling.
Looks good but it still internally scrolls when I navigate down the completion options it just doesn't show a a scroll bar - can we stop the scrolling all together? The user can expand if needed
199
+
200
+
[agent]
201
+
202
+
Working in task file: `task_20260311_113751643_dvk9wk_we_need_a_wikilink_alias_search_with_completion.md`.
203
+
204
+
## Fix — Remove programmatic scrolling
205
+
206
+
### Root cause
207
+
208
+
`scrollActiveIntoView()` in `search.ts` calls `element.scrollIntoView({ block: 'nearest' })` on the active dropdown item when the user presses arrow keys. Browsers allow programmatic scrolling even on elements with `overflow: hidden`, so the body scrolls internally despite the CSS constraint.
209
+
210
+
### Changes to `search.ts`
211
+
212
+
- Removed `scrollActiveIntoView()` function entirely
213
+
- Removed both call sites (ArrowDown and ArrowUp handlers)
214
+
215
+
The dropdown renders all items — the user expands the panel to see them. No scrolling needed.
Copy file name to clipboardExpand all lines: .agentkanban/tasks/doing/todo_20260311_113751643_dvk9wk_we_need_a_wikilink_alias_search_with_completion.md
0 commit comments