kunthawat/moreminimore-vibe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: improve close button alignment in chat error containers (#782)

Browse Source 
Adjusted positioning to top-2.5 left-2 and add left padding to prevent
text overlap with the close button. 

<img width="715" height="61" alt="image"
src="https://github.com/user-attachments/assets/1e47f577-2b11-4928-82a6-053abc77dd1e"
/>

<img width="727" height="101" alt="image"
src="https://github.com/user-attachments/assets/b6058eca-93e0-445e-b17a-dee81911b90b"
/>
This commit is contained in:
Abdur Rahman
2025-08-06 03:04:17 +05:30
committed by GitHub
parent 5db0b04400
commit bbc50197c2
2 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/chat/ChatErrorBox.tsx
View File

@@ -101,11 +101,11 @@ function ChatErrorContainer({
<div className="relative mt-2 bg-red-50 border border-red-200 rounded-md shadow-sm p-2 mx-4">
<button
onClick={onDismiss}
className="absolute top-1 left-1 p-1 hover:bg-red-100 rounded"
className="absolute top-2.5 left-2 p-1 hover:bg-red-100 rounded"
>
<X size={14} className="text-red-500" />
</button>
<div className="px-6 py-1 text-sm">
<div className="pl-8 py-1 text-sm">
<div className="text-red-700 text-wrap">
{typeof children === "string" ? (
<ReactMarkdown
@@ -149,11 +149,11 @@ function ChatInfoContainer({
<div className="relative mt-2 bg-sky-50 border border-sky-200 rounded-md shadow-sm p-2 mx-4">
<button
onClick={onDismiss}
className="absolute top-1 left-1 p-1 hover:bg-sky-100 rounded"
className="absolute top-2.5 left-2 p-1 hover:bg-sky-100 rounded"
>
<X size={14} className="text-sky-600" />
</button>
<div className="px-6 py-1 text-sm">
<div className="pl-8 py-1 text-sm">
<div className="text-sky-800 text-wrap">{children}</div>
</div>
</div>