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

<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" mat-stretch-tabs>
        <mat-tab>
          <ng-template mat-tab-label>
            <span class="mdi mdi-settings"></span>
            일반
          </ng-template>
          하나
        </mat-tab>
        <mat-tab>
          <ng-template mat-tab-label>
            <span class="mdi mdi-lock"></span>
            개인정보취급방침
          </ng-template>
          둘
        </mat-tab>
        <mat-tab>
          <ng-template mat-tab-label>
            <mat-icon>group</mat-icon>
            알림
          </ng-template>
          셋
        </mat-tab>
        <mat-tab>
          <ng-template mat-tab-label>
            <mat-icon>group</mat-icon>
            장치
          </ng-template>
          넷
        </mat-tab>
        <mat-tab>
          <ng-template mat-tab-label>
            <mat-icon>group</mat-icon>
            사용권한
          </ng-template>
          넷
        </mat-tab>
        <mat-tab>
          <ng-template mat-tab-label>
            <mat-icon>group</mat-icon>
            통화
          </ng-template>
          넷
        </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>