From 10b013f9a81ddcc2a371677a6e1b27d048d34c31 Mon Sep 17 00:00:00 2001
From: muerwre <gotham48@gmail.com>
Date: Thu, 8 Aug 2019 15:48:25 +0700
Subject: [PATCH] tried to fix image grid, but got no results

---
 src/components/editors/ImageGrid/index.tsx    | 1 +
 src/components/editors/ImageGrid/styles.scss  | 2 +-
 src/components/upload/ImageUpload/index.tsx   | 2 +-
 src/components/upload/ImageUpload/styles.scss | 2 +-
 4 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/editors/ImageGrid/index.tsx b/src/components/editors/ImageGrid/index.tsx
index d3955115..aa1a01af 100644
--- a/src/components/editors/ImageGrid/index.tsx
+++ b/src/components/editors/ImageGrid/index.tsx
@@ -19,6 +19,7 @@ const SortableList = SortableContainer(({ items, locked }: { items: IFile[], loc
         items.map((file, index) => (
           <SortableItem key={file.id} index={index}>
             <ImageUpload
+              id={file.id}
               thumb={file.url}
             />
           </SortableItem>
diff --git a/src/components/editors/ImageGrid/styles.scss b/src/components/editors/ImageGrid/styles.scss
index f52a5dba..5a6ef4bb 100644
--- a/src/components/editors/ImageGrid/styles.scss
+++ b/src/components/editors/ImageGrid/styles.scss
@@ -19,7 +19,7 @@
   // flex: 0 4 25%;
   width: 25%;
   float: left;
-  padding: $gap / 2;
+  // padding: $gap / 2;
   z-index: 100;
   box-sizing: border-box;
 }
\ No newline at end of file
diff --git a/src/components/upload/ImageUpload/index.tsx b/src/components/upload/ImageUpload/index.tsx
index c29bd2b4..578fa1db 100644
--- a/src/components/upload/ImageUpload/index.tsx
+++ b/src/components/upload/ImageUpload/index.tsx
@@ -20,7 +20,7 @@ const ImageUpload: FC<IProps> = ({
   return (
     <div className={styles.wrap}>
       <div className={classNames(styles.thumb_wrap, { is_uploading })}>
-        {thumb && <div className={styles.thumb} style={{ background: `url("${thumb}")` }} />}
+        {thumb && <div className={styles.thumb} style={{ background: `url("${thumb}")` }}>{id}</div>}
         {is_uploading && <div className={styles.progress}><ArcProgress size={72} progress={progress} /></div>}
       </div>
     </div>
diff --git a/src/components/upload/ImageUpload/styles.scss b/src/components/upload/ImageUpload/styles.scss
index 9dee39ef..91f90cf1 100644
--- a/src/components/upload/ImageUpload/styles.scss
+++ b/src/components/upload/ImageUpload/styles.scss
@@ -30,7 +30,7 @@
   border-radius: $radius;
   background: no-repeat 50% 50%;
   background-size: cover;
-  opacity: 0;
+  opacity: 0.3;
 }
 
 .progress {