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

Make Title, Chat Footer Icons larger to ease click, tap on Mobile

Browse Source
This commit is contained in:
Debanjum Singh Solanky
2024-08-03 11:22:33 +05:30
parent 8d1c5226ec
commit 529ffdb7e3
11 changed files with 22 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -372,7 +372,7 @@ export default function ChatInputArea(props: ChatInputProps) {
className="!bg-none p-1 h-auto text-3xl rounded-full text-gray-300 hover:text-gray-500"
disabled={props.sendDisabled}
onClick={handleFileButtonClick}>
<Paperclip className={`${props.isMobileWidth ? 'w-6 h-6' : 'w-8 h-8'}`} />
<Paperclip className='w-8 h-8' />
</Button>
<div className="grid w-full gap-1.5 relative">
<Textarea
@@ -380,6 +380,7 @@ export default function ChatInputArea(props: ChatInputProps) {
className={`border-none 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"
id="message"
autoFocus={true}
value={message}
onKeyDown={(e) => {
if (e.key === 'Enter' && !e.shiftKey) {
@@ -403,7 +404,7 @@ export default function ChatInputArea(props: ChatInputProps) {
}}
disabled={props.sendDisabled}
>
<Stop weight='fill' className={`${props.isMobileWidth ? 'w-6 h-6' : 'w-8 h-8'}`} />
<Stop weight='fill' className='w-8 h-8' />
</Button>
</TooltipTrigger>
<TooltipContent>
@@ -428,7 +429,7 @@ export default function ChatInputArea(props: ChatInputProps) {
}}
disabled={props.sendDisabled}
>
<Microphone weight='fill' className={`${props.isMobileWidth ? 'w-6 h-6' : 'w-8 h-8'}`} />
<Microphone weight='fill' className='w-8 h-8' />
</Button>
</TooltipTrigger>
<TooltipContent>
@@ -442,7 +443,7 @@ export default function ChatInputArea(props: ChatInputProps) {
className={`${props.agentColor ? convertToBGClass(props.agentColor) : 'bg-orange-300 hover:bg-orange-500'} rounded-full p-0 h-auto text-3xl transition transform hover:-translate-y-1`}
onClick={onSendMessage}
disabled={props.sendDisabled}>
<ArrowCircleUp className={`${props.isMobileWidth ? 'w-6 h-6' : 'w-8 h-8'}`} />
<ArrowCircleUp className='w-8 h-8' />
</Button>
</div >
</>