fix: Upload remove margin using grid display

CooperHash · Mar 23, 2024 · 108fc7a · 108fc7a
1 parent 0e49dec
commit 108fc7a
Showing 1 changed file with 9 additions and 4 deletions.
diff --git a/components/upload/style/picture.ts b/components/upload/style/picture.ts
@@ -113,8 +113,6 @@ const genPictureCardStyle: GenerateStyle<UploadToken> = (token) => {
       [`${componentCls}${componentCls}-select`]: {
         width: uploadPictureCardSize,
         height: uploadPictureCardSize,
-        marginInlineEnd: token.marginXS,
-        marginBottom: token.marginXS,
         textAlign: 'center',
         verticalAlign: 'top',
         backgroundColor: token.colorFillAlter,
@@ -138,19 +136,26 @@ const genPictureCardStyle: GenerateStyle<UploadToken> = (token) => {
 
       // list
       [`${listCls}${listCls}-picture-card, ${listCls}${listCls}-picture-circle`]: {
+        display: 'grid',
+        gridTemplateColumns: `repeat(auto-fill, ${uploadPictureCardSize})`,
+        rowGap: token.marginXS,
+        columnGap: token.marginXS,
+
         [`${listCls}-item-container`]: {
           display: 'inline-block',
           width: uploadPictureCardSize,
           height: uploadPictureCardSize,
-          marginBlock: `0 ${unit(token.marginXS)}`,
-          marginInline: `0 ${unit(token.marginXS)}`,
           verticalAlign: 'top',
         },
 
         '&::after': {
           display: 'none',
         },
 
+        '&::before': {
+          display: 'none',
+        },
+
         [itemCls]: {
           height: '100%',
           margin: 0,