From b2731bff2834fb6aacf166cf435030bf96eb12f3 Mon Sep 17 00:00:00 2001
From: Chocobozzz <me@florianbigard.com>
Date: Tue, 12 Dec 2017 14:41:59 +0100
Subject: Small style fixes

---
 .../account/account-videos/account-videos.component.html  |  2 +-
 .../account/account-videos/account-videos.component.scss  | 10 +++++++++-
 .../account/account-videos/account-videos.component.ts    |  2 ++
 client/src/app/menu/menu.component.html                   |  4 ++++
 client/src/app/shared/video/abstract-video-list.ts        | 12 +++++++++---
 .../app/videos/+video-watch/video-watch.component.scss    | 15 ++++++++++-----
 .../src/app/videos/+video-watch/video-watch.component.ts  |  8 ++++++--
 .../videos/video-list/video-recently-added.component.ts   |  2 ++
 .../src/app/videos/video-list/video-search.component.ts   |  2 ++
 .../src/app/videos/video-list/video-trending.component.ts |  2 ++
 client/src/sass/video-js-custom.scss                      |  1 +
 11 files changed, 48 insertions(+), 12 deletions(-)

(limited to 'client/src')

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 f69c0487d..4f3a774bd 100644
--- a/client/src/app/account/account-videos/account-videos.component.html
+++ b/client/src/app/account/account-videos/account-videos.component.html
@@ -12,7 +12,7 @@
     <my-video-thumbnail [video]="video"></my-video-thumbnail>
 
     <div class="video-info">
-      <div class="video-info-name">{{ video.name }}</div>
+      <a class="video-info-name" [routerLink]="['/videos/watch', video.uuid]" [attr.title]="video.name">{{ video.name }}</a>
       <span class="video-info-date-views">{{ video.createdAt | myFromNow }} - {{ video.views | myNumberFormatter }} views</span>
     </div>
 
diff --git a/client/src/app/account/account-videos/account-videos.component.scss b/client/src/app/account/account-videos/account-videos.component.scss
index 28b298c3d..0d478edd7 100644
--- a/client/src/app/account/account-videos/account-videos.component.scss
+++ b/client/src/app/account/account-videos/account-videos.component.scss
@@ -43,7 +43,7 @@
 
 .video {
   display: flex;
-  height: 130px;
+  min-height: 130px;
   padding-bottom: 20px;
 
   input[type=checkbox] {
@@ -68,6 +68,10 @@
     flex-grow: 1;
 
     .video-info-name {
+      @include disable-default-a-behaviour;
+
+      color: #000;
+      display: block;
       font-size: 16px;
       font-weight: $font-semibold;
     }
@@ -76,6 +80,10 @@
       font-size: 13px;
     }
   }
