fix: style

ant-design · Nov 18, 2019 · 6af10c7 · 6af10c7
1 parent 4079f36
commit 6af10c7
Show file tree

Hide file tree

Showing 5 changed files with 94 additions and 30 deletions.
diff --git a/components/config-provider/__tests__/__snapshots__/components.test.js.snap b/components/config-provider/__tests__/__snapshots__/components.test.js.snap
@@ -17362,7 +17362,9 @@ exports[`ConfigProvider components Upload configProvider 1`] = `
   <div
     class="config-upload-list config-upload-list-text"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="config-upload-list-item config-upload-list-item-done config-upload-list-item-list-type-text"
@@ -17471,7 +17473,9 @@ exports[`ConfigProvider components Upload normal 1`] = `
   <div
     class="ant-upload-list ant-upload-list-text"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@@ -17580,7 +17584,9 @@ exports[`ConfigProvider components Upload prefixCls 1`] = `
   <div
     class="ant-upload-list ant-upload-list-text"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"

diff --git a/components/upload/UploadList.tsx b/components/upload/UploadList.tsx
@@ -243,9 +243,11 @@ export default class UploadList extends React.Component<UploadListProps, any> {
           </div>
         </div>
       );
-
+      const listContainerNameClass = classNames({
+        [`${prefixCls}-list-picture-card-container`]: listType === 'picture-card',
+      });
       return (
-        <div key={file.uid}>
+        <div key={file.uid} className={listContainerNameClass}>
           {file.status === 'error' ? <Tooltip title={message}>{dom}</Tooltip> : <span>{dom}</span>}
         </div>
       );

diff --git a/components/upload/__tests__/__snapshots__/demo.test.js.snap b/components/upload/__tests__/__snapshots__/demo.test.js.snap
@@ -33,7 +33,9 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
   <div
     class="ant-upload-list ant-upload-list-text"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@@ -131,7 +133,9 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@@ -229,7 +233,9 @@ exports[`renders ./components/upload/demo/defaultFileList.md correctly 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <div
         class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-text"
       >
@@ -340,7 +346,9 @@ exports[`renders ./components/upload/demo/fileList.md correctly 1`] = `
   <div
     class="ant-upload-list ant-upload-list-text"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-text"
@@ -452,7 +460,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
     <div
       class="ant-upload-list ant-upload-list-picture-card"
     >
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
         <span>
           <div
             class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@@ -561,7 +571,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
           </div>
         </span>
       </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
         <span>
           <div
             class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@@ -670,7 +682,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
           </div>
         </span>
       </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
         <span>
           <div
             class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@@ -779,7 +793,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
           </div>
         </span>
       </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
         <span>
           <div
             class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture-card"
@@ -888,7 +904,9 @@ exports[`renders ./components/upload/demo/picture-card.md correctly 1`] = `
           </div>
         </span>
       </div>
-      <div>
+      <div
+        class="ant-upload-list-picture-card-container"
+      >
         <div
           class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-picture-card"
         >
@@ -1014,7 +1032,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
     <div
       class="ant-upload-list ant-upload-list-picture"
     >
-      <div>
+      <div
+        class=""
+      >
         <span>
           <div
             class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1105,7 +1125,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
           </div>
         </span>
       </div>
-      <div>
+      <div
+        class=""
+      >
         <div
           class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-picture"
         >
@@ -1203,7 +1225,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
     <div
       class="ant-upload-list ant-upload-list-picture"
     >
-      <div>
+      <div
+        class=""
+      >
         <span>
           <div
             class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1294,7 +1318,9 @@ exports[`renders ./components/upload/demo/picture-style.md correctly 1`] = `
           </div>
         </span>
       </div>
-      <div>
+      <div
+        class=""
+      >
         <div
           class="ant-upload-list-item ant-upload-list-item-error ant-upload-list-item-list-type-picture"
         >

diff --git a/components/upload/__tests__/__snapshots__/uploadlist.test.js.snap b/components/upload/__tests__/__snapshots__/uploadlist.test.js.snap
@@ -403,7 +403,9 @@ exports[`Upload List should non-image format file preview 1`] = `
   <div
     class="ant-upload-list ant-upload-list-picture"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -513,7 +515,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -604,7 +608,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -714,7 +720,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -824,7 +832,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -915,7 +925,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1006,7 +1018,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1097,7 +1111,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1188,7 +1204,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1279,7 +1297,9 @@ exports[`Upload List should non-image format file preview 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"
@@ -1401,7 +1421,9 @@ exports[`Upload List should support showRemoveIcon and showPreviewIcon 1`] = `
   <div
     class="ant-upload-list ant-upload-list-picture"
   >
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-uploading ant-upload-list-item-list-type-picture"
@@ -1444,7 +1466,9 @@ exports[`Upload List should support showRemoveIcon and showPreviewIcon 1`] = `
         </div>
       </span>
     </div>
-    <div>
+    <div
+      class=""
+    >
       <span>
         <div
           class="ant-upload-list-item ant-upload-list-item-done ant-upload-list-item-list-type-picture"

diff --git a/components/upload/style/index.less b/components/upload/style/index.less
@@ -360,6 +360,12 @@
     &.@{upload-prefix-cls}-list::after {
       display: none;
     }
+    &-container {
+      float: left;
+      width: @upload-picture-card-size;
+      height: @upload-picture-card-size;
+      margin: 0 8px 8px 0;
+    }
     .@{upload-item} {
       float: left;
       width: @upload-picture-card-size;