fix(web): show five portrait work cards per desktop row

2026-10-06 13:43:55 +08:00
parent 950b23da32
commit 7c6fb54164
3 changed files with 83 additions and 3 deletions
@@ -35,10 +35,10 @@ export function WorkCover({ workID, title }: { workID: string; title?: string })
    };
  }, [workID]);
  if (src) {
-    return <img src={src} alt={title || '作品封面'} style={{ width: '100%', aspectRatio: '16 / 9', objectFit: 'cover' }} />;
+    return <img src={src} alt={title || '作品封面'} style={{ width: '100%', aspectRatio: '9 / 16', objectFit: 'cover' }} />;
  }
  return (
-    <Flex align="center" justify="center" style={{ aspectRatio: '16 / 9', background: '#f5f5f5' }}>
+    <Flex align="center" justify="center" style={{ aspectRatio: '9 / 16', background: '#f5f5f5' }}>
      <Typography.Text type="secondary" style={{ fontSize: 12 }}>{missing ? '封面未缓存' : '封面加载中'}</Typography.Text>
    </Flex>
  );
@@ -267,7 +267,7 @@ export default function WorksGallery({ sourceId, sourceType, emptyHint, extraFil
          {works.length ? (
            <Row gutter={[16, 16]}>
              {works.map((work) => (
-                <Col key={work.id} xs={24} sm={12} lg={8} xl={6}>
+                <Col key={work.id} xs={24} sm={12} lg={8} xl={{ flex: '20%' }}>
                  <Card
                    hoverable
                    style={{ height: '100%' }}