klbr/khoj
1
0
Fork 0
mirror of https://github.com/khoaliber/khoj.git synced 2026-03-03 05:29:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Make cursor in chat input take on selected agent color

Browse Source
This commit is contained in:
Debanjum
2024-10-28 16:26:23 -07:00
parent 1448b8b3fc
commit 2ac840e3f2
3 changed files with 19 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/interface/web/app/common/colorUtils.ts
View File

@@ -42,6 +42,13 @@ export function converColorToBgGradient(color: string) {
return `${convertToBGGradientClass(color)} dark:border dark:border-neutral-700`;
}
export function convertColorToCaretClass(color: string | undefined) {
if (color && tailwindColors.includes(color)) {
return `caret-${color}-500`;
}
return `caret-orange-500`;
}
export function convertColorToRingClass(color: string | undefined) {
if (color && tailwindColors.includes(color)) {
return `focus-visible:ring-${color}-500`;

10
src/interface/web/app/components/chatInputArea/chatInputArea.tsx
View File

@@ -37,7 +37,11 @@ import { Popover, PopoverContent } from "@/components/ui/popover";
import { PopoverTrigger } from "@radix-ui/react-popover";
import { Textarea } from "@/components/ui/textarea";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
import { convertColorToTextClass, convertToBGClass } from "@/app/common/colorUtils";
import {
convertColorToCaretClass,
convertColorToTextClass,
convertToBGClass,
} from "@/app/common/colorUtils";
import LoginPrompt from "../loginPrompt/loginPrompt";
import { uploadDataForIndexing } from "../../common/chatFunctions";
@@ -494,8 +498,8 @@ export const ChatInputArea = forwardRef<HTMLTextAreaElement, ChatInputProps>((pr
</div>
<Textarea
ref={chatInputRef}
className={`border-none focus:border-none
focus:outline-none focus-visible:ring-transparent
className={`border-none focus:border-none focus:outline-none focus-visible:ring-transparent
animate-carate-blink ${convertColorToCaretClass(props.agentColor)}
w-full h-16 min-h-16 max-h-[128px] md:py-4 rounded-lg resize-none dark:bg-neutral-700
${props.isMobileWidth ? "text-md" : "text-lg"}`}
placeholder="Type / to see a list of commands"