diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html index cbbd494b..3396717c 100644 --- a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html +++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.html @@ -5,7 +5,16 @@ - + + + + {{ getWorkstatus(userInfo) }} 휴가중 @@ -13,26 +22,20 @@ profileImageFileUploadItem && profileImageFileUploadItem.uploadingProgress$ " mode="determinate" strokeWidth="5" diameter="84" - [value]="profileImageFileUploadItem.uploadingProgress$ | async" class="upload-profile-image-spinner">1111 + [value]="profileImageFileUploadItem.uploadingProgress$ | async" class="upload-profile-image-spinner"> - - {{ userInfo | ucapTranslate: 'name' }} - {{ userInfo | ucapTranslate: 'grade' }} + {{ userInfo | ucapTranslate: 'name' }} + (A123456) - {{ - userInfo | ucapTranslate: 'deptName' - }} + + {{userInfo | ucapTranslate: 'deptName'}} + {{ userInfo | ucapTranslate: 'grade' }} +
{{ userInfo.intro }}가나다라라라마마마바사아자차카타파하가나다라마사아자차카타파하가나다라마사아자차카타파하가나다라마사아자차카타파하가나다라마사아자차카타파하
@@ -80,9 +83,13 @@
{{ userInfo.workplace }}
  • -
    담당업무
    +
    담당업무/근무지
    {{ userInfo.responsibilities }}
  • +
  • +
    사원직무/거래처
    +
    가나다라마바사아자차카타파하
    +
  • 이메일
    {{ userInfo.email }}
    diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.scss b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.scss index d9361b34..52733a40 100644 --- a/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.scss +++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/profile.component.scss @@ -42,7 +42,7 @@ flex-flow: row; align-items: flex-end; top: 20px; - margin-bottom: 20px; + margin-bottom: 16px; &-mask { width: 80px; @@ -57,40 +57,40 @@ background-color: #efefef; } } + .work-status { display: inline-flex; height: 24px; background-color: #ffffff; padding: 4px 14px; border-radius: 100px; - color: #777777; font-size: 13px; justify-content: center; align-items: center; } - - /*.upload-profile-image-spinner { - position: absolute; - top: 90px; - left: 160px; - } - - .upload-profile-image-btn { - position: absolute; - top: 140px; - left: 210px; - }*/ } + .mat-card-title { display: flex; + flex-flow: column; margin-top: 120px; span { @include ellipsis(1); + &.number { + font-size: 0.8em; + } } } .mat-card-subtitle { margin-left: -16px; - font-size: 1.2em; + font-size: 1.1em; + flex-flow: column; + span { + @include ellipsis(1); + &.deptName { + font-size: 1.2em; + } + } } .intro { @include ellipsis(3); @@ -142,15 +142,15 @@ height: 30px; align-items: center; flex-flow: row; - margin-bottom: 20px; + margin-bottom: 16px; dt { - width: 100px; + width: 120px; font-weight: 800; @include ellipsis(1); } dd { - width: 260px; - margin-right: 10px; + width: 240px; + margin-right: 20px; @include ellipsis(1); } } @@ -166,6 +166,25 @@ } } +::ng-deep .btn-upload-profile-image { + display: flex; + margin-left: -26px; + margin-right: 10px; + width: 36px; + height: 36px; + line-height: 36px; + justify-content: center; + justify-content: center; + &.mat-mini-fab { + .mat-button-wrapper { + display: flex; + justify-content: center; + justify-items: center; + padding: 0; + } + } +} + ::ng-deep .userInfo-call { position: relative; display: flex; @@ -197,7 +216,6 @@ &.mat-mini-fab { position: relative; display: flex; - flex: 0 0 auto; width: 40px; height: 40px; line-height: 40px; diff --git a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.scss b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.scss index 647aca02..3a888f93 100644 --- a/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.scss +++ b/projects/ucap-webmessenger-ui-profile/src/lib/components/user-list-item.component.scss @@ -66,7 +66,6 @@ $thumbnail-msize: 40px; .thumbnail { width: $thumbnail-msize; height: auto; - margin-right: 16px; } }