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

Fix width and equalize spacing between buttons in chat footer

Browse Source 
Previously the footer's right border wasn't visible on small screens
due to usage of w-full

Use mr-1 on send button instead of px-1 on chat input parent to
eualize chat footer buttons spacing
This commit is contained in:
Debanjum Singh Solanky
2024-08-04 04:01:19 +05:30
parent 5541bc09c8
commit 2f7a8698a0
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -440,7 +440,7 @@ export default function ChatInputArea(props: ChatInputProps) {
) )
} }
<Button <Button
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`} className={`${props.agentColor ? convertToBGClass(props.agentColor) : 'bg-orange-300 hover:bg-orange-500'} rounded-full p-0 mr-1 h-auto text-3xl transition transform hover:-translate-y-1`}
onClick={onSendMessage} onClick={onSendMessage}
disabled={props.sendDisabled}> disabled={props.sendDisabled}>
<ArrowCircleUp className='w-8 h-8' /> <ArrowCircleUp className='w-8 h-8' />

2
src/interface/web/app/page.tsx
View File

@@ -232,7 +232,7 @@ function ChatBodyData(props: ChatBodyDataProps) {
{ {
props.isMobileWidth && props.isMobileWidth &&
<> <>
<div className={`${styles.inputBox} w-full pt-1 shadow-[0_-20px_25px_-5px_rgba(0,0,0,0.1)] shadow-[0_-8px_10px_-6px_rgba(0,0,0,0.1)] dark:bg-neutral-700 bg-background align-middle items-center justify-center pb-3 px-1`}> <div className={`${styles.inputBox} pt-1 shadow-[0_-20px_25px_-5px_rgba(0,0,0,0.1)] shadow-[0_-8px_10px_-6px_rgba(0,0,0,0.1)] dark:bg-neutral-700 bg-background align-middle items-center justify-center pb-3 mx-1`}>
<div className="flex gap-2 items-center justify-left pt-1 pb-2 px-10"> <div className="flex gap-2 items-center justify-left pt-1 pb-2 px-10">
{agentIcons.map((icon, index) => ( {agentIcons.map((icon, index) => (
<Card <Card