ucap/next-ucap-messenger
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

vertial tab is modified

Browse Source
This commit is contained in:
병준 박 2019-11-21 15:19:27 +09:00
parent c7b14abb6d
commit 7d76bb7076
2 changed files with 43 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -4,7 +4,7 @@
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<div fxFlex class="setting-tab"> <div fxFlex class="setting-tab">
<mat-tab-group animationDuration="0ms" mat-stretch-tabs> <mat-tab-group animationDuration="0ms" vertical>
<mat-tab> <mat-tab>
<ng-template mat-tab-label> <ng-template mat-tab-label>
<span class="mdi mdi-settings"></span> <span class="mdi mdi-settings"></span>
@ -49,28 +49,52 @@
</mat-tab> </mat-tab>
</mat-tab-group> </mat-tab-group>
<div class="left-side-tabs-body"> <!-- <div class="left-side-tabs-body">
<div #tabs id="tabs-0" class="left-side-tabs-contents" style="display: block;"> <div
#tabs
id="tabs-0"
class="left-side-tabs-contents"
style="display: block;"
>
ddddd ddddd
</div> </div>
<div #tabs id="tabs-1" class="left-side-tabs-contents" style="display: none;"> <div
#tabs
id="tabs-1"
class="left-side-tabs-contents"
style="display: none;"
>
dddagadsfgadsf dddagadsfgadsf
</div> </div>
<div #tabs id="tabs-2" class="left-side-tabs-contents" style="display: none;"> <div
#tabs
id="tabs-2"
class="left-side-tabs-contents"
style="display: none;"
>
fbkasfldsafkskdf fbkasfldsafkskdf
</div> </div>
<div #tabs id="tabs-3" class="left-side-tabs-contents" style="display: none;"> <div
#tabs
id="tabs-3"
class="left-side-tabs-contents"
style="display: none;"
>
rgkdsfgkdfglkdsflgs rgkdsfgkdfglkdsflgs
</div> </div>
</div> </div> -->
</div> </div>
</mat-card-content> </mat-card-content>
<mat-card-actions class="button-farm flex-row"> <mat-card-actions class="button-farm flex-row">
<button mat-stroked-button (click)="onClickChoice(false)" class="mat-primary"> <button
mat-stroked-button
(click)="onClickChoice(false)"
class="mat-primary"
>
No No
</button> </button>
<button mat-flat-button (click)="onClickChoice(true)" class="mat-primary"> <button mat-flat-button (click)="onClickChoice(true)" class="mat-primary">
Yes Yes
</button> </button>
</mat-card-actions> </mat-card-actions>
</mat-card> </mat-card>

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

@ -301,6 +301,11 @@ $daesang-grey: (
.mat-tab-labels { .mat-tab-labels {
display: flex; display: flex;
flex-direction: column !important; flex-direction: column !important;
align-content: flex-start;
.mat-tab-label {
justify-content: flex-start;
}
} }
.mat-ink-bar { .mat-ink-bar {
@ -313,12 +318,13 @@ $daesang-grey: (
nav[mat-tab-nav-bar][vertical] { nav[mat-tab-nav-bar][vertical] {
display: flex; display: flex;
flex-direction: row !important; flex-direction: row !important;
.mat-tab-links {
display: flex;
flex-direction: column !important;
}
} }
nav[mat-tab-nav-bar][vertical] .mat-tab-links {
display: flex;
flex-direction: column !important;
}
.messages .container { .messages .container {
background: mat-color($accent, 50); background: mat-color($accent, 50);
} }