Merge branch 'master' of https://git.loafle.net/ucap-web/next-ucap-messenger

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

@@ -50,7 +50,7 @@
             }
           }
           &.mat-tab-label-active {
-            min-width: 0 !important;
+            opacity: 0;
           }
           &[aria-selected='true'] {
             opacity: 1;
@@ -63,8 +63,7 @@
         }
       }
       .mat-ink-bar {
-        background-color: none;
-        height: 0;
+        opacity: 0;
       }
     }
   }

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/chat/clipboard.dialog.component.html

@@ -12,7 +12,7 @@
   </mat-card-header>
   <mat-card-content>
     <div fxFlex class="clipboard-tab">
-      <mat-tab-group animationDuration="0ms">
+      <mat-tab-group animationDuration="0ms" vertical>
         <mat-tab *ngIf="data.content.text">
           <ng-template mat-tab-label>
             <mat-checkbox #chkText> </mat-checkbox>

projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/settings/messenger-settings.dialog.component.html

@@ -12,7 +12,7 @@
   </mat-card-header>
   <mat-card-content>
     <div fxFlex class="setting-tab">
-      <mat-tab-group animationDuration="0ms">
+      <mat-tab-group animationDuration="0ms" vertical>
         <mat-tab class="setting">
           <ng-template mat-tab-label>
             <span class="mdi mdi-settings"></span>

projects/ucap-webmessenger-app/src/assets/scss/global/_default.scss

@@ -401,13 +401,21 @@ $daesang-grey: (
     }
   }
 
+  /*mat-tab-group[horizontal] {
+    &.theme-list {
+      .mat-tab-label {
+        flex-direction: row;
+      }
+    }
+  }*/
+
   mat-tab-group[vertical] {
     display: flex;
     flex-direction: row;
 
     .mat-tab-labels {
       display: flex;
-      flex-direction: column !important;
+      flex-direction: column;
       align-content: flex-start;
 
       .mat-tab-label {

projects/ucap-webmessenger-ui-settings/src/lib/components/general.component.html

@@ -18,6 +18,7 @@
         animationDuration="0ms"
         (selectedTabChange)="onSelectedTabChange($event)"
         fxLayout="row"
+        horizontal
         class="theme-list"
       >
         <mat-tab>

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

@@ -29,7 +29,7 @@
     .mat-tab-labels {
       position: relative;
       width: 100%;
-      flex-direction: row;
+      flex-direction: row !important;
       .mat-tab-label {
         width: 140px;
         height: 120px;