rightDrawer 스크롤 발생 수정 , 프로필 ng-deep 삭제

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

@@ -164,11 +164,7 @@
       </div>
     </perfect-scrollbar>
   </div>
-  <div
+  <div class="btn-box"
-    fxFlex="1 1 50px"
-    fxLayout="row"
-    fxLayoutAlign="center center"
-    class="btn-box"
   >
     <button
       mat-flat-button

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

@@ -17,8 +17,7 @@ $tablet-s-width: 768px;
 .rightDrawer-albumbox {
   position: relative;
   width: 100%;
-  height: 100%;
+  height: calc(100% - 50px);
-}
   .select-filebox {
     display: flex;
     flex-flow: column;
@@ -70,11 +69,11 @@ $tablet-s-width: 768px;
       }
     }
   }
-
+}
 .search-list {
   display: flex;
   padding: 0 10px;
-  height: calc(100% - 450px);
+  height: calc(100% - 380px);
   @media screen and (max-width: #{$tablet-s-width}), (max-height: 800px) {
     margin-top: 10px;
     height: calc(100% - 170px);
@@ -141,10 +140,18 @@ $tablet-s-width: 768px;
 
 .btn-box {
   position: absolute;
-  bottom: 50px;
+  bottom: 0;
   height: 50px;
   margin-bottom: 10px;
   width: 100%;
+  flex-direction: row;
+  flex: 1 1 50px;
+  max-height: 50px;
+  box-sizing: border-box;
+  display: flex;
+  place-content: center;
+  align-items: center;
+
   button {
     margin: 5px;
     font-size: 0.9em;

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

@@ -247,9 +247,6 @@
     ></mat-paginator>
 
     <div
-      fxFlex="1 1 50px"
-      fxLayout="row"
-      fxLayoutAlign="center center"
       class="btn-box"
     >
       <button

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

@@ -17,10 +17,9 @@ $tablet-s-width: 768px;
 }
 
 .rightDrawer-filebox {
+  position: relative;
   width: 100%;
-  height: calc(100% - 60px);
+  height: calc(100% - 50px);
-}
-
   .select-filebox {
     position: relative;
     display: flex;
@@ -90,6 +89,7 @@ $tablet-s-width: 768px;
       }
     }
   }
+}
 
 .mat-table {
   width: 100%;
@@ -135,7 +135,7 @@ $tablet-s-width: 768px;
   }
 }
 .table-box {
-  height: calc(100% - 420px);
+  height: calc(100% - 440px);
   overflow-y: auto;
   @media screen and (max-width: #{$tablet-s-width}), (max-height: 800px) {
     height: calc(100% - 146px);
@@ -153,15 +153,25 @@ $tablet-s-width: 768px;
   bottom: 0;
   min-height: 40px;
   width: 100%;
+  height: 170px;
   flex-direction: column;
   box-sizing: border-box;
   display: flex;
   border-top: 1px solid #dddddd;
   .btn-box {
+    position: absolute;
+    bottom: 0;
     height: 50px;
-    padding-bottom: 10px;
+    margin-bottom: 10px;
     width: 100%;
-    background-color: #ffffff;
+    flex-direction: row;
+    flex: 1 1 50px;
+    max-height: 50px;
+    box-sizing: border-box;
+    display: flex;
+    place-content: center;
+    align-items: center;
+
     button {
       margin: 5px;
       font-size: 0.9em;

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.html

@@ -1,4 +1,4 @@
-<div fxLayout="column" class="list">
+<div fxLayout="column" class="rightDrawer-userlist">
   <div class="search-list">
     <perfect-scrollbar class="room-user-scrollbar">
       <ucap-profile-user-list-item
@@ -13,9 +13,6 @@
     </perfect-scrollbar>
   </div>
   <div
-    fxFlex="1 1 50px"
-    fxLayout="row"
-    fxLayoutAlign="center center"
     class="btn-box"
   >
     <button mat-flat-button class="mat-primary" (click)="onClickAddMember()">

projects/ucap-webmessenger-app/src/app/layouts/messenger/components/right-drawer/room-user-list.component.scss

@@ -1,12 +1,11 @@
 @import '../../../../../../../ucap-webmessenger-ui/src/assets/scss/partials/presence';
-.list {
+.rightDrawer-userlist {
+  position: relative;
   width: 100%;
-  height: 100%;
+  height: calc(100% - 50px);
-  overflow: hidden;
-
   .search-list {
     overflow-y: auto;
-    height: calc(100% - 110px);
+    height: calc(100% - 60px);
   }
 }
 
@@ -16,9 +15,18 @@
   height: 50px;
   margin-bottom: 10px;
   width: 100%;
+  flex-direction: row;
+  flex: 1 1 50px;
+  max-height: 50px;
+  box-sizing: border-box;
+  display: flex;
+  place-content: center;
+  align-items: center;
+
   button {
     margin: 5px;
-    width: 50%;
     font-size: 0.9em;
+    padding: 0 12px;
+    min-width: 140px;
   }
 }

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

@@ -225,7 +225,7 @@ $login-max-height: 800px;
   }
 }
 
-::ng-deep .userInfo-call {
+.userInfo-call {
   position: relative;
   display: flex;
   flex: 0 0 26px;
@@ -234,20 +234,18 @@ $login-max-height: 800px;
   line-height: 26px;
   justify-content: center;
   justify-items: center;
-  .mat-button-wrapper {
+
+  svg {
     padding: 0;
+    margin-top: -4px;
     width: 18px;
     height: 18px;
-    justify-content: center;
-    text-align: center;
-    svg {
     fill: #ffffff;
     display: flex;
   }
 }
-}
 
-::ng-deep .button-text-item {
+.button-text-item {
   display: flex;
   button {
     justify-content: center;
@@ -259,20 +257,12 @@ $login-max-height: 800px;
       width: 36px;
       height: 36px;
       flex: 0 0 36px;
-      //line-height: 40px;
+      svg {
-      .mat-button-wrapper {
         padding: 0;
         fill: #ffffff;
         width: 20px;
         height: 20px;
-        display: inline-flex;
-        justify-content: center;
-        text-align: center;
-        svg {
         display: flex;
-          width: 100%;
-          height: 100%;
-        }
       }
     }
   }