WuYanBo
/
CodeReview
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style(audit): simplify file selection dialog header layout 

- Refactor DialogTitle structure to use flexbox gap instead of nested flex containers
- Consolidate icon, title, and badge into single flex row with improved spacing
- Add ml-auto to badge for automatic right alignment instead of justify-between
- Remove unnecessary nested div wrapper around icon and title text
- Add flex-shrink-0 to icon to prevent scaling in flex layout
- Add pr-8 padding to DialogTitle for better spacing with close button
- Improve code readability and reduce DOM nesting complexity
This commit is contained in:
lintsinghua 2025-12-10 19:22:54 +08:00
parent a995bef28c
commit ebfe9fa19d
1 changed files with 11 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
frontend/src/components/audit/FileSelectionDialog.tsx
View File

@ -454,21 +454,17 @@ export default function FileSelectionDialog({
<Dialog open={open} onOpenChange={onOpenChange}> <Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="!max-w-[1000px] !w-[95vw] max-h-[85vh] flex flex-col bg-white border-2 border-black p-0 shadow-[8px_8px_0px_0px_rgba(0,0,0,1)] rounded-none"> <DialogContent className="!max-w-[1000px] !w-[95vw] max-h-[85vh] flex flex-col bg-white border-2 border-black p-0 shadow-[8px_8px_0px_0px_rgba(0,0,0,1)] rounded-none">
<DialogHeader className="p-5 border-b-2 border-black bg-gray-50 flex-shrink-0"> <DialogHeader className="p-5 border-b-2 border-black bg-gray-50 flex-shrink-0">
<DialogTitle className="flex items-center justify-between"> <DialogTitle className="flex items-center gap-3 font-display font-bold uppercase text-lg pr-8">
<div className="flex items-center space-x-2 font-display font-bold uppercase text-lg"> <FolderOpen className="w-5 h-5 text-black flex-shrink-0" />
<FolderOpen className="w-5 h-5 text-black" /> <span>选择要审计的文件</span>
<span>选择要审计的文件</span> {excludePatterns && excludePatterns.length > 0 && (
</div> <Badge
<div className="flex items-center gap-2"> variant="outline"
{excludePatterns && excludePatterns.length > 0 && ( className="rounded-none border-gray-400 text-gray-600 font-mono text-xs ml-auto"
<Badge >
variant="outline" 已排除 {excludePatterns.length} 种模式
className="rounded-none border-gray-400 text-gray-600 font-mono text-xs" </Badge>
> )}
已排除 {excludePatterns.length} 种模式
</Badge>
)}
</div>
</DialogTitle> </DialogTitle>
</DialogHeader> </DialogHeader>