Improve mobile vote and activity placement

master
trivernis 5 years ago
parent ecb3d924ed
commit c094071922

@ -35,12 +35,12 @@
<mat-icon class="voteButton voted" aria-hidden="false" color="primary" *ngIf="post.userVote == 'UPVOTE'">thumb_up</mat-icon>
<mat-icon class="voteButton" aria-hidden="false" *ngIf="!post.userVote || post.userVote == 'DOWNVOTE'">thumb_up</mat-icon>
</button>
{{post.upvotes}}
<div class="voteCount">{{post.upvotes}}</div>
<button mat-button (click)="voteDown(post)" matTooltip="vote down" matTooltipShowDelay="500">
<mat-icon class="voteButton voted" aria-hidden="false" color="primary" *ngIf="post.userVote == 'DOWNVOTE'">thumb_down</mat-icon>
<mat-icon class="voteButton" aria-hidden="false" *ngIf="!post.userVote || post.userVote == 'UPVOTE'">thumb_down</mat-icon>
</button>
{{post.downvotes}}
<div class="voteCount">{{post.downvotes}}</div>
</div>
<div *ngIf="post.activity" class="activity-info" fxHide.lt-md="true">
<span class="span" [matTooltip]="post.activity.description" matTooltipShowDelay="200">

@ -78,22 +78,28 @@ $mat-card-header-size: 40px !default
&.voted
scale: 0.9
.voteCount
display: inline
@media (max-width: 959px)
.activity-info > .span
margin-left: 1em
width: calc(100% - 1em)
display: block
text-align: left
font-style: italic
.postVoteButtons
text-align: end
margin-right: 0.5em
display: flex
align-items: center
.voteButton
scale: 1
&.voted
scale: 1.1
.mat-card-actions
text-align: end
display: flex
justify-content: end
align-items: center

Loading…
Cancel
Save