그룹멤버로 추가 - 레이아웃 수정
This commit is contained in:
khk
parent
ae6bbd1ac5
commit
34ae7023ff
|
|
@ -1,4 +1,4 @@
|
||||||
<mat-card class="confirm-card mat-elevation-z">
|
<!--<mat-card class="confirm-card mat-elevation-z">
|
||||||
<mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
|
<mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
|
||||||
<mat-card-title>{{ data.title }}</mat-card-title>
|
<mat-card-title>{{ data.title }}</mat-card-title>
|
||||||
</mat-card-header>
|
</mat-card-header>
|
||||||
|
|
@ -29,3 +29,100 @@
|
||||||
</button>
|
</button>
|
||||||
</mat-card-actions>
|
</mat-card-actions>
|
||||||
</mat-card>
|
</mat-card>
|
||||||
|
-->
|
||||||
|
<mat-card class="confirm-card mat-elevation-z setting-frame">
|
||||||
|
<mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
|
||||||
|
<mat-card-title>설정</mat-card-title>
|
||||||
|
</mat-card-header>
|
||||||
|
<mat-card-content>
|
||||||
|
<div fxFlex class="setting-tab">
|
||||||
|
<mat-tab-group animationDuration="0ms" vertical>
|
||||||
|
<mat-tab>
|
||||||
|
<ng-template mat-tab-label>
|
||||||
|
<span class="mdi mdi-settings"></span>
|
||||||
|
일반
|
||||||
|
</ng-template>
|
||||||
|
<ucap-settings-general class="setting-category general"></ucap-settings-general>
|
||||||
|
</mat-tab>
|
||||||
|
<mat-tab>
|
||||||
|
<ng-template mat-tab-label>
|
||||||
|
<span class="mdi mdi-lock"></span>
|
||||||
|
개인정보취급방침
|
||||||
|
</ng-template>
|
||||||
|
<ucap-settings-privacy class="setting-category"></ucap-settings-privacy>
|
||||||
|
</mat-tab>
|
||||||
|
<mat-tab>
|
||||||
|
<ng-template mat-tab-label>
|
||||||
|
<span class="mdi mdi-bell"></span>
|
||||||
|
알림
|
||||||
|
</ng-template>
|
||||||
|
<ucap-settings-notification class="setting-category"></ucap-settings-notification>
|
||||||
|
</mat-tab>
|
||||||
|
<mat-tab>
|
||||||
|
<ng-template mat-tab-label>
|
||||||
|
<span class="mdi mdi-headset"></span>
|
||||||
|
장치
|
||||||
|
</ng-template>
|
||||||
|
<ucap-settings-device class="setting-category"></ucap-settings-device>
|
||||||
|
</mat-tab>
|
||||||
|
<mat-tab>
|
||||||
|
<ng-template mat-tab-label>
|
||||||
|
<span class="mdi mdi-view-grid-plus"></span>
|
||||||
|
사용권한
|
||||||
|
</ng-template>
|
||||||
|
<ucap-settings-permission class="setting-category"></ucap-settings-permission>
|
||||||
|
</mat-tab>
|
||||||
|
<mat-tab>
|
||||||
|
<ng-template mat-tab-label>
|
||||||
|
<span class="mdi mdi-phone"></span>
|
||||||
|
통화
|
||||||
|
</ng-template>
|
||||||
|
<ucap-settings-call class="setting-category"></ucap-settings-call>
|
||||||
|
</mat-tab>
|
||||||
|
</mat-tab-group>
|
||||||
|
|
||||||
|
<!-- <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;"
|
||||||
|
>
|
||||||
|
dddagadsfgadsf
|
||||||
|
</div>
|
||||||
|
<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;"
|
||||||
|
>
|
||||||
|
rgkdsfgkdfglkdsflgs
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
</mat-card-content>
|
||||||
|
<mat-card-actions class="button-farm flex-row">
|
||||||
|
<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>
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
::ng-deep .mat-card-header-tex{
|
/*::ng-deep .mat-card-header-tex{
|
||||||
margin:0;
|
margin:0;
|
||||||
}
|
}
|
||||||
.confirm-card{
|
.confirm-card{
|
||||||
|
|
@ -23,5 +23,108 @@ form{
|
||||||
.mat-form-field{
|
.mat-form-field{
|
||||||
width:100%;
|
width:100%;
|
||||||
}
|
}
|
||||||
|
}*/
|
||||||
|
|
||||||
|
|
||||||
|
::ng-deep .cdk-overlay-pane {
|
||||||
|
width: 600px;
|
||||||
|
max-height: 90%;
|
||||||
|
height:800px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::ng-deep .setting-frame{
|
||||||
|
padding: 16px;
|
||||||
|
height:100%;
|
||||||
|
min-width: 500px;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.mat-dialog-container {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-card-header {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
border-bottom:1px solid #dddddd;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-card-content {
|
||||||
|
flex: 0 0 auto;
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
height: calc(100% - 100px);
|
||||||
|
border-bottom:1px solid #dddddd;
|
||||||
|
.setting-tab{
|
||||||
|
position: relative;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
.mat-tab-body-wrapper{
|
||||||
|
border-left:1px solid #dddddd;
|
||||||
|
position: relative;
|
||||||
|
height:100%;
|
||||||
|
padding: 0 0 10px 10px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-farm {
|
||||||
|
text-align: right;
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 10px;
|
||||||
|
.mat-primary {
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::ng-deep .setting-tab{
|
||||||
|
.mat-tab-group{
|
||||||
|
position: relative;
|
||||||
|
height:100%;
|
||||||
|
width:100%;
|
||||||
|
.mat-tab-header{
|
||||||
|
.mat-tab-label-container{
|
||||||
|
.mat-tab-list{
|
||||||
|
.mat-tab-labels{
|
||||||
|
border-bottom:0;
|
||||||
|
padding-right:10px;
|
||||||
|
.mat-tab-label{
|
||||||
|
padding:0 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-tab-body-wrapper{
|
||||||
|
.mat-tab-body{
|
||||||
|
.mat-tab-body-conten{
|
||||||
|
position:relative;
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
.mat-list-base{
|
||||||
|
position:relative;
|
||||||
|
.mat-list-option{
|
||||||
|
height:40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::ng-deep .setting-category{
|
||||||
|
.mat-list-base{
|
||||||
|
position:relative;
|
||||||
|
.mat-list-item{
|
||||||
|
font-size:15px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.mat-divider{
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user