diff --git a/addons/xterm-addon-search/src/SearchAddon.ts b/addons/xterm-addon-search/src/SearchAddon.ts index e7ece48315..cf751622cf 100644 --- a/addons/xterm-addon-search/src/SearchAddon.ts +++ b/addons/xterm-addon-search/src/SearchAddon.ts @@ -679,7 +679,7 @@ export class SearchAddon implements ITerminalAddon { color: options.activeMatchColorOverviewRuler } }); - this._selectedDecoration?.onRender((e) => this._applyStyles(e, options.activeMatchBorder)); + this._selectedDecoration?.onRender((e) => this._applyStyles(e, options.activeMatchBorder, true)); this._selectedDecoration?.onDispose(() => marker.dispose()); } } @@ -702,7 +702,7 @@ export class SearchAddon implements ITerminalAddon { * @param borderColor the border color to apply * @returns */ - private _applyStyles(element: HTMLElement, borderColor: string | undefined): void { + private _applyStyles(element: HTMLElement, borderColor: string | undefined, isActiveResult: boolean): void { if (element.clientWidth <= 0) { return; } @@ -712,6 +712,9 @@ export class SearchAddon implements ITerminalAddon { element.style.outline = `1px solid ${borderColor}`; } } + if (isActiveResult) { + element.classList.add('xterm-find-active-result-decoration'); + } } /** @@ -736,7 +739,7 @@ export class SearchAddon implements ITerminalAddon { position: 'center' } }); - findResultDecoration?.onRender((e) => this._applyStyles(e, options.matchBorder)); + findResultDecoration?.onRender((e) => this._applyStyles(e, options.matchBorder, false)); findResultDecoration?.onDispose(() => marker.dispose()); return findResultDecoration; }