Fix dropzone UI

This commit is contained in:
2026-03-18 10:53:13 +08:00
parent d03d1e75c2
commit d981cd4d8b
2 changed files with 6 additions and 8 deletions

View File

@@ -22,7 +22,7 @@ const useStyles = createStyles(({ token, css }) => ({
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: ${token.paddingXS}px; gap: ${token.paddingXS}px;
padding: ${token.paddingSM}px; padding: ${token.paddingMD}px;
border: 2px dashed ${token.colorBorderSecondary}; border: 2px dashed ${token.colorBorderSecondary};
border-radius: ${token.borderRadiusSM}px; border-radius: ${token.borderRadiusSM}px;
color: ${token.colorTextQuaternary}; color: ${token.colorTextQuaternary};

View File

@@ -75,9 +75,11 @@ const useStyles = createStyles(({ token, css }) => ({
`, `,
dropZoneWrapper: css` dropZoneWrapper: css`
padding: ${token.paddingXS}px ${token.paddingSM}px; padding: ${token.paddingXS}px ${token.paddingSM}px;
border-top: 1px solid ${token.colorBorderSecondary};
background: ${token.colorBgContainer}; background: ${token.colorBgContainer};
`, `,
dropZoneWrapperWithBorder: css`
border-top: 1px solid ${token.colorBorderSecondary};
`,
dropOverlay: css` dropOverlay: css`
position: absolute; position: absolute;
inset: 0; inset: 0;
@@ -362,14 +364,10 @@ const FileSection: React.FC<FileSectionProps> = ({
)} )}
{/* File list */} {/* File list */}
{files.length === 0 ? ( {files.length > 0 && <SortableFileList items={files} onReorder={handleReorder} renderItem={renderItem} dividerColor={token.colorBorder} />}
<div className={styles.emptySection}>{t("noConfig")}</div>
) : (
<SortableFileList items={files} onReorder={handleReorder} renderItem={renderItem} dividerColor={token.colorBorder} />
)}
{/* Click-to-add strip */} {/* Click-to-add strip */}
<div className={styles.dropZoneWrapper}> <div className={cx(styles.dropZoneWrapper, files.length > 0 && styles.dropZoneWrapperWithBorder)}>
<DropZone fileType={fileType} isSaving={isSaving} onFileSelected={saveFile} /> <DropZone fileType={fileType} isSaving={isSaving} onFileSelected={saveFile} />
</div> </div>
</div> </div>