디자인 수정사항 - 일부 반영

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/organization.component.html

@@ -20,7 +20,7 @@
     ></ucap-organization-tree>
   </div>
   <div class="select-list">
-    <dl class="select-dept text-accent-color">
+    <dl class="select-dept">
       <dt>
         <ng-container *ngIf="!isShowSearch">
           <ng-container

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.html

@@ -41,7 +41,7 @@
         <button
           mat-icon-button
           aria-label="chats button"
-          class="bg-warn-color chat-timer"
+          class="responsive-chats-button chat-timer"
           *ngIf="!!roomInfo && roomInfo.isTimeRoom"
         >
           <mat-icon>timer</mat-icon>

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/messages.component.scss

@@ -46,6 +46,7 @@
       .responsive-chats-button {
         display: none;
         line-height: normal;
+        cursor: unset;
         &:last-child {
           display: block;
           padding: 0;

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/album-box.component.scss

@@ -103,6 +103,7 @@
     .ps-content {
       display: flex;
       flex-flow: wrap;
+      height: auto;
     }
   }
 }

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.html

@@ -32,38 +32,40 @@
       </div>
     </ng-container>
     <ng-container *ngIf="selectedFile">
-      <div class="select-flie">
+      <div class="select-filed">
-        <div
+        <div class="select-flie">
-          [ngClass]="[
+          <div
-            'mime-icon',
+            [ngClass]="[
-            'light',
+              'mime-icon',
-            'ico-' + getExtention(selectedFile.info.name)
+              'light',
-          ]"
+              'ico-' + getExtention(selectedFile.info.name)
-        >
+            ]"
-          <div class="ico"></div>
+          >
+            <div class="ico"></div>
+          </div>
+          <ul>
+            <li class="name">{{ selectedFile.info.name }}</li>
+            <li>
+              <span class="text-accent-color"
+                >{{ 'common.file.size' | translate }} :</span
+              >
+              {{ selectedFile.info.size | ucapBytes }}
+            </li>
+            <li>
+              <span class="text-accent-color"
+                >{{ 'chat.validityPeriod' | translate }} :</span
+              >
+              {{ selectedFile.info.sendDate | ucapDate: 'YYYY.MM.DD' }}
+              <span *ngIf="loginRes.fileRetentionPeriod > 0">
+                ~
+                {{
+                  selectedFile.info.sendDate
+                    | ucapDate: 'YYYY.MM.DD':fileRetentionPeriodOptions
+                }}
+              </span>
+            </li>
+          </ul>
         </div>
-        <ul>
-          <li class="name">{{ selectedFile.info.name }}</li>
-          <li>
-            <span class="text-accent-color"
-              >{{ 'common.file.size' | translate }} :</span
-            >
-            {{ selectedFile.info.size | ucapBytes }}
-          </li>
-          <li>
-            <span class="text-accent-color"
-              >{{ 'chat.validityPeriod' | translate }} :</span
-            >
-            {{ selectedFile.info.sendDate | ucapDate: 'YYYY.MM.DD' }}
-            <span *ngIf="loginRes.fileRetentionPeriod > 0">
-              ~
-              {{
-                selectedFile.info.sendDate
-                  | ucapDate: 'YYYY.MM.DD':fileRetentionPeriodOptions
-              }}
-            </span>
-          </li>
-        </ul>
       </div>
       <div class="select-file-option">
         <span
@@ -195,7 +197,7 @@
             <div class="file-name">
               {{ element.info.name }}
             </div>
-            <div class="download-period text-accent-color">
+            <div class="download-period text-accent-darkest">
               <!--{{ element.info.size | ucapBytes }}-->
               {{ element.info.sendDate | ucapDate: 'YYYY.MM.DD' }}
               <span *ngIf="loginRes.fileRetentionPeriod > 0">
@@ -221,9 +223,8 @@
           <th mat-header-cell *matHeaderCellDef mat-sort-header>
             {{ 'chat.sentDate' | translate }}
           </th>
-          <td mat-cell *matCellDef="let element">
+          <td mat-cell *matCellDef="let element" class="file-size">
-            <!--{{ element.info.sendDate | ucapDate: 'YYYY.MM.DD' }}-->
+            <span>{{ element.info.size | ucapBytes }}</span>
-            {{ element.info.size | ucapBytes }}
           </td>
         </ng-container>
         <tr

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/file-box.component.scss

@@ -30,18 +30,24 @@
   margin: 10px;
   border: 1px solid #cccccc;
   border-radius: 4px;
-  .select-flie {
+  .select-filed {
-    display: flex;
+    height: calc(100% - 50px);
-    flex-flow: row;
+    overflow-y: auto;
-    align-items: center;
+    .select-flie {
-    color: #212121;
+      display: flex;
-    align-items: center;
+      flex-flow: row;
-    padding: 10px;
+      align-items: flex-start;
-    border-bottom: 1px dotted #dddddd;
+      color: #212121;
-    ul {
+      padding: 10px;
-      padding: 0;
+      border-bottom: 1px dotted #dddddd;
-      .name {
+      ul {
-        font-weight: 600;
+        padding: 0;
+        .name {
+          font-weight: 600;
+          word-wrap: break-word;
+          white-space: pre-wrap;
+          word-break: break-word;
+        }
       }
     }
   }
@@ -88,16 +94,19 @@
   width: 100%;
   position: relative;
   th.infos {
-    padding: 10px;
+    padding: 16px;
   }
   tr.mat-row {
     height: 70px;
+    .cdk-column-check {
+      width: 40px;
+    }
     .file-info {
       padding: 16px;
       display: grid;
       height: 70px;
       .file-name {
-        font-weight: 600;
+        font-weight: 500;
         margin-bottom: 2px;
         width: 100%;
         @include ellipsis(1);
@@ -116,12 +125,24 @@
         }
       }
     }
+    .file-size {
+      span {
+        width: 100px;
+        text-align: right;
+        @include ellipsis(1);
+      }
+    }
   }
 }
 .table-box {
   height: calc(100% - 440px);
   overflow-y: auto;
+  th {
+    font-size: 1.1em;
+    color: #333333;
+  }
 }
+
 .mat-paginator-container {
   display: flex;
   flex-flow: column;

projects/ucap-webmessenger-app/src/app/pages/account/components/login.page.component.scss

@@ -253,20 +253,7 @@ $ease-in-out: cubic-bezier(0.785, 0.135, 0.15, 0.86);
   }
 }
 
-/*.sig {
+::ng-deep .login-form-box {
-  position: fixed;
-  bottom: 8px;
-  right: 8px;
-  text-decoration: none;
-  font-size: 12px;
-  font-weight: 100;
-  font-family: sans-serif;
-  color: rgba(255, 255, 255, 0.4);
-  letter-spacing: 2px;
-  z-index: 9999;
-}*/
-
-.login-form-box {
   position: absolute;
   height: 70vh;
   top: 15%;
@@ -274,6 +261,16 @@ $ease-in-out: cubic-bezier(0.785, 0.135, 0.15, 0.86);
   display: flex;
   justify-content: flex-end;
   z-index: 100;
+  .mat-form-field {
+    &:last-child {
+      margin-top: 10px;
+    }
+    .mat-form-field-infix {
+      input {
+        line-height: 1em;
+      }
+    }
+  }
 }
 
 @media all and (max-width: 1400px) {

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

@@ -15,7 +15,7 @@
   }
 
   .mat-title {
-    margin: 10px 0 50px 0;
+    margin: 10px 0 40px 0;
     text-indent: -10000000px;
     width: 160px;
     height: 160px;