Minor fixes

This commit is contained in:
Saoud Rizwan
2024-09-18 12:44:52 -04:00
parent 3ea20ab8db
commit 2825e03cef
3 changed files with 11 additions and 11 deletions

View File

@@ -372,7 +372,7 @@ const ChatTextArea = forwardRef<HTMLTextAreaElement, ChatTextAreaProps>(
highlightLayerRef.current.innerHTML = text highlightLayerRef.current.innerHTML = text
.replace(/\n$/, "\n\n") .replace(/\n$/, "\n\n")
.replace(/[<>&]/g, (c) => ({ "<": "&lt;", ">": "&gt;", "&": "&amp;" }[c] || c)) .replace(/[<>&]/g, (c) => ({ "<": "&lt;", ">": "&gt;", "&": "&amp;" }[c] || c))
.replace(mentionRegexGlobal, '<mark class="mention-context-highlight">$&</mark>') .replace(mentionRegexGlobal, '<mark class="mention-context-textarea-highlight">$&</mark>')
highlightLayerRef.current.scrollTop = textAreaRef.current.scrollTop highlightLayerRef.current.scrollTop = textAreaRef.current.scrollTop
highlightLayerRef.current.scrollLeft = textAreaRef.current.scrollLeft highlightLayerRef.current.scrollLeft = textAreaRef.current.scrollLeft

View File

@@ -351,9 +351,7 @@ export const highlightMentions = (text?: string, withShadow = true) => {
return ( return (
<span <span
key={index} key={index}
className={`mention-context-highlight-${ className={withShadow ? "mention-context-highlight-with-shadow" : "mention-context-highlight"}>
withShadow ? "visible-with-shadow" : "visible-without-shadow"
}`}>
@{part} @{part}
</span> </span>
) )

View File

@@ -143,7 +143,9 @@ vscode-dropdown::part(listbox) {
opacity: 0.4; opacity: 0.4;
} }
.mention-context-highlight { /* Context mentions */
.mention-context-textarea-highlight {
background-color: color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent); background-color: color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent);
border-radius: 3px; border-radius: 3px;
box-shadow: 0 0 0 0.5px color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent); box-shadow: 0 0 0 0.5px color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent);
@@ -154,13 +156,13 @@ vscode-dropdown::part(listbox) {
bottom: -0.5px; */ bottom: -0.5px; */
} }
.mention-context-highlight-visible-with-shadow { .mention-context-highlight {
background-color: color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent);
border-radius: 3px;
}
.mention-context-highlight-with-shadow {
background-color: color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent); background-color: color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent);
border-radius: 3px; border-radius: 3px;
box-shadow: 0 0 0 0.5px color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent); box-shadow: 0 0 0 0.5px color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent);
} }
.mention-context-highlight-visible-without-shadow {
background-color: color-mix(in srgb, var(--vscode-badge-foreground) 30%, transparent);
border-radius: 3px;
}