From 1870d5764d8ce18728d4c565e664580c138811c4 Mon Sep 17 00:00:00 2001
From: richard-loafle <44828666+richard-loafle@users.noreply.github.com>
Date: Mon, 10 Feb 2020 15:20:36 +0900
Subject: [PATCH] working for statusbar

---
 .../components/main.page.component.html          |  6 ++++++
 .../components/main.page.component.scss          | 16 ++++++++++++++++
 .../src/assets/scss/global/_default.scss         | 12 ++++++++----
 .../src/lib/services/status-bar.service.ts       | 10 ++++++++++
 4 files changed, 40 insertions(+), 4 deletions(-)
 create mode 100644 projects/ucap-webmessenger-ui/src/lib/services/status-bar.service.ts

diff --git a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html
index 556c2ebc..bd5333c7 100644
--- a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html
+++ b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.html
@@ -15,6 +15,12 @@
       ></app-layout-messenger-left-side>
     </mat-drawer>
     <div class="chat-messages bg-accent-brightest">
+      <div class="messenger-statusbar-container">
+        <div class="messenger-statusbar-message">
+          업데이트가 존재합니다.
+        </div>
+        <div class="messenger-statusbar-actions"></div>
+      </div>
       <app-layout-messenger-intro
         *ngIf="!(this.selectedChat$ | async)"
       ></app-layout-messenger-intro>
diff --git a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.scss b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.scss
index a3048266..5c836fac 100644
--- a/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.scss
+++ b/projects/ucap-webmessenger-app/src/app/pages/messenger/components/main.page.component.scss
@@ -16,10 +16,26 @@
     flex: 1 1 auto;
     min-width: 320px;
     height: 100%;
+
     .chat-messages {
       width: 100%;
       height: 100%;
       font-size: 1em;
+
+      .messenger-statusbar-container {
+        width: 100%;
+        height: 25px;
+        background-color: silver;
+        text-align: center;
+
+        .messenger-statusbar-message {
+          width: calc(100% - 20px);
+          height: 100%;
+        }
+
+        .messenger-statusbar-actions {
+        }
+      }
     }
     .rightDrawer {
       width: 320px;
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 a6202655..09f6e870 100644
--- a/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
+++ b/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
@@ -391,6 +391,10 @@ $daesang-grey: (
     background-color: transparent;
   }
 
+  app-page-messenger-main mat-drawer-content {
+    overflow: hidden !important;
+  }
+
   .messages .container {
     background: mat-color($accent, 50);
   }
@@ -455,12 +459,12 @@ $daesang-grey: (
       background-color: mat-color($accent, 500);
     }
   }
-  .chatroom-search{
-    .search-form{
+  .chatroom-search {
+    .search-form {
       border: 2px solid mat-color($accent, B100);
     }
-    .btns{
-       background-color: mat-color($accent, B100);
+    .btns {
+      background-color: mat-color($accent, B100);
     }
   }
 }
diff --git a/projects/ucap-webmessenger-ui/src/lib/services/status-bar.service.ts b/projects/ucap-webmessenger-ui/src/lib/services/status-bar.service.ts
new file mode 100644
index 00000000..7a80eec7
--- /dev/null
+++ b/projects/ucap-webmessenger-ui/src/lib/services/status-bar.service.ts
@@ -0,0 +1,10 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class StatusBarService {
+  public constructor() {}
+
+  open() {}
+}