From 53e7d5026a37aa9c2168d860617410d1f6161f86 Mon Sep 17 00:00:00 2001
From: leejinho <lilis7575@gmail.com>
Date: Tue, 18 Feb 2020 16:40:46 +0900
Subject: [PATCH] =?UTF-8?q?#=20=EC=9D=B4=EC=8A=88=EC=B2=98=EB=A6=AC=20268?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../message-detail.dialog.component.html      | 37 ++++++-----
 .../message-detail.dialog.component.scss      | 66 ++++++++++---------
 2 files changed, 56 insertions(+), 47 deletions(-)

diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
index 0985cc7f..a6cc4eaf 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
@@ -161,22 +161,27 @@
               </button>
             </div>
 
-            <ul>
-              <li *ngFor="let file of attachFile">
-                <div>
-                  <span class="mdi" [ngClass]="getFileStatusIcon(file)"></span>
-                  <span>{{ file.resContent }}</span>
-                </div>
-                <span class="file-size">{{ file.resSize | ucapBytes }}</span>
-                <a>
-                  <span
-                    class="mdi mdi-download"
-                    *ngIf="file.activeYn"
-                    (click)="downloadAttachFileSingle(file)"
-                  ></span>
-                </a>
-              </li>
-            </ul>
+            <perfect-scrollbar>
+              <ul class="attachFileList">
+                <li *ngFor="let file of attachFile">
+                  <div>
+                    <span
+                      class="mdi"
+                      [ngClass]="getFileStatusIcon(file)"
+                    ></span>
+                    <span>{{ file.resContent }}</span>
+                  </div>
+                  <span class="file-size">{{ file.resSize | ucapBytes }}</span>
+                  <a>
+                    <span
+                      class="mdi mdi-download"
+                      *ngIf="file.activeYn"
+                      (click)="downloadAttachFileSingle(file)"
+                    ></span>
+                  </a>
+                </li>
+              </ul>
+            </perfect-scrollbar>
           </div>
         </div>
       </div>
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss
index b32390bd..775b2fd1 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss
@@ -141,38 +141,42 @@
     }
     .attachFile {
       border-top: 1px solid #dddddd;
-      li {
-        display: flex;
-        flex-flow: row;
-        line-height: 2em;
-        flex: 1 1 auto;
-        .file-name {
-          display: inline-flex;
-          flex-flow: row;
-          flex: 1 1 auto;
-          border: 1px solid red;
-          white-space: nowrap;
-          word-wrap: normal;
-          overflow: hidden;
-          margin-right: 10px;
-          span:last-child {
-            overflow: hidden;
-            text-overflow: ellipsis;
-            display: block;
-            width: calc(100% - 40px);
-          }
-        }
-        .file-size {
+      .attachFileList {
+        height: 80px;
+        li {
           display: flex;
-          margin-left: auto;
-          align-self: flex-end;
-          flex: 0 0 auto;
-        }
-        a {
-          display: inline-block;
-          width: 20px;
-          height: 100%;
-          margin-left: 10px;
+          flex-flow: row;
+          line-height: 2em;
+          flex: 1 1 auto;
+          margin-right: 10px;
+          .file-name {
+            display: inline-flex;
+            flex-flow: row;
+            flex: 1 1 auto;
+            border: 1px solid red;
+            white-space: nowrap;
+            word-wrap: normal;
+            overflow: hidden;
+            margin-right: 10px;
+            span:last-child {
+              overflow: hidden;
+              text-overflow: ellipsis;
+              display: block;
+              width: calc(100% - 40px);
+            }
+          }
+          .file-size {
+            display: flex;
+            margin-left: auto;
+            align-self: flex-end;
+            flex: 0 0 auto;
+          }
+          a {
+            display: inline-block;
+            width: 20px;
+            height: 100%;
+            margin-left: 10px;
+          }
         }
       }
     }