ucap/next-ucap-messenger
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

쪽지 -view(프로필 이미지 삭제)

Browse Source
This commit is contained in:
khk 2020-01-14 14:36:23 +09:00
parent c3296091cb
commit 3698f9176b
2 changed files with 56 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
View File

@ -26,6 +26,7 @@
fxLayoutAlign=" stretch" fxLayoutAlign=" stretch"
class="message-info" class="message-info"
> >
<!-- 쪽지 발/수신 프로필 이미지
<div class="profile"> <div class="profile">
<span class="profile-img-mask"> <span class="profile-img-mask">
<img /> <img />
@ -70,6 +71,8 @@
</span> </span>
<span class="name">{{ getSendReceiverNames() }}</span> <span class="name">{{ getSendReceiverNames() }}</span>
</div> </div>
-->
<div class="title text-accent-darkest"> <div class="title text-accent-darkest">
{{ messageInfo.title }} {{ messageInfo.title }}
<span class="btn-menu "> <span class="btn-menu ">
@ -84,10 +87,23 @@
</button> </button>
</span> </span>
</div> </div>
<div class="people">
<span
*ngIf="messageInfo.type === MessageType.Receive"
class="people label bg-accent-color"
>발신자</span
>
<span
*ngIf="messageInfo.type !== MessageType.Receive"
class="people label bg-accent-color bg-warn-color"
>수신자</span
>
<span class="name">{{ getSendReceiverNames() }}</span>
</div>
<div class="date"> <div class="date">
<span <span
*ngIf="messageInfo.type === MessageType.Receive" *ngIf="messageInfo.type === MessageType.Receive"
class="label bg-warn-color " class="label bg-accent-color"
>{{ 'message.receivedTime' | translate }}</span >{{ 'message.receivedTime' | translate }}</span
> >
<span <span
@ -237,11 +253,7 @@
</mat-card-actions> --> </mat-card-actions> -->
</mat-card> </mat-card>
<mat-menu <mat-menu #messageMenu="matMenu" xPosition="after" yPosition="below">
#messageMenu="matMenu"
xPosition="after"
yPosition="below"
>
<button <button
mat-menu-item mat-menu-item
*ngIf="messageInfo.type === MessageType.Send" *ngIf="messageInfo.type === MessageType.Send"

36
projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss
View File

@ -20,6 +20,7 @@
.contents { .contents {
height: 380px; height: 380px;
.message-contents { .message-contents {
padding: 10px 0;
pre { pre {
word-wrap: break-word; word-wrap: break-word;
white-space: pre-wrap; white-space: pre-wrap;
@ -38,7 +39,7 @@
::ng-deep .message-container { ::ng-deep .message-container {
background-color: #ffffff !important; background-color: #ffffff !important;
.message-info { .message-info {
.profile { /*.profile {
display: flex; display: flex;
flex-flow: row; flex-flow: row;
align-items: center; align-items: center;
@ -75,7 +76,7 @@
font-size: 16px; font-size: 16px;
margin-left: 20px; margin-left: 20px;
} }
} }*/
.title { .title {
display: flex; display: flex;
flex-flow: row; flex-flow: row;
@ -85,25 +86,48 @@
padding: 10px 0 6px; padding: 10px 0 6px;
line-height: 24px; line-height: 24px;
color: #222222; color: #222222;
border-bottom: 1px solid #dddddd;
.btn-menu { .btn-menu {
margin-left: auto; margin-left: auto;
color: #333333; color: #333333;
} }
} }
.date { .people {
font-size: 13px;
display: flex; display: flex;
flex-flow: row; flex-flow: row;
align-items: center; align-items: center;
padding-top: 10px;
padding-bottom: 14px; padding-bottom: 14px;
font-size: 1em;
.label { .label {
display: inline-flex;
flex: 0 0 auto;
border-radius: 14px; border-radius: 14px;
padding: 2px 10px; padding: 2px 10px;
margin-right: 10px; margin-right: 10px;
font-size: 12px;
color: #ffffff; color: #ffffff;
line-height: 20px; line-height: 20px;
width: 100px;
justify-content: center;
}
.name {
display: inline-flex;
flex: 1 1 auto;
}
}
.date {
border-bottom: 1px solid #dddddd;
padding-bottom: 10px;
font-size: 1em;
.label {
display: inline-block;
border-radius: 14px;
padding: 2px 10px;
margin-right: 10px;
color: #ffffff;
line-height: 20px;
width: 100px;
text-align: center;
} }
} }
.ps { .ps {