vertial tab is modified

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

View File

@ -4,7 +4,7 @@
</mat-card-header>
<mat-card-content>
<div fxFlex class="setting-tab">
<mat-tab-group animationDuration="0ms" mat-stretch-tabs>
<mat-tab-group animationDuration="0ms" vertical>
<mat-tab>
<ng-template mat-tab-label>
<span class="mdi mdi-settings"></span>
@ -49,28 +49,52 @@
</mat-tab>
</mat-tab-group>
<div class="left-side-tabs-body">
<div #tabs id="tabs-0" class="left-side-tabs-contents" style="display: block;">
<!-- <div class="left-side-tabs-body">
<div
#tabs
id="tabs-0"
class="left-side-tabs-contents"
style="display: block;"
>
ddddd
</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
</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
</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
</div>
</div>
</div> -->
</div>
</mat-card-content>
<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
</button>
<button mat-flat-button (click)="onClickChoice(true)" class="mat-primary">
Yes
</button>
</mat-card-actions>
</mat-card>
</mat-card>

View File

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