zlei6/ragflow
1
0
Fork 0
mirror of https://github.com/infiniflow/ragflow.git synced 2026-07-31 13:03:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): fix layout issues with text, overflow, and spacing consistency (#16324)

Browse Source
This commit is contained in:
Yoorim Choi
2026-06-25 20:25:32 +09:00
committed by GitHub
parent e8bb534b90
commit 46b97bd1a1
6 changed files with 29 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/components/confirm-delete-dialog.tsx
View File

@@ -65,7 +65,7 @@ export function ConfirmDeleteDialog({
<AlertDialogContent
onSelect={(e) => e.preventDefault()}
onClick={(e) => e.stopPropagation()}
className="bg-bg-base "
className="bg-bg-base"
data-testid={testId ?? 'confirm-delete-dialog'}
>
<AlertDialogHeader className="space-y-5">
@@ -82,7 +82,7 @@ export function ConfirmDeleteDialog({
<>
<Separator className="w-[calc(100%+48px)] -translate-x-6"></Separator>
<AlertDialogDescription className="mt-5">
<div className="flex flex-col gap-5 text-base mb-10 px-5">
<div className="flex flex-col gap-2 text-base mb-10 px-5">
<div className="text-text-primary">
{content.title || t('common.deleteModalTitle')}
</div>
@@ -92,7 +92,7 @@ export function ConfirmDeleteDialog({
</>
)}
</AlertDialogHeader>
<AlertDialogFooter className="px-5 flex items-center gap-2">
<AlertDialogFooter className="px-5 flex items-center">
<AlertDialogCancel
onClick={onCancel}
data-testid={

8
web/src/components/list-filter-bar/filter-field.tsx
View File

@@ -70,9 +70,9 @@ const FilterItem = memo(
<div
className={`flex items-center justify-between text-text-primary text-xs ${level > 0 ? 'ml-1' : ''}`}
>
<FormItem className="flex flex-row space-x-3 space-y-0 items-center ">
<FormItem className="flex flex-row space-x-3 space-y-0 items-center min-w-0 flex-1">
<FormControl>
<div className="flex space-x-3">
<div className="flex items-center space-x-2 min-w-0">
<Checkbox
checked={field.value?.includes?.(item.id.toString())}
onCheckedChange={(checked: boolean) =>
@@ -88,7 +88,7 @@ const FilterItem = memo(
item,
})
}
className="truncate w-[200px] text-sm font-normal leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70 text-text-secondary"
className="truncate text-sm font-normal leading-normal peer-disabled:cursor-not-allowed peer-disabled:opacity-70 text-text-secondary"
>
{item.label}
</div>
@@ -96,7 +96,7 @@ const FilterItem = memo(
</FormControl>
</FormItem>
{item.count !== undefined && (
<span className="text-sm">{item.count}</span>
<span className="text-sm shrink-0 ml-2 text-right">{item.count}</span>
)}
</div>
);

9
web/src/components/list-filter-bar/filter-popover.tsx
View File

@@ -209,7 +209,7 @@ function CheckboxFormMultiple({
return (
<div
key={key}
className="flex flex-col space-y-4 border-b border-border-button pb-4"
className="flex flex-col gap-4 border-b border-border-button pb-4"
>
<div className="text-text-primary text-sm">{key}</div>
<div className="flex flex-col space-y-4">
@@ -223,7 +223,6 @@ function CheckboxFormMultiple({
onChange={(e) =>
handleSearchChange(x.field, e.target.value)
}
className="h-8"
/>
</div>
)}
@@ -249,7 +248,7 @@ function CheckboxFormMultiple({
return (
<FormItem className="space-y-4" key={x.field}>
<div>
<div className="flex flex-col items-start justify-between mb-2">
<div className="flex flex-col items-start justify-between gap-2 mb-2">
<FormLabel className="text-text-primary text-sm">
{x.label}
</FormLabel>
@@ -260,7 +259,7 @@ function CheckboxFormMultiple({
onChange={(e) =>
handleSearchChange(x.field, e.target.value)
}
className="h-8 w-full"
rootClassName="w-full"
/>
)}
</div>
@@ -287,7 +286,7 @@ function CheckboxFormMultiple({
})}
</div>
<div className="flex justify-end gap-5">
<div className="flex justify-end gap-2">
<Button
type="button"
variant={'outline'}

2
web/src/components/ui/tooltip.tsx
View File

@@ -38,7 +38,7 @@ export const FormTooltip = ({ tooltip }: { tooltip: React.ReactNode }) => {
<TooltipTrigger asChild>
<span
tabIndex={-1}
className="inline-flex align-text-top"
className="inline-flex align-middle -translate-y-[.02em]"
onClick={(e) => {
e.preventDefault(); // Prevent clicking the tooltip from triggering form save
}}