수정사항 반영

projects/ucap-webmessenger-ui-account/src/lib/components/login.component.html

@@ -7,7 +7,10 @@
   </div>
 
   <form name="loginForm" [formGroup]="loginForm" novalidate>
-    <mat-form-field [style.display]="!!curCompanyCode ? 'none' : 'block'">
+    <mat-form-field
+      [style.display]="!!curCompanyCode ? 'none' : 'block'"
+      class="login-company"
+    >
       <mat-label>{{ 'accounts.fieldCompany' | translate }}</mat-label>
       <mat-select [formControl]="companyCodeFormControl">
         <mat-option
@@ -18,12 +21,12 @@
       </mat-select>
     </mat-form-field>
 
-    <mat-form-field>
+    <mat-form-field class="login-id">
       <mat-label>{{ 'accounts.fieldLoginId' | translate }}</mat-label>
       <input matInput [formControl]="loginIdFormControl" />
     </mat-form-field>
 
-    <mat-form-field>
+    <mat-form-field class="login-pw">
       <mat-label>{{ 'accounts.fieldLoginPw' | translate }}</mat-label>
       <input
         matInput

projects/ucap-webmessenger-ui-account/src/lib/components/login.component.scss

@@ -28,21 +28,17 @@ $login-max-height: 800px;
   text-align: center;
   background-color: rgba(255, 255, 255, 1);
   border-radius: 0px;
+  font-size: 14px;
 
   .mat-title {
     margin: 10px 0 40px 0;
     text-indent: -10000000px;
     width: 140px;
     height: 140px;
-    // background-image: url(/assets/images/logo/bg_login_w160.png);
     background-repeat: no-repeat;
     display: inline-flex;
     background-size: 100% auto;
     flex: 1 1 auto;
-    /*@media all and (max-height: 800px), (max-width: 1400px) {
-        width: 14vh;
-        margin: 10px 0 10px 0;
-      }*/
   }
 
   form {
@@ -51,6 +47,12 @@ $login-max-height: 800px;
 
     mat-form-field {
       width: 100%;
+      &.login-id {
+        margin-bottom: 10px;
+        @media screen and (max-width: #{$tablet-s-width}) {
+          margin-bottom: 0;
+        }
+      }
     }
 
     mat-checkbox {

projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.html

@@ -7,11 +7,11 @@
   <div class="add-option">
     <button
       mat-icon-button
-      class="material-icons"
+      class="material-icons icon-button"
       (click)="onClickFileInput()"
       matTooltip="{{ 'chat.btnAttachFile' | translate }}"
     >
-      <mat-icon>attach_file</mat-icon>
+      <i class="mid mdi-upload"></i>
     </button>
     <input
       type="file"
@@ -23,11 +23,12 @@
 
     <button
       mat-icon-button
-      class="material-icons"
+      class="material-icons icon-button"
       (click)="onClickStickerSelector()"
       matTooltip="{{ 'chat.btnSticker' | translate }}"
     >
-      <mat-icon>sentiment_satisfied_alt</mat-icon>
+      <!--<mat-icon>sentiment_satisfied_alt</mat-icon>-->
+      <i class="mid  mdi-emoticon-happy-outline"></i>
     </button>
 
     <button

projects/ucap-webmessenger-ui-chat/src/lib/components/form.component.scss

@@ -17,10 +17,11 @@ $tablet-l-width: 1024px;
       margin-right: 10px;
     }
     button {
-      width: 20px;
+      width: 24px;
-      height: 20px;
+      height: 24px;
       line-height: normal;
-
+      margin-right: 6px;
+      color: rgb(0, 0, 0, 0.7);
       .mat-icon {
         font-size: 20px;
         color: rgb(0, 0, 0, 0.87);
@@ -33,25 +34,26 @@ $tablet-l-width: 1024px;
           border-radius: 50%;
         }
       }
-
+      i {
+        font-size: 24px;
+      }
       svg {
-        fill: rgb(0, 0, 0, 0.87);
+        fill: rgb(0, 0, 0, 0.7);
       }
     }
   }
 }
+
 textarea[name='message'] {
   min-height: 2em;
   line-height: 1.2em;
   font-size: 0.9em;
 }
+
 .mat-form-field-flex {
   padding-top: 0;
 }
-.mat-form-field-underline {
+
-  background-color: none;
-  transform: scaleY(0);
-}
 ::ng-deep .send-message-button {
   margin-left: 20px;
   @media screen and (max-width: #{$tablet-l-width}), (max-height: 800px) {

projects/ucap-webmessenger-ui/src/assets/scss/partials/_forms.scss

@@ -97,10 +97,14 @@ textarea {
         display: none;
       }
     }
+    //텍스트 선명도
   }
 }
 
-//label 선명도
+.mat-error {
+  font-size: 0.84em;
+}
+
 .mat-form-field {
   &.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float
     .mat-form-field-label,
@@ -109,10 +113,10 @@ textarea {
     + .mat-form-field-label-wrapper
     .mat-form-field-label {
     font-size: 0.7em;
-    transform: translateY(-1.28125em) scale(1);
+    transform: translateY(-1.1em) scale(1);
+  }
+  .mat-form-field-underline {
+    background-color: none;
+    transform: scaleY(1);
   }
 }
-
-.mat-error {
-  font-size: 0.84em;
-}

projects/ucap-webmessenger-ui/src/assets/scss/partials/_icons.scss

@@ -53,4 +53,7 @@ mat-icon {
       -moz-osx-font-smoothing: grayscale;
     }
   }
+  &:hover {
+    opacity: 0.7;
+  }
 }

projects/ucap-webmessenger-ui/src/assets/scss/partials/_paginator.scss

@@ -2,7 +2,13 @@
 
 .mat-paginator {
   .mat-paginator-container {
-    justify-content: center;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    min-height: 56px;
+    padding: 0 8px;
+    width: 100%;
+    flex-flow: column-reverse;
   }
   .mat-paginator-navigation-first {
     order: 1;

projects/ucap-webmessenger-ui/src/lib/components/integrated-search-form.component.scss

@@ -1,4 +1,4 @@
-.search-container {
+::ng-deep .search-container {
   -webkit-app-region: no-drag;
   display: flex;
   flex-flow: row;

projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.html

@@ -195,7 +195,7 @@
       </table>
     </perfect-scrollbar>
   </div>
-  <div class="footer-fix">
+  <div class="footer-fix search-result-footer">
     <mat-paginator
       [length]="totalCount"
       [pageSize]="pageListCount"

projects/ucap-webmessenger-ui/src/lib/components/integrated-search.component.scss

@@ -152,7 +152,16 @@
   font-size: 0.8em;
   text-align: center;
 }
-.mat-paginator-container {
+::ng-deep .search-result-footer {
-  display: flex;
+  position: relative;
-  flex-flow: column;
+  .mat-paginator-container {
+    .mat-paginator-page-size {
+      position: absolute;
+      left: 0;
+      top: -10px;
+    }
+    .mat-paginator-range-actions {
+      padding-top: 10px;
+    }
+  }
 }