From 23d188faaca71d230e04c1e67b0e89dd07683163 Mon Sep 17 00:00:00 2001
From: khk <khk@gmail.com>
Date: Tue, 31 Dec 2019 11:50:13 +0900
Subject: [PATCH] =?UTF-8?q?=EC=82=AC=EC=9A=B4=EB=93=9C=20=EB=B7=B0?=
 =?UTF-8?q?=EC=96=B4=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/assets/scss/global/_default.scss      |  3 +
 .../file-viewer/sound-viewer.component.html   | 59 +++++++++++++------
 2 files changed, 43 insertions(+), 19 deletions(-)

diff --git a/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss b/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
index a566af77..6346aee1 100644
--- a/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
+++ b/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
@@ -221,6 +221,9 @@ $daesang-grey: (
   .text-primary-color {
     color: mat-color($primary);
   }
+  .text-accent-dark {
+    color: mat-color($accent, 600);
+  }
   .text-accent-darkest {
     color: mat-color($accent, 800);
   }
diff --git a/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/sound-viewer.component.html b/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/sound-viewer.component.html
index 79f051ec..4a40a037 100644
--- a/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/sound-viewer.component.html
+++ b/projects/ucap-webmessenger-ui/src/lib/components/file-viewer/sound-viewer.component.html
@@ -12,9 +12,20 @@
       (click)="onClickDownload()"
     >
       <!--<mat-icon>get_app</mat-icon>-->
-      <svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-        stroke-width="2" stroke-linecap="butt" stroke-linejoin="round">
-        <path d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5" />
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="21"
+        height="21"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="2"
+        stroke-linecap="butt"
+        stroke-linejoin="round"
+      >
+        <path
+          d="M3 15v4c0 1.1.9 2 2 2h14a2 2 0 0 0 2-2v-4M17 9l-5 5-5-5M12 12.8V2.5"
+        />
       </svg>
     </button>
     <span class="stroke-bar"></span>
@@ -24,8 +35,17 @@
       class="ucap-image-viewer-action btn-close"
       (click)="onClickClose()"
     >
-      <svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" viewBox="0 0 24 24" fill="none" stroke="currentColor"
-        stroke-width="2" stroke-linecap="butt" stroke-linejoin="round">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="21"
+        height="21"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="2"
+        stroke-linecap="butt"
+        stroke-linejoin="round"
+      >
         <line x1="18" y1="6" x2="6" y2="18"></line>
         <line x1="6" y1="6" x2="18" y2="18"></line>
       </svg>
@@ -60,18 +80,20 @@
         (loadeddata)="onLoadedDataAudio()"
       ></audio>
       <div class="circle-box">
-        <!--<mat-icon class="ucap-sound-viewer-icon">music_note</mat-icon>-->
-        <div class='sound-wave'>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
-          <div class='sound-bar bg-accent-darkest'></div>
+        <mat-icon class="ucap-sound-viewer-icon" *ngIf="!playing">
+          music_note
+        </mat-icon>
+        <div class="sound-wave" *ngIf="playing">
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
+          <div class="sound-bar bg-accent-dark"></div>
         </div>
       </div>
     </div>
@@ -95,7 +117,6 @@
         class="ucap-sound-viewer-sound-controls"
         fxLayout="row"
         fxLayout.xs="column"
-        fxLayoutAlign="center center"
       >
         <div class="ucap-sound-viewer-sound-time-current">
           {{ currentTime | ucapSecondsToMinutes }}
@@ -117,4 +138,4 @@
       </div>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>