added DM background color
This commit is contained in:
Nicolas Constant
parent
d1c0488460
commit
9e224efa88
|
|
@ -1,104 +1,106 @@
|
|||
<div class="reblog" *ngIf="reblog">
|
||||
<a class="reblog__profile-link" href (click)="openAccount(status.account)"
|
||||
(auxclick)="openUrl(status.account.url)"><span innerHTML="{{ status.account | accountEmoji }}"></span> <img
|
||||
*ngIf="reblog" class="reblog__avatar" src="{{ status.account.avatar }}" /></a> boosted
|
||||
</div>
|
||||
<div *ngIf="notificationType === 'favourite'">
|
||||
<div class="notification--icon">
|
||||
<fa-icon class="favorite" [icon]="faStar"></fa-icon>
|
||||
<div [class.direct-message]="isDirectMessage">
|
||||
<div class="reblog" *ngIf="reblog">
|
||||
<a class="reblog__profile-link" href (click)="openAccount(status.account)"
|
||||
(auxclick)="openUrl(status.account.url)"><span innerHTML="{{ status.account | accountEmoji }}"></span> <img
|
||||
*ngIf="reblog" class="reblog__avatar" src="{{ status.account.avatar }}" /></a> boosted
|
||||
</div>
|
||||
<div class="notification--label">
|
||||
<a href class="notification--link" (click)="openAccount(notificationAccount)"
|
||||
innerHTML="{{ notificationAccount | accountEmoji }}"></a> favorited your status
|
||||
<div *ngIf="notificationType === 'favourite'">
|
||||
<div class="notification--icon">
|
||||
<fa-icon class="favorite" [icon]="faStar"></fa-icon>
|
||||
</div>
|
||||
<div class="notification--label">
|
||||
<a href class="notification--link" (click)="openAccount(notificationAccount)"
|
||||
innerHTML="{{ notificationAccount | accountEmoji }}"></a> favorited your status
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="notificationType === 'reblog'">
|
||||
<div class="notification--icon">
|
||||
<fa-icon class="boost" [icon]="faRetweet"></fa-icon>
|
||||
<div *ngIf="notificationType === 'reblog'">
|
||||
<div class="notification--icon">
|
||||
<fa-icon class="boost" [icon]="faRetweet"></fa-icon>
|
||||
</div>
|
||||
<div class="notification--label">
|
||||
<a href class="notification--link" (click)="openAccount(notificationAccount)"
|
||||
innerHTML="{{ notificationAccount | accountEmoji }}"></a> boosted your status
|
||||
</div>
|
||||
</div>
|
||||
<div class="notification--label">
|
||||
<a href class="notification--link" (click)="openAccount(notificationAccount)"
|
||||
innerHTML="{{ notificationAccount | accountEmoji }}"></a> boosted your status
|
||||
<div *ngIf="notificationType === 'poll'">
|
||||
<div class="notification--icon">
|
||||
<fa-icon class="boost" [icon]="faList"></fa-icon>
|
||||
</div>
|
||||
<div class="notification--label">
|
||||
A poll you have voted in has ended
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="notificationType === 'poll'">
|
||||
<div class="notification--icon">
|
||||
<fa-icon class="boost" [icon]="faList"></fa-icon>
|
||||
</div>
|
||||
<div class="notification--label">
|
||||
A poll you have voted in has ended
|
||||
</div>
|
||||
</div>
|
||||
<div class="status">
|
||||
<a href class="status__navigation" title="open status" (click)="textSelected()">
|
||||
<div class="status">
|
||||
<a href class="status__navigation" title="open status" (click)="textSelected()">
|
||||
|
||||
</a>
|
||||
<div [ngClass]="{'notification--status': notificationAccount }">
|
||||
<a href class="status__profile-link" title="{{displayedStatus.account.acct}}"
|
||||
(click)="openAccount(displayedStatus.account)" (auxclick)="openUrl(displayedStatus.account.url)">
|
||||
<img [class.status__avatar--boosted]="reblog || notificationAccount" class="status__avatar"
|
||||
src="{{ displayedStatus.account.avatar }}" />
|
||||
<!-- <img *ngIf="reblog" class="status__avatar--reblog" src="{{ status.account.avatar }}" /> -->
|
||||
<img *ngIf="notificationAccount" class="notification--avatar" src="{{ notificationAccount.avatar }}" />
|
||||
<span class="status__name">
|
||||
<span class="status__name--displayname"
|
||||
innerHTML="{{displayedStatus.account | accountEmoji}}"></span><span
|
||||
class="status__name--username">{{displayedStatus.account.acct}}</span>
|
||||
</span>
|
||||
</a>
|
||||
<div class="status__created-at" title="{{ displayedStatus.created_at | date: 'full' }}">
|
||||
<a href class="status__created-at--link" (click)="textSelected()" (auxclick)="openUrl(displayedStatus.url)">
|
||||
{{ displayedStatus.created_at | timeAgo | async }}
|
||||
<div [ngClass]="{'notification--status': notificationAccount }">
|
||||
<a href class="status__profile-link" title="{{displayedStatus.account.acct}}"
|
||||
(click)="openAccount(displayedStatus.account)" (auxclick)="openUrl(displayedStatus.account.url)">
|
||||
<img [class.status__avatar--boosted]="reblog || notificationAccount" class="status__avatar"
|
||||
src="{{ displayedStatus.account.avatar }}" />
|
||||
<!-- <img *ngIf="reblog" class="status__avatar--reblog" src="{{ status.account.avatar }}" /> -->
|
||||
<img *ngIf="notificationAccount" class="notification--avatar" src="{{ notificationAccount.avatar }}" />
|
||||
<span class="status__name">
|
||||
<span class="status__name--displayname"
|
||||
innerHTML="{{displayedStatus.account | accountEmoji}}"></span><span
|
||||
class="status__name--username">{{displayedStatus.account.acct}}</span>
|
||||
</span>
|
||||
</a>
|
||||
<div class="status__created-at" title="{{ displayedStatus.created_at | date: 'full' }}">
|
||||
<a href class="status__created-at--link" (click)="textSelected()"
|
||||
(auxclick)="openUrl(displayedStatus.url)">
|
||||
{{ displayedStatus.created_at | timeAgo | async }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="status__labels">
|
||||
<div class="status__labels--label status__labels--bot" title="bot" *ngIf="displayedStatus.account.bot">
|
||||
bot
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--xpost" title="this status was cross-posted"
|
||||
*ngIf="isCrossPoster">
|
||||
x-post
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--thread" title="thread" *ngIf="isThread">
|
||||
thread
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--discuss" title="this status has a discussion"
|
||||
*ngIf="hasReply">
|
||||
replies
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--old" title="this status is old" *ngIf="isOld">
|
||||
old
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div #content class="status__content" innerHTML="{{displayedStatus.content}}"></div> -->
|
||||
|
||||
<a href class="status__content-warning" *ngIf="isContentWarned" title="show content"
|
||||
(click)="removeContentWarning()">
|
||||
<span class="status__content-warning--title">sensitive content</span>
|
||||
{{ contentWarningText }}
|
||||
</a>
|
||||
<app-databinded-text class="status__content" *ngIf="!isContentWarned" [text]="statusContent"
|
||||
(accountSelected)="accountSelected($event)" (hashtagSelected)="hashtagSelected($event)"
|
||||
(textSelected)="textSelected()"></app-databinded-text>
|
||||
|
||||
<app-poll class="status__poll" *ngIf="!isContentWarned && displayedStatus.poll"
|
||||
[poll]="displayedStatus.poll" [statusWrapper]="displayedStatusWrapper"></app-poll>
|
||||
|
||||
<app-card class="status__card" *ngIf="!isContentWarned && displayedStatus.card && !hasAttachments"
|
||||
[card]="displayedStatus.card"></app-card>
|
||||
|
||||
<app-attachements *ngIf="!isContentWarned && hasAttachments" class="attachments"
|
||||
[attachments]="displayedStatus.media_attachments">
|
||||
</app-attachements>
|
||||
|
||||
<app-action-bar #appActionBar [statusWrapper]="displayedStatusWrapper"
|
||||
(browseThreadEvent)="browseThread($event)" (cwIsActiveEvent)="changeCw($event)"
|
||||
(replyEvent)="openReply()"></app-action-bar>
|
||||
</div>
|
||||
<div class="status__labels">
|
||||
<div class="status__labels--label status__labels--bot" title="bot" *ngIf="displayedStatus.account.bot">
|
||||
bot
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--xpost" title="this status was cross-posted"
|
||||
*ngIf="isCrossPoster">
|
||||
x-post
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--thread" title="thread" *ngIf="isThread">
|
||||
thread
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--discuss" title="this status has a discussion"
|
||||
*ngIf="hasReply">
|
||||
replies
|
||||
</div>
|
||||
<div class="status__labels--label status__labels--old" title="this status is old" *ngIf="isOld">
|
||||
old
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div #content class="status__content" innerHTML="{{displayedStatus.content}}"></div> -->
|
||||
|
||||
<a href class="status__content-warning" *ngIf="isContentWarned" title="show content"
|
||||
(click)="removeContentWarning()">
|
||||
<span class="status__content-warning--title">sensitive content</span>
|
||||
{{ contentWarningText }}
|
||||
</a>
|
||||
<app-databinded-text class="status__content" *ngIf="!isContentWarned" [text]="statusContent"
|
||||
(accountSelected)="accountSelected($event)" (hashtagSelected)="hashtagSelected($event)"
|
||||
(textSelected)="textSelected()"></app-databinded-text>
|
||||
|
||||
<app-poll class="status__poll" *ngIf="!isContentWarned && displayedStatus.poll" [poll]="displayedStatus.poll"
|
||||
[statusWrapper]="displayedStatusWrapper"></app-poll>
|
||||
|
||||
<app-card class="status__card" *ngIf="!isContentWarned && displayedStatus.card && !hasAttachments"
|
||||
[card]="displayedStatus.card"></app-card>
|
||||
|
||||
<app-attachements *ngIf="!isContentWarned && hasAttachments" class="attachments"
|
||||
[attachments]="displayedStatus.media_attachments">
|
||||
</app-attachements>
|
||||
|
||||
<app-action-bar #appActionBar [statusWrapper]="displayedStatusWrapper"
|
||||
(browseThreadEvent)="browseThread($event)"
|
||||
(cwIsActiveEvent)="changeCw($event)"
|
||||
(replyEvent)="openReply()"></app-action-bar>
|
||||
<app-create-status *ngIf="replyingToStatus" [statusReplyingToWrapper]="displayedStatusWrapper"
|
||||
(onClose)="closeReply()">
|
||||
</app-create-status>
|
||||
</div>
|
||||
<app-create-status *ngIf="replyingToStatus" [statusReplyingToWrapper]="displayedStatusWrapper"
|
||||
(onClose)="closeReply()">
|
||||
</app-create-status>
|
||||
</div>
|
||||
|
|
@ -24,6 +24,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.direct-message {
|
||||
background-color: $direct-message-background;
|
||||
}
|
||||
|
||||
.status {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@ export class StatusComponent implements OnInit {
|
|||
isContentWarned: boolean;
|
||||
hasReply: boolean;
|
||||
contentWarningText: string;
|
||||
isDirectMessage: boolean;
|
||||
|
||||
@Output() browseAccountEvent = new EventEmitter<string>();
|
||||
@Output() browseHashtagEvent = new EventEmitter<string>();
|
||||
|
|
@ -61,6 +62,7 @@ export class StatusComponent implements OnInit {
|
|||
this.displayedStatus = this.status;
|
||||
}
|
||||
|
||||
this.isDirectMessage = this.displayedStatus.visibility === 'direct';
|
||||
this.displayedStatusWrapper = new StatusWrapper(this.displayedStatus, value.provider);
|
||||
|
||||
this.checkLabels(this.displayedStatus);
|
||||
|
|
|
|||
|
|
@ -54,11 +54,9 @@ $column-background: #0f111a;
|
|||
|
||||
$card-border-color: #1e2435;
|
||||
|
||||
$context-menu-background: #090b10;
|
||||
$context-menu-background: #d9e1e8;
|
||||
$context-menu-background-hover: #16171d;
|
||||
$context-menu-background-hover: #a9c9e6;
|
||||
$context-menu-font-color: #4e5572;
|
||||
$context-menu-font-color: #000000;
|
||||
$context-menu-border-color: #4e5572;
|
||||
$context-menu-border-color: #c0cdd9;
|
||||
$context-menu-border-color: #c0cdd9;
|
||||
|
||||
$direct-message-background: #090a0f;
|
||||
Loading…
Reference in New Issue