diff options
4 files changed, 25 insertions, 7 deletions
diff --git a/client/src/app/account/account-videos/account-videos.component.html b/client/src/app/account/account-videos/account-videos.component.html index f73483039..0755158b9 100644 --- a/client/src/app/account/account-videos/account-videos.component.html +++ b/client/src/app/account/account-videos/account-videos.component.html | |||
@@ -1,3 +1,5 @@ | |||
1 | <div *ngIf="pagination.totalItems === 0">No results.</div> | ||
2 | |||
1 | <div | 3 | <div |
2 | class="videos" | 4 | class="videos" |
3 | infiniteScroll | 5 | infiniteScroll |
diff --git a/client/src/app/shared/video/abstract-video-list.html b/client/src/app/shared/video/abstract-video-list.html index 5761f2c81..60a2563b3 100644 --- a/client/src/app/shared/video/abstract-video-list.html +++ b/client/src/app/shared/video/abstract-video-list.html | |||
@@ -3,6 +3,8 @@ | |||
3 | {{ titlePage }} | 3 | {{ titlePage }} |
4 | </div> | 4 | </div> |
5 | 5 | ||
6 | <div *ngIf="pagination.totalItems === 0">No results.</div> | ||
7 | |||
6 | <div | 8 | <div |
7 | class="videos" | 9 | class="videos" |
8 | infiniteScroll | 10 | infiniteScroll |
diff --git a/client/src/app/videos/+video-watch/video-watch.component.html b/client/src/app/videos/+video-watch/video-watch.component.html index d9b572430..860edecd2 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.html +++ b/client/src/app/videos/+video-watch/video-watch.component.html | |||
@@ -13,12 +13,16 @@ | |||
13 | <div class="video-info-name">{{ video.name }}</div> | 13 | <div class="video-info-name">{{ video.name }}</div> |
14 | 14 | ||
15 | <div class="video-info-actions"> | 15 | <div class="video-info-actions"> |
16 | <div *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'like' }" class="action-button"> | 16 | <div |
17 | <span class="icon icon-like" title="Like this video" (click)="setLike()"></span> | 17 | *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'like' }" (click)="setLike()" |
18 | class="action-button action-button-like"> | ||
19 | <span class="icon icon-like" title="Like this video" ></span> | ||
18 | </div> | 20 | </div> |
19 | 21 | ||
20 | <div *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'dislike' }" class="action-button"> | 22 | <div |
21 | <span class="icon icon-dislike" title="Dislike this video" (click)="setDislike()"></span> | 23 | *ngIf="isUserLoggedIn()" [ngClass]="{ 'activated': userRating === 'dislike' }" (click)="setDislike()" |
24 | class="action-button action-button-dislike"> | ||
25 | <span class="icon icon-dislike" title="Dislike this video"></span> | ||
22 | </div> | 26 | </div> |
23 | 27 | ||
24 | <div (click)="showShareModal()" class="action-button"> | 28 | <div (click)="showShareModal()" class="action-button"> |
diff --git a/client/src/app/videos/+video-watch/video-watch.component.scss b/client/src/app/videos/+video-watch/video-watch.component.scss index 205a4333c..02b44bda1 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss | |||
@@ -51,6 +51,12 @@ | |||
51 | 51 | ||
52 | .video-info-actions { | 52 | .video-info-actions { |
53 | min-width: 215px; | 53 | min-width: 215px; |
54 | display: flex; | ||
55 | justify-content: end; | ||
56 | |||
57 | .action-button:not(:first-child), .action-more { | ||
58 | margin-left: 10px; | ||
59 | } | ||
54 | 60 | ||
55 | .action-button { | 61 | .action-button { |
56 | @include peertube-button; | 62 | @include peertube-button; |
@@ -85,12 +91,16 @@ | |||
85 | } | 91 | } |
86 | } | 92 | } |
87 | 93 | ||
88 | &.activated { | 94 | &.action-button-like.activated { |
89 | @include orange-button; | 95 | background-color: #39CC0B; |
90 | 96 | ||
91 | .icon-like { | 97 | .icon-like { |
92 | background-image: url('../../../assets/images/video/like-white.svg'); | 98 | background-image: url('../../../assets/images/video/like-white.svg'); |
93 | } | 99 | } |
100 | } | ||
101 | |||
102 | &.action-button-dislike.activated { | ||
103 | background-color: #FF0000; | ||
94 | 104 | ||
95 | .icon-dislike { | 105 | .icon-dislike { |
96 | background-image: url('../../../assets/images/video/dislike-white.svg'); | 106 | background-image: url('../../../assets/images/video/dislike-white.svg'); |
@@ -222,7 +232,7 @@ | |||
222 | } | 232 | } |
223 | 233 | ||
224 | 234 | ||
225 | @media screen and (max-width: 1200px) { | 235 | @media screen and (max-width: 1300px) { |
226 | .other-videos { | 236 | .other-videos { |
227 | display: none; | 237 | display: none; |
228 | } | 238 | } |