+
+  .video-buttons {
+    min-width: 190px;
+  }
 }
 
 @media screen and (max-width: 800px) {
diff --git a/client/src/app/account/account-videos/account-videos.component.ts b/client/src/app/account/account-videos/account-videos.component.ts
index 5f12cfce0..22941619d 100644
--- a/client/src/app/account/account-videos/account-videos.component.ts
+++ b/client/src/app/account/account-videos/account-videos.component.ts
@@ -4,6 +4,7 @@ import { NotificationsService } from 'angular2-notifications'
 import 'rxjs/add/observable/from'
 import 'rxjs/add/operator/concatAll'
 import { Observable } from 'rxjs/Observable'
+import { AuthService } from '../../core/auth'
 import { ConfirmService } from '../../core/confirm'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { Video } from '../../shared/video/video.model'
@@ -21,6 +22,7 @@ export class AccountVideosComponent extends AbstractVideoList implements OnInit
 
   constructor (protected router: Router,
                protected route: ActivatedRoute,
+               protected authService: AuthService,
                protected notificationsService: NotificationsService,
                protected confirmService: ConfirmService,
                private videoService: VideoService) {
diff --git a/client/src/app/menu/menu.component.html b/client/src/app/menu/menu.component.html
index 2671dd90b..6f52f4f45 100644
--- a/client/src/app/menu/menu.component.html
+++ b/client/src/app/menu/menu.component.html
@@ -12,6 +12,10 @@
 
       <ul *dropdownMenu class="dropdown-menu">
         <li>
+          <a routerLink="/account/settings" class="dropdown-item" title="My account">
+            My account
+          </a>
+
           <a (click)="logout($event)" class="dropdown-item" title="Log out" href="#">
             Log out
           </a>
diff --git a/client/src/app/shared/video/abstract-video-list.ts b/client/src/app/shared/video/abstract-video-list.ts
index ba1635a18..2b6870a78 100644
--- a/client/src/app/shared/video/abstract-video-list.ts
+++ b/client/src/app/shared/video/abstract-video-list.ts
@@ -2,6 +2,7 @@ import { OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
 import { Observable } from 'rxjs/Observable'
+import { AuthService } from '../../core/auth'
 import { SortField } from './sort-field.type'
 import { VideoPagination } from './video-pagination.model'
 import { Video } from './video.model'
@@ -17,9 +18,10 @@ export abstract class AbstractVideoList implements OnInit {
   videos: Video[] = []
   loadOnInit = true
 
-  protected notificationsService: NotificationsService
-  protected router: Router
-  protected route: ActivatedRoute
+  protected abstract notificationsService: NotificationsService
+  protected abstract authService: AuthService
+  protected abstract router: Router
+  protected abstract route: ActivatedRoute
 
   protected abstract currentRoute: string
 
@@ -28,6 +30,10 @@ export abstract class AbstractVideoList implements OnInit {
 
   abstract getVideosObservable (): Observable<{ videos: Video[], totalVideos: number}>
 
+  get user () {
+    return this.authService.getUser()
+  }
+
   ngOnInit () {
     // Subscribe to route changes
     const routeParams = this.route.snapshot.params
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 52082944a..e742e1329 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.scss
+++ b/client/src/app/videos/+video-watch/video-watch.component.scss
@@ -43,12 +43,15 @@
       align-items: center;
 
       .video-info-name {
+        margin-right: 30px;
         font-size: 27px;
         font-weight: $font-semibold;
         flex-grow: 1;
       }
 
       .video-info-actions {
+        min-width: 215px;
+
         .action-button {
           @include peertube-button;
           @include grey-button;
@@ -219,16 +222,12 @@
 }
 
 
-@media screen and (max-width: 1000px) {
+@media screen and (max-width: 1200px) {
   .other-videos {
     display: none;
   }
-}
 
-@media screen and (max-width: 800px) {
   .video-bottom {
-    margin: 20px 0 0 0;
-
     .video-info {
       margin-right: 0;
 
@@ -250,3 +249,9 @@
     }
   }
 }
+
+@media screen and (max-width: 800px) {
+  .video-bottom {
+    margin: 20px 0 0 0;
+  }
+}
diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts
index 3825e8449..5e4823c9c 100644
--- a/client/src/app/videos/+video-watch/video-watch.component.ts
+++ b/client/src/app/videos/+video-watch/video-watch.component.ts
@@ -60,6 +60,10 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     private markdownService: MarkdownService
   ) {}
 
+  get user () {
+    return this.authService.getUser()
+  }
+
   ngOnInit () {
     this.videoService.getVideos({ currentPage: 1, itemsPerPage: 5 }, '-createdAt')
       .subscribe(
@@ -204,7 +208,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
   }
 
   isVideoBlacklistable () {
-    return this.video.isBlackistableBy(this.authService.getUser())
+    return this.video.isBlackistableBy(this.user)
   }
 
   getAvatarPath () {
@@ -264,7 +268,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
     this.video = video
 
     let observable
-    if (this.video.isVideoNSFWForUser(this.authService.getUser())) {
+    if (this.video.isVideoNSFWForUser(this.user)) {
       observable = this.confirmService.confirm(
         'This video contains mature or explicit content. Are you sure you want to watch it?',
         'Mature or explicit content'
diff --git a/client/src/app/videos/video-list/video-recently-added.component.ts b/client/src/app/videos/video-list/video-recently-added.component.ts
index 6168fac95..3020b8c30 100644
--- a/client/src/app/videos/video-list/video-recently-added.component.ts
+++ b/client/src/app/videos/video-list/video-recently-added.component.ts
@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
+import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { SortField } from '../../shared/video/sort-field.type'
 import { VideoService } from '../../shared/video/video.service'
@@ -18,6 +19,7 @@ export class VideoRecentlyAddedComponent extends AbstractVideoList implements On
   constructor (protected router: Router,
                protected route: ActivatedRoute,
                protected notificationsService: NotificationsService,
+               protected authService: AuthService,
                private videoService: VideoService) {
     super()
   }
diff --git a/client/src/app/videos/video-list/video-search.component.ts b/client/src/app/videos/video-list/video-search.component.ts
index e874636af..b7556c13e 100644
--- a/client/src/app/videos/video-list/video-search.component.ts
+++ b/client/src/app/videos/video-list/video-search.component.ts
@@ -2,6 +2,7 @@ import { Component, OnDestroy, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
 import { Subscription } from 'rxjs/Subscription'
+import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { VideoService } from '../../shared/video/video.service'
 
@@ -21,6 +22,7 @@ export class VideoSearchComponent extends AbstractVideoList implements OnInit, O
   constructor (protected router: Router,
                protected route: ActivatedRoute,
                protected notificationsService: NotificationsService,
+               protected authService: AuthService,
                private videoService: VideoService) {
     super()
   }
diff --git a/client/src/app/videos/video-list/video-trending.component.ts b/client/src/app/videos/video-list/video-trending.component.ts
index 82567e02d..fc48086d6 100644
--- a/client/src/app/videos/video-list/video-trending.component.ts
+++ b/client/src/app/videos/video-list/video-trending.component.ts
@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core'
 import { ActivatedRoute, Router } from '@angular/router'
 import { NotificationsService } from 'angular2-notifications'
+import { AuthService } from '../../core/auth'
 import { AbstractVideoList } from '../../shared/video/abstract-video-list'
 import { SortField } from '../../shared/video/sort-field.type'
 import { VideoService } from '../../shared/video/video.service'
@@ -18,6 +19,7 @@ export class VideoTrendingComponent extends AbstractVideoList implements OnInit
   constructor (protected router: Router,
                protected route: ActivatedRoute,
                protected notificationsService: NotificationsService,
+               protected authService: AuthService,
                private videoService: VideoService) {
     super()
   }
diff --git a/client/src/sass/video-js-custom.scss b/client/src/sass/video-js-custom.scss
index 1c5701bea..25362c5af 100644
--- a/client/src/sass/video-js-custom.scss
+++ b/client/src/sass/video-js-custom.scss
@@ -322,6 +322,7 @@ $control-bar-height: 34px;
   border-left-color: #ffffff;
   transform: translateZ(0);
   animation: spinner 1.4s infinite linear;
+  overflow: hidden;
 
   &:before {
     animation: none !important;
-- 
cgit v1.2.3