프로필수정- 디자인수정
This commit is contained in:
khk
parent
94d2d98cb8
commit
73e2632044
|
|
@ -2,7 +2,7 @@
|
|||
<div class="app-layout-native-title-bar-logo">
|
||||
<img src="assets/images/logo/64_64.png" />
|
||||
</div>
|
||||
<div class="app-layout-native-title-bar-title">UCAP M Messenger!!</div>
|
||||
<div class="app-layout-native-title-bar-title">DS Talk</div>
|
||||
<div class="app-layout-native-title-bar-spacer"></div>
|
||||
<div *ngIf="!!loginRes" class="app-layout-native-title-bar-link">
|
||||
<button
|
||||
|
|
@ -12,21 +12,15 @@
|
|||
matTooltip="웹링크"
|
||||
(click)="onToggleWebLinkSelector()"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="18"
|
||||
height="18"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
alt="웹링크"
|
||||
class="stroke-warn-color"
|
||||
>
|
||||
<svg class="svg-icon" viewBox="0 0 24 24" fill="currentColor">
|
||||
<path
|
||||
d="M10 3H6a2 2 0 0 0-2 2v14c0 1.1.9 2 2 2h4M16 17l5-5-5-5M19.8 12H9"
|
||||
d="M13.29 9.29l-4 4a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0l4-4a1 1 0 0 0-1.42-1.42z"
|
||||
/>
|
||||
<path
|
||||
d="M12.28 17.4L11 18.67a4.2 4.2 0 0 1-5.58.4 4 4 0 0 1-.27-5.93l1.42-1.43a1 1 0 0 0 0-1.42 1 1 0 0 0-1.42 0l-1.27 1.28a6.15 6.15 0 0 0-.67 8.07 6.06 6.06 0 0 0 9.07.6l1.42-1.42a1 1 0 0 0-1.42-1.42z"
|
||||
/>
|
||||
<path
|
||||
d="M19.66 3.22a6.18 6.18 0 0 0-8.13.68L10.45 5a1.09 1.09 0 0 0-.17 1.61 1 1 0 0 0 1.42 0L13 5.3a4.17 4.17 0 0 1 5.57-.4 4 4 0 0 1 .27 5.95l-1.42 1.43a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0l1.42-1.42a6.06 6.06 0 0 0-.6-9.06z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
|
|
@ -65,22 +59,14 @@
|
|||
matTooltip="공지사항"
|
||||
(click)="onClickNotice()"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="18"
|
||||
height="18"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
alt="공지사항"
|
||||
>
|
||||
<circle cx="12" cy="12" r="3"></circle>
|
||||
<path
|
||||
d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"
|
||||
></path>
|
||||
<svg class="svg-icon" viewBox="0 0 24 24" fill="currentColor">
|
||||
<path d="M22.13,8.91h-1.94V1.56c0-0.31-0.18-0.58-0.47-0.7c-0.28-0.12-0.61-0.05-0.82,0.16c-3.35,3.35-6.25,4.95-8.09,5.7
|
||||
C8.82,7.54,7.61,7.56,7.6,7.56H1.87c-0.42,0-0.76,0.34-0.76,0.76v6.76c0,0.42,0.34,0.76,0.76,0.76h0.77l2.86,6.9
|
||||
c0.12,0.28,0.39,0.47,0.7,0.47h4.19c0,0,0,0,0,0c0.42,0,0.76-0.34,0.76-0.76c0-0.12-0.03-0.23-0.08-0.33l-2.55-6.16
|
||||
c1.69,0.33,5.57,1.6,10.38,6.42c0.14,0.14,0.34,0.22,0.53,0.22c0,0,0.01,0,0.01,0c0.41-0.01,0.74-0.34,0.74-0.76
|
||||
c0-0.02,0-0.03,0-0.05l0-7.31h1.94c0.42,0,0.76-0.34,0.76-0.76V9.67C22.88,9.25,22.54,8.91,22.13,8.91z M2.63,9.07h4.22v5.25H2.63
|
||||
V9.07z M6.7,21.68l-2.35-5.67h2.55l2.35,5.67H6.7z M8.36,14.39V9c1.57-0.24,5.45-1.26,10.31-5.68v6.34v0v4.05c0,0,0,0,0,0l0,6.34
|
||||
C13.81,15.65,9.93,14.63,8.36,14.39z M21.37,12.97h-1.19v-2.54h1.19V12.97z" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
|
||||
.app-layout-native-title-bar-title {
|
||||
padding-left: 8px;
|
||||
font-size: 12px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.app-layout-native-title-bar-spacer {
|
||||
|
|
|
|||
|
|
@ -103,7 +103,7 @@ $aquaBlue-daesang: (
|
|||
A100: #84ffff,
|
||||
A200: #18ffff,
|
||||
A400: #00e5ff,
|
||||
A700: #00b8d4,
|
||||
A700: #06a6c1,
|
||||
B100: #2d3a4a,
|
||||
//,#47667fbackgroundcolor
|
||||
G100: #0367a6,
|
||||
|
|
|
|||
|
|
@ -1,5 +1,31 @@
|
|||
<mat-card class="example-card mat-elevation-z">
|
||||
<mat-card-header>
|
||||
<div class="profile-img">
|
||||
<div class="profile-img-mask">
|
||||
<img ucapImage [base]="profileImageRoot" [path]="userInfo.profileImageFile"
|
||||
[default]="'assets/images/img_nophoto_50.png'" />
|
||||
</div>
|
||||
<span class="work-status">
|
||||
{{ getWorkstatus(userInfo) }} 휴가중
|
||||
</span>
|
||||
|
||||
<mat-spinner *ngIf="
|
||||
profileImageFileUploadItem &&
|
||||
profileImageFileUploadItem.uploadingProgress$
|
||||
" mode="determinate" strokeWidth="5" diameter="84"
|
||||
[value]="profileImageFileUploadItem.uploadingProgress$ | async" class="upload-profile-image-spinner">1111</mat-spinner>
|
||||
|
||||
<button mat-mini-fab class="mat-elevation-z6 upload-profile-image-btn" *ngIf="isMe && editableProfileImage"
|
||||
matTooltip="프로필 이미지 변경" matTooltipPosition="above" [disabled]="
|
||||
profileImageFileUploadItem &&
|
||||
profileImageFileUploadItem.uploadingProgress$
|
||||
" (click)="profileImageFileInput.click()">
|
||||
<span class="mdi mdi-upload mdi-18px">2222</span>
|
||||
</button>
|
||||
<input type="file" #profileImageFileInput style="display: none" (change)="onChangeFileInput()" />
|
||||
|
||||
</div>
|
||||
|
||||
<mat-card-title>
|
||||
<span>{{ userInfo | ucapTranslate: 'name' }}</span>
|
||||
<span>{{ userInfo | ucapTranslate: 'grade' }}</span>
|
||||
|
|
@ -7,86 +33,22 @@
|
|||
<mat-card-subtitle>{{
|
||||
userInfo | ucapTranslate: 'deptName'
|
||||
}}</mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
|
||||
<mat-card-content>
|
||||
<div class="profile-img">
|
||||
<img
|
||||
ucapImage
|
||||
[base]="profileImageRoot"
|
||||
[path]="userInfo.profileImageFile"
|
||||
[default]="'assets/images/img_nophoto_50.png'"
|
||||
/>
|
||||
|
||||
<mat-spinner
|
||||
*ngIf="
|
||||
profileImageFileUploadItem &&
|
||||
profileImageFileUploadItem.uploadingProgress$
|
||||
"
|
||||
mode="determinate"
|
||||
strokeWidth="5"
|
||||
diameter="84"
|
||||
[value]="profileImageFileUploadItem.uploadingProgress$ | async"
|
||||
class="upload-profile-image-spinner"
|
||||
></mat-spinner>
|
||||
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z6 upload-profile-image-btn"
|
||||
*ngIf="isMe && editableProfileImage"
|
||||
matTooltip="프로필 이미지 변경"
|
||||
matTooltipPosition="above"
|
||||
[disabled]="
|
||||
profileImageFileUploadItem &&
|
||||
profileImageFileUploadItem.uploadingProgress$
|
||||
"
|
||||
(click)="profileImageFileInput.click()"
|
||||
>
|
||||
<span class="mdi mdi-upload mdi-18px"></span>
|
||||
</button>
|
||||
<input
|
||||
type="file"
|
||||
#profileImageFileInput
|
||||
style="display: none"
|
||||
(change)="onChangeFileInput()"
|
||||
/>
|
||||
</div>
|
||||
<div class="intro">{{ userInfo.intro }}가나다라라라마마마바사아자차카타파하가나다라마사아자차카타파하가나다라마사아자차카타파하가나다라마사아자차카타파하가나다라마사아자차카타파하</div>
|
||||
|
||||
<div *ngIf="!isMe" class="profile-option">
|
||||
<span *ngIf="isBuddy" class="btn-favorite" (click)="onToggleFavorit()">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
[ngClass]="[isFavorit ? 'on' : '']"
|
||||
>
|
||||
<polygon
|
||||
points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"
|
||||
></polygon>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round" [ngClass]="[isFavorit ? 'on' : '']">
|
||||
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2">
|
||||
</polygon>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="btn-groupadd">
|
||||
<ng-container [ngSwitch]="isBuddy">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
class="on"
|
||||
*ngSwitchCase="false"
|
||||
(click)="onClickAddBuddy()"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none"
|
||||
stroke="currentColor" stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round" class="on"
|
||||
*ngSwitchCase="false" (click)="onClickAddBuddy()">
|
||||
<!-- not buddy -->
|
||||
<path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
||||
<circle cx="8.5" cy="7" r="4"></circle>
|
||||
|
|
@ -94,20 +56,9 @@
|
|||
<line x1="23" y1="11" x2="17" y2="11"></line>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
class="on"
|
||||
*ngSwitchCase="true"
|
||||
(click)="onClickDelBuddy()"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none"
|
||||
stroke="currentColor" stroke-width="1.5" stroke-linecap="butt" stroke-linejoin="round" class="on"
|
||||
*ngSwitchCase="true" (click)="onClickDelBuddy()">
|
||||
<!-- is buddy -->
|
||||
<path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
||||
<circle cx="8.5" cy="7" r="4"></circle>
|
||||
|
|
@ -116,277 +67,102 @@
|
|||
</ng-container>
|
||||
</span>
|
||||
</div>
|
||||
<div *ngIf="isMe" class="profile-edit">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path d="M12.3 3.7l4 4L4 20H0v-4L12.3 3.7zm1.4-1.4L16 0l4 4-2.3 2.3-4-4z" /></svg>
|
||||
</div>
|
||||
</mat-card-header>
|
||||
|
||||
<ul style="padding-top: 20px;">
|
||||
<mat-card-content>
|
||||
<ul class="userInfo-list">
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"
|
||||
></path>
|
||||
</svg>
|
||||
<!-- <mat-form-field ucapInlineEditInput style="width: 100%;">
|
||||
<input matInput [formControl]="userIntroFormControl" />
|
||||
</mat-form-field> -->
|
||||
<!-- <ucap-inline-edit ([value])="(userInfo.intro)"></ucap-inline-edit> -->
|
||||
{{ userInfo.workplace }}
|
||||
<dt class="division">사업장</dt>
|
||||
<dd>{{ userInfo.workplace }}</dd>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"
|
||||
></path>
|
||||
</svg>
|
||||
<!-- <mat-form-field ucapInlineEditInput style="width: 100%;">
|
||||
<input matInput [formControl]="userIntroFormControl" />
|
||||
</mat-form-field> -->
|
||||
<!-- <ucap-inline-edit ([value])="(userInfo.intro)"></ucap-inline-edit> -->
|
||||
{{ userInfo.intro }}
|
||||
<dt class="division">담당업무</dt>
|
||||
<dd>{{ userInfo.responsibilities }}</dd>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"
|
||||
></path>
|
||||
<polyline points="22,6 12,13 2,6"></polyline>
|
||||
</svg>
|
||||
{{ userInfo.email }}
|
||||
<dt class="division">이메일</dt>
|
||||
<dd>{{ userInfo.email }}</dd>
|
||||
<li>
|
||||
<dt class="division">사무실</dt>
|
||||
<dd>{{ userInfo.lineNumber }}1234567890123456789012345678901234567890</dd>
|
||||
<button mat-mini-fab class="mat-elevation-z userInfo-call" *ngIf="!isMe" matTooltip="전화" matTooltipPosition="above"
|
||||
[disabled]="getDisabledBtn('LINE')" (click)="onClickCall('LINE')">
|
||||
<svg id="레이어_1" data-name="레이어 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path d="M18.61,16.55c-0.42,1.03-2.29,1.97-3.12,2.01c-0.83,0.04-0.85,0.64-5.37-1.32c-4.51-1.96-7.23-6.73-7.45-7.04
|
||||
C2.46,9.9,0.92,7.71,1,5.51c0.08-2.2,1.29-3.24,1.72-3.67c0.43-0.43,0.92-0.51,1.22-0.51c0.36-0.01,0.59-0.01,0.85,0
|
||||
c0.26,0.01,0.66-0.06,1,0.85c0.34,0.91,1.16,3.14,1.26,3.37c0.1,0.23,0.17,0.49,0.01,0.78C6.91,6.63,6.82,6.81,6.59,7.06
|
||||
c-0.24,0.25-0.5,0.57-0.71,0.76C5.65,8.04,5.4,8.27,5.65,8.73c0.25,0.46,1.1,1.96,2.39,3.19c1.66,1.59,3.1,2.11,3.54,2.35
|
||||
c0.44,0.24,0.71,0.21,0.98-0.07c0.27-0.29,1.18-1.26,1.49-1.7c0.32-0.44,0.62-0.35,1.02-0.19c0.41,0.16,2.58,1.33,3.03,1.57
|
||||
c0.44,0.24,0.74,0.36,0.84,0.55C19.05,14.62,19.02,15.52,18.61,16.55L18.61,16.55z" />
|
||||
</svg>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"
|
||||
></path>
|
||||
</svg>
|
||||
{{ userInfo.lineNumber }}
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<rect x="5" y="2" width="14" height="20" rx="2" ry="2"></rect>
|
||||
<line x1="12" y1="18" x2="12" y2="18"></line>
|
||||
</svg>
|
||||
{{ userInfo.hpNumber }}
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"
|
||||
></path>
|
||||
</svg>
|
||||
<!-- <mat-form-field ucapInlineEditInput style="width: 100%;">
|
||||
<input matInput [formControl]="userIntroFormControl" />
|
||||
</mat-form-field> -->
|
||||
<!-- <ucap-inline-edit ([value])="(userInfo.intro)"></ucap-inline-edit> -->
|
||||
{{ userInfo.responsibilities }}
|
||||
</li>
|
||||
<li>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="20"
|
||||
height="20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"
|
||||
></path>
|
||||
</svg>
|
||||
<!-- <mat-form-field ucapInlineEditInput style="width: 100%;">
|
||||
<input matInput [formControl]="userIntroFormControl" />
|
||||
</mat-form-field> -->
|
||||
<!-- <ucap-inline-edit ([value])="(userInfo.intro)"></ucap-inline-edit> -->
|
||||
{{ getWorkstatus(userInfo) }}
|
||||
<dt class="division">핸드폰</dt>
|
||||
<dd>{{ userInfo.hpNumber }}</dd>
|
||||
<button mat-mini-fab class="mat-elevation-z userInfo-call" *ngIf="!isMe" matTooltip="모바일" matTooltipPosition="above"
|
||||
[disabled]="getDisabledBtn('MOBILE')" (click)="onClickCall('MOBILE')">
|
||||
<svg id="레이어_1" data-name="레이어 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path d="M18.61,16.55c-0.42,1.03-2.29,1.97-3.12,2.01c-0.83,0.04-0.85,0.64-5.37-1.32c-4.51-1.96-7.23-6.73-7.45-7.04
|
||||
C2.46,9.9,0.92,7.71,1,5.51c0.08-2.2,1.29-3.24,1.72-3.67c0.43-0.43,0.92-0.51,1.22-0.51c0.36-0.01,0.59-0.01,0.85,0
|
||||
c0.26,0.01,0.66-0.06,1,0.85c0.34,0.91,1.16,3.14,1.26,3.37c0.1,0.23,0.17,0.49,0.01,0.78C6.91,6.63,6.82,6.81,6.59,7.06
|
||||
c-0.24,0.25-0.5,0.57-0.71,0.76C5.65,8.04,5.4,8.27,5.65,8.73c0.25,0.46,1.1,1.96,2.39,3.19c1.66,1.59,3.1,2.11,3.54,2.35
|
||||
c0.44,0.24,0.71,0.21,0.98-0.07c0.27-0.29,1.18-1.26,1.49-1.7c0.32-0.44,0.62-0.35,1.02-0.19c0.41,0.16,2.58,1.33,3.03,1.57
|
||||
c0.44,0.24,0.74,0.36,0.84,0.55C19.05,14.62,19.02,15.52,18.61,16.55L18.61,16.55z" />
|
||||
</svg>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<mat-card-actions>
|
||||
<div fxFlex fxLayout="row" fxLayoutAlign="space-around center">
|
||||
<div class="button-text-item">
|
||||
<button mat-mini-fab class="mat-elevation-z bg-accent-darkest" [matTooltip]="isMe ? 'MyTalk' : '1:1 대화'" matTooltipPosition="above"
|
||||
(click)="onClickOpenChat()">
|
||||
<svg id="레이어_1" data-name="레이어 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path d="M26.57,14a9.05,9.05,0,0,0-12.82,0,9.07,9.07,0,0,0-.57,12.2,3.57,3.57,0,0,1-1.46,1.61.84.84,0,0,0-.46.89.86.86,0,0,0,.71.71,4.34,4.34,0,0,0,.71.05,5.32,5.32,0,0,0,3.19-1.06A9.07,9.07,0,0,0,26.57,14Z" transform="translate(-11.09 -11.32)"/>
|
||||
<path d="M20.16,20.53a.14.14,0,0,1-.14-.14.14.14,0,0,1,.14-.14.14.14,0,0,1,.13.14A.13.13,0,0,1,20.16,20.53Z" transform="translate(-11.09 -11.32)"/><path class="cls-1" d="M20.16,19.75a.64.64,0,1,0,.64.64.64.64,0,0,0-.64-.64Z" transform="translate(-11.09 -11.32)"/>
|
||||
<circle cx="12.35" cy="9.07" r="0.14"/><path class="cls-1" d="M23.44,19.75a.64.64,0,1,0,.64.64.64.64,0,0,0-.64-.64Z" transform="translate(-11.09 -11.32)"/>
|
||||
<circle cx="5.78" cy="9.07" r="0.14"/><path class="cls-1" d="M16.88,19.75a.64.64,0,1,0,.63.64.64.64,0,0,0-.63-.64Z" transform="translate(-11.09 -11.32)"/>
|
||||
</svg>
|
||||
</button>
|
||||
<span *ngIf="!isMe" class="button-text" >대화</span>
|
||||
<span *ngIf="isMe" class="button-text">myTalk</span>
|
||||
</div>
|
||||
|
||||
<div class="button-text-item" *ngIf="!isMe">
|
||||
<button mat-mini-fab class="mat-elevation-z" *ngIf="!isMe" matTooltip="SMS" matTooltipPosition="above"
|
||||
[disabled]="getDisabledBtn('SMS')" (click)="onClickSMS()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path
|
||||
d="M2 2c0-1.1.9-2 2-2h12a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2zm2 0v14h12V2H4zm6 17a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
|
||||
</svg>
|
||||
</button>
|
||||
<span class="button-text">SMS</span>
|
||||
</div>
|
||||
|
||||
<div class="button-text-item" *ngIf="!isMe">
|
||||
<button mat-mini-fab class="mat-elevation-z bg-accent-darkest" *ngIf="!isMe" matTooltip="화상회의" matTooltipPosition="above"
|
||||
(click)="onClickVideoConference()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path d="M16 7l4-4v14l-4-4v3a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4c0-1.1.9-2 2-2h12a2 2 0 0 1 2 2v3zm-8 7a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0-2a2 2 0 1 1 0-4 2 2 0 0 1 0 4z"/></svg>
|
||||
</button>
|
||||
<span class="button-text">화상</span>
|
||||
</div>
|
||||
|
||||
<div class="button-text-item" *ngIf="!isMe">
|
||||
<button mat-mini-fab class="mat-elevation-z bg-accent-darkest" *ngIf="!isMe" matTooltip="쪽지" matTooltipPosition="above"
|
||||
(click)="onClickMessage()">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
|
||||
<path d="M0 0l20 10L0 20V0zm0 8v4l10-2L0 8z" /></svg>
|
||||
</button>
|
||||
<span class="button-text">쪽지</span>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-actions>
|
||||
</mat-card-content>
|
||||
|
||||
<mat-card-actions>
|
||||
<div fxFlex fxLayout="row" fxLayoutAlign="space-around center">
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z"
|
||||
[matTooltip]="isMe ? 'MyTalk' : '1:1 대화'"
|
||||
matTooltipPosition="above"
|
||||
(click)="onClickOpenChat()"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z"
|
||||
*ngIf="!isMe"
|
||||
matTooltip="전화"
|
||||
matTooltipPosition="above"
|
||||
[disabled]="getDisabledBtn('LINE')"
|
||||
(click)="onClickCall('LINE')"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"
|
||||
></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z"
|
||||
*ngIf="!isMe"
|
||||
matTooltip="모바일"
|
||||
matTooltipPosition="above"
|
||||
[disabled]="getDisabledBtn('MOBILE')"
|
||||
(click)="onClickCall('MOBILE')"
|
||||
>
|
||||
<span class="mdi mdi-cellphone-android mdi-24px"></span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z"
|
||||
*ngIf="!isMe"
|
||||
matTooltip="SMS"
|
||||
matTooltipPosition="above"
|
||||
[disabled]="getDisabledBtn('SMS')"
|
||||
(click)="onClickSMS()"
|
||||
>
|
||||
<span class="mdi mdi-email-outline mdi-24px"></span>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z"
|
||||
*ngIf="!isMe"
|
||||
matTooltip="화상회의"
|
||||
matTooltipPosition="above"
|
||||
(click)="onClickVideoConference()"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<path
|
||||
d="M15.6 11.6L22 7v10l-6.4-4.5v-1zM4 5h9a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V7c0-1.1.9-2 2-2z"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<button
|
||||
mat-mini-fab
|
||||
class="mat-elevation-z"
|
||||
*ngIf="!isMe"
|
||||
matTooltip="쪽지"
|
||||
matTooltipPosition="above"
|
||||
(click)="onClickMessage()"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="butt"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<line class="st0" x1="18" y1="2" x2="9.2" y2="10.8" />
|
||||
<polygon class="st0" points="18,2 12.4,18 9.2,10.8 2,7.6 " />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</mat-card-actions>
|
||||
</mat-card>
|
||||
|
|
|
|||
|
|
@ -13,53 +13,63 @@
|
|||
}
|
||||
}
|
||||
::ng-deep .mat-card-header-text {
|
||||
width: 100%;
|
||||
.mat-card-subtitle {
|
||||
color: rgb(256, 256, 256, 0.7) !important;
|
||||
text-align: center;
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.example-card {
|
||||
width: 400px;
|
||||
padding: 0 0 20px;
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
flex: 0 0 auto;
|
||||
width: 700px;
|
||||
height: 380px;
|
||||
position: relative;
|
||||
padding: 0;
|
||||
.mat-card-header {
|
||||
justify-content: center;
|
||||
padding-bottom: 40px;
|
||||
background: #76d9c5;
|
||||
/*background: linear-gradient(to right, #345385, #ef4c73);*/
|
||||
position: relative;
|
||||
justify-content: flex-start;
|
||||
flex-flow: column;
|
||||
width: 260px;
|
||||
height: 100%;
|
||||
background: #64cddf;
|
||||
color: #ffffff;
|
||||
padding-top: 20px;
|
||||
width: 100%;
|
||||
.mat-card-title {
|
||||
margin-bottom: 12px;
|
||||
max-width: 100%;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
margin: 0 20px;
|
||||
span {
|
||||
@include ellipsis(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.mat-card-content {
|
||||
margin-top: -40px;
|
||||
padding: 20px;
|
||||
|
||||
.profile-img {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
height: 80px;
|
||||
justify-content: center;
|
||||
flex-flow: row;
|
||||
align-items: flex-end;
|
||||
top: 20px;
|
||||
margin-bottom: 20px;
|
||||
img {
|
||||
widows: 80px;
|
||||
|
||||
&-mask {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 50%;
|
||||
background-color: #efefef;
|
||||
overflow: hidden;
|
||||
border: 2px solid #ffffff;
|
||||
margin-right: 10px;
|
||||
img {
|
||||
width: 80px;
|
||||
height: auto;
|
||||
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 {
|
||||
/*.upload-profile-image-spinner {
|
||||
position: absolute;
|
||||
top: 90px;
|
||||
left: 160px;
|
||||
|
|
@ -69,14 +79,27 @@
|
|||
position: absolute;
|
||||
top: 140px;
|
||||
left: 210px;
|
||||
}*/
|
||||
}
|
||||
.mat-card-title {
|
||||
display: flex;
|
||||
margin-top: 120px;
|
||||
span {
|
||||
@include ellipsis(1);
|
||||
}
|
||||
}
|
||||
.mat-card-subtitle {
|
||||
margin-left: -16px;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.intro {
|
||||
@include ellipsis(3);
|
||||
}
|
||||
.profile-option {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
display: flex;
|
||||
padding: 0 20px;
|
||||
color: #ffffff;
|
||||
margin-top: -100px;
|
||||
height: 120px;
|
||||
flex-flow: row;
|
||||
.btn-favorite {
|
||||
cursor: pointer;
|
||||
.on {
|
||||
|
|
@ -84,7 +107,7 @@
|
|||
}
|
||||
}
|
||||
.btn-groupadd {
|
||||
margin-left: auto;
|
||||
margin-left: 20px;
|
||||
cursor: pointer;
|
||||
svg {
|
||||
display: none;
|
||||
|
|
@ -94,23 +117,109 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.profile-edit {
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
svg {
|
||||
fill: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.mat-card-content {
|
||||
position: relative;
|
||||
width: 440px;
|
||||
height: 100%;
|
||||
padding: 20px 0;
|
||||
margin-left: 30px;
|
||||
ul {
|
||||
padding: 0 20px;
|
||||
display: flex;
|
||||
flex-flow: column;
|
||||
margin-top: -20px;
|
||||
li {
|
||||
display: inline-flex;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 30px;
|
||||
align-items: center;
|
||||
flex-flow: row;
|
||||
margin-bottom: 20px;
|
||||
|
||||
svg {
|
||||
dt {
|
||||
width: 100px;
|
||||
font-weight: 800;
|
||||
@include ellipsis(1);
|
||||
}
|
||||
dd {
|
||||
width: 260px;
|
||||
margin-right: 10px;
|
||||
color: #777777;
|
||||
@include ellipsis(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.mat-card-actions {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 0;
|
||||
border-top: 1px solid #dddddd;
|
||||
padding-top: 14px;
|
||||
margin-top: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::ng-deep .userInfo-call {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
justify-content: center;
|
||||
justify-items: center;
|
||||
.mat-button-wrapper {
|
||||
padding: 0;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
svg {
|
||||
fill: #ffffff;
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::ng-deep .button-text-item {
|
||||
display: flex;
|
||||
button {
|
||||
justify-content: center;
|
||||
justify-items: center;
|
||||
flex-flow: row;
|
||||
&.mat-mini-fab {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
.mat-button-wrapper {
|
||||
padding: 0;
|
||||
fill: #ffffff;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
display: inline-flex;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
svg {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.button-text {
|
||||
justify-content: center;
|
||||
align-self: center;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,14 +4,16 @@
|
|||
<span class="presence" [ngClass]="getPresence(PresenceType.PC)"> </span>
|
||||
<dl class="item-default">
|
||||
<dt>
|
||||
<img
|
||||
class="thumbnail"
|
||||
ucapImage
|
||||
[base]="profileImageRoot"
|
||||
[path]="userInfo.profileImageFile"
|
||||
[default]="'assets/images/img_nophoto_50.png'"
|
||||
(click)="onClickOpenProfile($event, userInfo)"
|
||||
/>
|
||||
<div class="thumbnail-mask">
|
||||
<img
|
||||
class="thumbnail"
|
||||
ucapImage
|
||||
[base]="profileImageRoot"
|
||||
[path]="userInfo.profileImageFile"
|
||||
[default]="'assets/images/img_nophoto_50.png'"
|
||||
(click)="onClickOpenProfile($event, userInfo)"
|
||||
/>
|
||||
</div>
|
||||
</dt>
|
||||
<dd class="info">
|
||||
<div class="detail">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ $font-dark: #212121;
|
|||
$font-mid: #666666;
|
||||
$font-light: #848d95;
|
||||
$font-white: #ffffff;
|
||||
$line-basic:1px solid #dddddd;
|
||||
$line-basic: 1px solid #dddddd;
|
||||
$bg-list-item-msg: #f0f4f6;
|
||||
$bg-list-hover: #efefef;
|
||||
$listH-row2: 80px;
|
||||
|
|
@ -61,23 +61,22 @@ $thumbnail-msize: 40px;
|
|||
.item-default {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
dt{
|
||||
flex:none;
|
||||
dt {
|
||||
flex: none;
|
||||
.thumbnail {
|
||||
width: $thumbnail-msize;
|
||||
height: $thumbnail-msize;
|
||||
height: auto;
|
||||
margin-right: 16px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.info{
|
||||
.info {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: calc(100% - 50px);
|
||||
.detail{
|
||||
.detail {
|
||||
flex-flow: column;
|
||||
.name {
|
||||
font-size: 13px;
|
||||
|
|
@ -122,15 +121,15 @@ $thumbnail-msize: 40px;
|
|||
width: 100%;
|
||||
}
|
||||
.msg-status {
|
||||
display:none;
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.org{
|
||||
.list-item{
|
||||
height:70px;
|
||||
.org {
|
||||
.list-item {
|
||||
height: 70px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
<div class="list-item" matRipple>
|
||||
<dl class="item-default">
|
||||
<dt>
|
||||
<img
|
||||
class="thumbnail"
|
||||
ucapImage
|
||||
[base]="sessionVerinfo.profileRoot"
|
||||
[path]="imagePath"
|
||||
[default]="defaultPath"
|
||||
/>
|
||||
<div class="thumbnail-mask">
|
||||
<img
|
||||
class="thumbnail"
|
||||
ucapImage
|
||||
[base]="sessionVerinfo.profileRoot"
|
||||
[path]="imagePath"
|
||||
[default]="defaultPath"
|
||||
/>
|
||||
</div>
|
||||
<span *ngIf="roomInfo.isTimeRoom" class="text-warn-color badge-timer">
|
||||
<mat-icon>timer</mat-icon>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -97,8 +97,6 @@ $thumbnail-msize: 40px;
|
|||
display: flex;
|
||||
width: 100%;
|
||||
.thumbnail {
|
||||
width: $thumbnail-msize;
|
||||
height: $thumbnail-msize;
|
||||
margin-right: 16px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,27 +1,44 @@
|
|||
@charset 'utf-8';
|
||||
|
||||
.ellipsis{
|
||||
.ellipsis {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
}
|
||||
.ellipsis2{
|
||||
.ellipsis2 {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.mat-card-header .mat-card-title{
|
||||
margin:0 -16px;
|
||||
padding-bottom:10px;
|
||||
.mat-card-header .mat-card-title {
|
||||
margin: 0 -16px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.search-result{
|
||||
.result-num{
|
||||
padding:10px;
|
||||
display:flex;
|
||||
height:40px;
|
||||
.search-result {
|
||||
.result-num {
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-item {
|
||||
.thumbnail {
|
||||
&-mask {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
margin-right: 16px;
|
||||
img {
|
||||
width: 40px;
|
||||
height: auto;
|
||||
background-color: #efefef;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user