From 1da9fe0940f84ab45045d5c150c3caada77ef8a6 Mon Sep 17 00:00:00 2001
From: khk <khk@gmail.com>
Date: Tue, 4 Feb 2020 16:24:39 +0900
Subject: [PATCH] =?UTF-8?q?=EC=88=98=EC=A0=95=EC=82=AC=ED=95=AD=20?=
 =?UTF-8?q?=EB=B0=98=EC=98=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/messages.component.scss        |  1 +
 .../right-drawer/notice.component.html        |  2 +-
 .../right-drawer/notice.component.scss        |  3 +
 .../notice-detail.dialog.component.html       |  2 +-
 .../notice-detail.dialog.component.scss       | 23 ++---
 .../src/assets/scss/global/_default.scss      | 12 ++-
 .../lib/components/message-box.component.scss |  3 +-
 .../src/lib/components/search.component.html  | 90 +++++++++++++------
 .../schedule-send.dialog.component.html       |  4 +-
 .../schedule-send.dialog.component.scss       |  7 +-
 .../src/assets/scss/partials/_forms.scss      | 15 +++-
 .../assets/scss/partials/_search-frame.scss   |  8 ++
 .../snackbars/alert.snackbar.component.scss   |  3 +
 13 files changed, 129 insertions(+), 44 deletions(-)

diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss
index 1ee9592c..555bb867 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss
@@ -176,6 +176,7 @@
 
 ::ng-deep .chat-snackbar-class {
   .mat-simple-snackbar {
+    justify-content: center;
     span {
       @include ellipsis(1);
     }
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.html
index 94f5e39a..b6c1ddf5 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.html
@@ -43,7 +43,7 @@
       </table>
     </perfect-scrollbar>
   </div>
-  <div fxFlex="1 1 111.5px" class="footer-fix">
+  <div class="footer-fix">
     <mat-paginator
       [length]="totalCount"
       [pageSize]="10"
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.scss
index 8ebb0ff4..499f6d07 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.scss
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/notice.component.scss
@@ -22,6 +22,9 @@
     height: calc(100% - 111.5px);
     overflow: auto;
   }
+  .footer-fix {
+    width: 100%;
+  }
 }
 
 .mat-table {
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.html
index dca6ad05..494242db 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.html
@@ -19,7 +19,7 @@
     </perfect-scrollbar>
   </mat-card-content>
   <mat-card-actions class="button-farm flex-row">
-    <button mat-stroked-button (click)="onClickConfirm()" class="mat-primary">
+    <button mat-flat-button (click)="onClickConfirm()" class="mat-primary">
       {{ 'common.messages.confirm' | translate }}
     </button>
   </mat-card-actions>
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.scss
index 4fedf13d..4c6cd15b 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.scss
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/notice/notice-detail.dialog.component.scss
@@ -13,18 +13,21 @@
   }
 }
 
