Make the sort/results bar less ugly

[github/Chocobozzz/PeerTube.git] / client / angular / videos / components / list / videos-list.component.html

diff --git a/client/angular/videos/components/list/videos-list.component.html b/client/angular/videos/components/list/videos-list.component.html
index 9e51675dde10faebc86da697b38d07735f65b3fa..3e30b39b0ad286fa3b33f33699a0454b98c0aace 100644 (file)
--- a/client/angular/videos/components/list/videos-list.component.html
+++ b/client/angular/videos/components/list/videos-list.component.html
@@ -1,12 +1,16 @@
-<div *ngIf="videos.length === 0">There is no video.</div>
-<div *ngFor="#video of videos" class="video">
-  <div>
-    <a [routerLink]="['VideosWatch', { id: video.id }]" class="video_name">{{ video.name }}</a>
-    <span class="video_pod_url">{{ video.podUrl }}</span>
-    <span *ngIf="video.isLocal === true && user && video.author === user.username" (click)="removeVideo(video.id)" class="video_remove glyphicon glyphicon-remove"></span>
-  </div>
+<div class="row videos-info">
+  <div class="col-md-9 videos-total-results"> {{ pagination.total }} videos</div>
+  <my-video-sort class="col-md-3" [currentSort]="sort" (sort)="onSort($event)"></my-video-sort>
+</div>
+
+<div class="videos-miniatures">
+  <div *ngIf="videos.length === 0">There is no video.</div>
 
-  <div class="video_description">
-    {{ video.description }}
-  </div>
+  <my-video-miniature *ngFor="let video of videos" [video]="video" [user]="user" (removed)="onRemoved(video)">
+  </my-video-miniature>
 </div>
+
+<pagination
+  [totalItems]="pagination.total" [itemsPerPage]="pagination.itemsPerPage" [(ngModel)]="pagination.currentPage"
+  (ngModelChange)="getVideos()"
+></pagination>