working for statusbar

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>

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;

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);
   }

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() {}
+}