-::ng-deep .mat-card-header-text {
-  margin: 0;
-  .title {
-    width: 480px;
-    @include ellipsis(1);
+.mat-card-header {
+  .mat-card-header-text {
+    .title {
+      @include ellipsis(1);
+    }
+    .btn-dialog-close {
+      font-size: 20px;
+      display: flex;
+      margin-left: auto;
+      align-self: flex-start;
+      color: #444444;
+    }
   }
-  .btn-dialog-close {
-    font-size: 20px;
-    display: flex;
+  .icon-button {
     margin-left: auto;
-    align-self: flex-start;
-    color: #444444;
   }
 }
 .confirm-card {
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 a60e59d4..18272614 100644
--- a/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
+++ b/projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss
@@ -275,6 +275,14 @@ $daesang-grey: (
     cursor: pointer;
   }
 
+  .cdk-global-overlay-wrapper {
+    align-items: center !important;
+    justify-content: center !important;
+    .mat-simple-snackbar {
+      justify-content: center;
+    }
+  }
+
   .policy {
     color: mat-color($accent, B100);
   }
@@ -440,7 +448,7 @@ $daesang-grey: (
       }
     }
   }
-  .mat-calendar-body-selected{
-     background-color: mat-color($accent);
+  .mat-calendar-body-selected {
+    background-color: mat-color($accent);
   }
 }
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.scss b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.scss
index d0265ade..6d18bba3 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.scss
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/message-box.component.scss
@@ -29,9 +29,10 @@ $tablet-s-width: 768px;
     .profile-img {
       flex: 0 0 auto;
       &.thumbnail-mask {
-        border-radius: 50%;
         width: 40px;
         height: 40px;
+        border: 1px solid rgb(0, 0, 0, 0.1);
+        border-radius: 50%;
         overflow: hidden;
         img {
           width: 40px;
diff --git a/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.html b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.html
index c663dced..111cd570 100644
--- a/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.html
+++ b/projects/ucap-webmessenger-ui-chat/src/lib/components/search.component.html
@@ -1,5 +1,9 @@
-<div fxFlex fxLayout="row" class="chatroom-search">
-  <div fxLayout="row" fxLayoutAlign="start center" class="input input-lineless search-form">
+<!--<div fxFlex fxLayout="row" class="chatroom-search">
+  <div
+    fxLayout="row"
+    fxLayoutAlign="start center"
+    class="input input-lineless search-form"
+  >
     <form [formGroup]="fgSearch">
       <span class="icon-img">
         <i class="mid mdi-magnify"></i>
@@ -39,33 +43,69 @@
       <i class="mid mdi-arrow-up"></i>
     </button>
     <button class="icon-button btn-search" (click)="onClickPrevSearch()">
-      <i class="mid mdi-arrow-up"></i>
+      <i class="mid mdi-arrow-up mdi-chevron-up"></i>
     </button>
     <button class="icon-button btn-search" (click)="onClickNextSearch()">
-      <i class="mid mdi-arrow-down"></i>
+      <i class="mid mdi-arrow-down mdi-chevron-down"></i>
     </button>
-
-    <!--<mat-button-toggle-group>
-      <mat-button-toggle></mat-button-toggle>
-      <mat-button-toggle >
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          width="24"
-          height="24"
-          viewBox="0 0 24 24"
-          fill="none"
-          stroke="currentColor"
-          stroke-width="2"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          class="feather feather-arrow-up"
+    <button
+      class="icon-button btn-close-searchbox bg-accent-dark"
+      (click)="inputSearch.value = ''; onClickSearchCancel()"
+    >
+      <i class="mid mdi-window-close"></i>
+    </button>
+  </div>
+</div>-->
+<div fxFlex fxLayout="row" class="chatroom-search">
+  <div
+    fxLayout="row"
+    fxLayoutAlign="start center"
+    class="input input-lineless search-form"
+  >
+    <form [formGroup]="fgSearch">
+      <span class="icon-img">
+        <i class="mid mdi-magnify"></i>
+      </span>
+      <mat-form-field floatLabel="never">
+        <input
+          matInput
+          #inputSearch
+          type="text"
+          placeholder="{{ 'chat.searchEventByText' | translate }}"
+          value=""
+          formControlName="searchInput"
+          (keydown.enter)="onKeyDownEnter($event, inputSearch.value)"
+        />
+        <button
+          mat-button
+          matSuffix
+          mat-icon-button
+          aria-label="Clear"
+          *ngIf="inputSearch.value"
+          (click)="inputSearch.value = ''"
         >
-          <line x1="12" y1="19" x2="12" y2="5"></line>
-          <polyline points="5 12 12 5 19 12"></polyline>
-        </svg>
-      </mat-button-toggle>
-      <mat-button-toggle ></mat-button-toggle>
-    </mat-button-toggle-group>-->
+          <mat-icon>close</mat-icon>
+        </button>
+      </mat-form-field>
+      <span class="text-amount">{{ curIndex }} / {{ totalCount }}</span>
+    </form>
+  </div>
+  <span class="stroke-bar"></span>
+  <div class="btns">
+    <button
+      *ngIf="false"
+      mat-stroked-button
+      (click)="onClickSearchAndPrev()"
+      class="btn-toggle"
+    >
+      <i class="mid mdi-arrow-up"></i>
+    </button>
+    <button class="icon-button btn-search" (click)="onClickPrevSearch()">
+      <i class="mid  mdi-chevron-up"></i>
+    </button>
+    <button class="icon-button btn-search" (click)="onClickNextSearch()">
+      <i class="mid mdi-chevron-down"></i>
+    </button>
     <button
       class="icon-button btn-close-searchbox bg-accent-dark"
       (click)="inputSearch.value = ''; onClickSearchCancel()"
diff --git a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.html b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.html
index a2b601a2..ae30f041 100644
--- a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.html
+++ b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.html
@@ -35,8 +35,8 @@
       </div>
       <div fxFlex="40%" style="margin-left: 30px;">
         <div fxLayout="column">
-          <div fxFlex="40px" style="margin-top: 30px;" class="Reservation-dete">
-            <span flFlexFill style="font-size: 20px;" class="text-accent-dark">
+          <div fxFlex="40px" class="Reservation-dete">
+            <span flFlexFill class="text-accent-dark">
               {{ selectedDate.format('MMM DD YYYY, HH:mm') }}
             </span>
           </div>
diff --git a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.scss b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.scss
index d69e2282..9e2650d3 100644
--- a/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.scss
+++ b/projects/ucap-webmessenger-ui-message/src/lib/dialogs/schedule-send.dialog.component.scss
@@ -17,7 +17,7 @@
   .actions {
     margin-left: auto;
     button {
-      margin-left: 8px;
+      margin-left: 4px;
     }
   }
 }
@@ -34,3 +34,8 @@
     margin-right: 20px;
   }
 }
+
+.Reservation-dete {
+  margin-top: 30px;
+  font-size: 1.6em;
+}
diff --git a/projects/ucap-webmessenger-ui/src/assets/scss/partials/_forms.scss b/projects/ucap-webmessenger-ui/src/assets/scss/partials/_forms.scss
index ec92d616..7319a8e9 100644
--- a/projects/ucap-webmessenger-ui/src/assets/scss/partials/_forms.scss
+++ b/projects/ucap-webmessenger-ui/src/assets/scss/partials/_forms.scss
@@ -83,6 +83,7 @@ textarea {
         width: auto;
         input {
           margin: 0;
+          line-height: 1.4em;
         }
         .mat-form-field-label-wrapper {
           top: 0;
@@ -113,10 +114,22 @@ textarea {
     + .mat-form-field-label-wrapper
     .mat-form-field-label {
     font-size: 0.7em;
-    transform: translateY(-1.1em) scale(1);
+    transform: translateY(-1.4em) scale(1);
   }
   .mat-form-field-underline {
     background-color: none;
     transform: scaleY(1);
   }
+  .mat-form-field-wrapper {
+    .mat-form-field-infix {
+      .mat-input-element {
+        line-height: 1.4em;
+      }
+    }
+    .mat-form-field-label-wrapper {
+      .mat-form-field-label {
+        line-height: 1.4em;
+      }
+    }
+  }
 }
diff --git a/projects/ucap-webmessenger-ui/src/assets/scss/partials/_search-frame.scss b/projects/ucap-webmessenger-ui/src/assets/scss/partials/_search-frame.scss
index 0b0a7642..2af801b7 100644
--- a/projects/ucap-webmessenger-ui/src/assets/scss/partials/_search-frame.scss
+++ b/projects/ucap-webmessenger-ui/src/assets/scss/partials/_search-frame.scss
@@ -24,6 +24,7 @@ $search-font-size: 14px;
       width: 100%;
       font-size: 1em;
       padding-left: 0;
+      line-height: 1.4em;
     }
     .btn-search {
       color: #777777;
@@ -60,6 +61,11 @@ $search-font-size: 14px;
               line-height: 24px;
             }
           }
+          .mat-form-field-label-wrapper {
+            .mat-form-field-label {
+              line-height: 1.4em;
+            }
+          }
         }
       }
     }
@@ -88,6 +94,7 @@ $search-font-size: 14px;
   display: inline-flex;
   width: 46%;
   padding-left: 20px;
+  line-height: 1.4em;
 
   & + .searchbox {
     width: 54%;
@@ -96,6 +103,7 @@ $search-font-size: 14px;
       display: inline-flex;
       width: 100%;
       font-size: 1em;
+      line-height: 1.4em;
       padding-left: 0;
     }
     .btn-search {
diff --git a/projects/ucap-webmessenger-ui/src/lib/snackbars/alert.snackbar.component.scss b/projects/ucap-webmessenger-ui/src/lib/snackbars/alert.snackbar.component.scss
index e69de29b..5ed29896 100644
--- a/projects/ucap-webmessenger-ui/src/lib/snackbars/alert.snackbar.component.scss
+++ b/projects/ucap-webmessenger-ui/src/lib/snackbars/alert.snackbar.component.scss
@@ -0,0 +1,3 @@
+.mat-simple-snackbar {
+  justify-content: center;
+}