refactor(ui): update knowledge graph, chunk, metadata, agent log styles (#13518)

### What problem does this PR solve?

Update UI styles:
- **Dataset** > **Knowledge graph** tooltip
- **Dataset** > **Files** > **Manage metadata** modal
- **Dataset** > **Files** > **Modify Chunking Method** > **Auto
metadata** > **Manage generation settings** modal
- **Agent** > **Canvas (Ingestion pipeline)** > **Dataflow result**

### Type of change

- [x] Refactoring

web/src/components/document-preview/document-header.tsx

@@ -1,21 +1,35 @@
 import { formatDate } from '@/utils/date';
 import { formatBytes } from '@/utils/file-util';
+import { useTranslation } from 'react-i18next';
 
 type Props = {
   size: number;
   name: string;
   create_date: string;
+  className?: string;
 };
 
-export default ({ size, name, create_date }: Props) => {
+export default ({ size, name, create_date, className }: Props) => {
   const sizeName = formatBytes(size);
   const dateStr = formatDate(create_date);
+
+  const { t } = useTranslation();
+
   return (
-    <div>
-      <h2 className="text-[16px] truncate">{name}</h2>
-      <div className="text-text-secondary text-[12px] pt-[5px]">
-        Size：{sizeName} Uploaded Time：{dateStr}
-      </div>
-    </div>
+    <header className={className}>
+      <h2 className="text-2xl font-semibold truncate">{name}</h2>
+      <dl
+        className="
+        text-text-secondary text-sm flex
+        [&_dt]:after:content-[':'] [&_dt]:after:me-[.5ch]
+        [&_dd]:me-[2ch]"
+      >
+        <dt>{t('chunk.size')}</dt>
+        <dd>{sizeName}</dd>
+
+        <dt>{t('chunk.uploadedTime')}</dt>
+        <dd>{dateStr}</dd>
+      </dl>
+    </header>
   );
 };

web/src/components/document-preview/index.tsx

@@ -25,7 +25,7 @@ const Preview = ({
   return (
     <>
       {fileType === 'pdf' && highlights && setWidthAndHeight && (
-        <section>
+        <section className="h-full">
           <PdfPreviewer
             className={className}
             highlights={highlights}

web/src/components/document-preview/pdf-preview.tsx

@@ -11,10 +11,10 @@ import {
 import { Spin } from '@/components/ui/spin';
 // import FileError from '@/pages/document-viewer/file-error';
 import { Authorization } from '@/constants/authorization';
+import { cn } from '@/lib/utils';
 import FileError from '@/pages/document-viewer/file-error';
 import { getAuthorization } from '@/utils/authorization-util';
 import { useCatchDocumentError } from './hooks';
-import styles from './index.module.less';
 type PdfLoaderProps = React.ComponentProps<typeof PdfLoader> & {
   httpHeaders?: Record<string, string>;
 };
@@ -69,7 +69,11 @@ const PdfPreview = ({
 
   return (
     <div
-      className={`${styles.documentContainer} rounded-[10px] overflow-hidden	${className}`}
+      className={cn(
+        'relative size-full rounded overflow-hidden',
+        '[&_.pdfViewer.removePageBorders_.page]:last-of-type:mb-0',
+        className,
+      )}
     >
       <Loader
         url={url}