aboutsummaryrefslogtreecommitdiffhomepage
diff options
context:
space:
mode:
Diffstat
-rw-r--r--client/src/app/+admin/users/shared/user.service.ts14
-rw-r--r--client/src/app/account/account-change-password/account-change-password.component.html24
-rw-r--r--client/src/app/account/account-details/account-details.component.html16
-rw-r--r--client/src/app/account/account-routing.module.ts28
-rw-r--r--client/src/app/account/account-settings/account-change-password/account-change-password.component.html18
-rw-r--r--client/src/app/account/account-settings/account-change-password/account-change-password.component.scss9
-rw-r--r--client/src/app/account/account-settings/account-change-password/account-change-password.component.ts (renamed from client/src/app/account/account-change-password/account-change-password.component.ts)9
-rw-r--r--client/src/app/account/account-settings/account-change-password/index.ts (renamed from client/src/app/account/account-change-password/index.ts)0
-rw-r--r--client/src/app/account/account-settings/account-details/account-details.component.html14
-rw-r--r--client/src/app/account/account-settings/account-details/account-details.component.scss11
-rw-r--r--client/src/app/account/account-settings/account-details/account-details.component.ts (renamed from client/src/app/account/account-details/account-details.component.ts)19
-rw-r--r--client/src/app/account/account-settings/account-details/index.ts (renamed from client/src/app/account/account-details/index.ts)0
-rw-r--r--client/src/app/account/account-settings/account-settings.component.html9
-rw-r--r--client/src/app/account/account-settings/account-settings.component.scss13
-rw-r--r--client/src/app/account/account-settings/account-settings.component.ts18
-rw-r--r--client/src/app/account/account.component.html26
-rw-r--r--client/src/app/account/account.component.scss3
-rw-r--r--client/src/app/account/account.component.ts24
-rw-r--r--client/src/app/account/account.module.ts9
-rw-r--r--client/src/app/app.component.scss8
-rw-r--r--client/src/app/menu/menu.component.html2
-rw-r--r--client/src/app/menu/menu.component.scss29
-rw-r--r--client/src/app/shared/search/search.component.scss22
-rw-r--r--client/src/app/videos/video-list/index.ts1
-rw-r--r--client/src/app/videos/video-list/my-videos.component.ts36
-rw-r--r--client/src/app/videos/video-list/shared/abstract-video-list.html31
-rw-r--r--client/src/app/videos/video-list/shared/abstract-video-list.scss23
-rw-r--r--client/src/app/videos/video-list/shared/abstract-video-list.ts4
-rw-r--r--client/src/app/videos/videos-routing.module.ts10
-rw-r--r--client/src/app/videos/videos.module.ts3
-rw-r--r--client/src/sass/_mixins.scss35
-rw-r--r--client/src/sass/_variables.scss2
-rw-r--r--client/src/sass/application.scss44
-rw-r--r--client/src/sass/pre-customizations.scss1
34 files changed, 261 insertions, 254 deletions
diff --git a/client/src/app/+admin/users/shared/user.service.ts b/client/src/app/+admin/users/shared/user.service.ts
index e4bd5df37..dc77cc1d8 100644
--- a/client/src/app/+admin/users/shared/user.service.ts
+++ b/client/src/app/+admin/users/shared/user.service.ts
@@ -1,14 +1,12 @@
1import { Injectable } from '@angular/core'
2import { HttpClient, HttpParams } from '@angular/common/http' 1import { HttpClient, HttpParams } from '@angular/common/http'
3import { Observable } from 'rxjs/Observable' 2import { Injectable } from '@angular/core'
3import { BytesPipe } from 'ngx-pipes'
4import { SortMeta } from 'primeng/components/common/sortmeta'
4import 'rxjs/add/operator/catch' 5import 'rxjs/add/operator/catch'
5import 'rxjs/add/operator/map' 6import 'rxjs/add/operator/map'
6 7import { Observable } from 'rxjs/Observable'
7import { SortMeta } from 'primeng/components/common/sortmeta' 8import { ResultList, UserCreate, UserUpdate } from '../../../../../../shared'
8import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe' 9import { RestExtractor, RestPagination, RestService, User } from '../../../shared'
9
10import { RestExtractor, User, RestPagination, RestService } from '../../../shared'
11import { UserCreate, UserUpdate, ResultList } from '../../../../../../shared'
12 10
13@Injectable() 11@Injectable()
14export class UserService { 12export class UserService {
diff --git a/client/src/app/account/account-change-password/account-change-password.component.html b/client/src/app/account/account-change-password/account-change-password.component.html
deleted file mode 100644
index 92d9f900a..000000000
--- a/client/src/app/account/account-change-password/account-change-password.component.html
+++ /dev/null
@@ -1,24 +0,0 @@
1<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
2
3<form role="form" (ngSubmit)="changePassword()" [formGroup]="form">
4 <div class="form-group">
5 <label for="new-password">New password</label>
6 <input
7 type="password" class="form-control" id="new-password"
8 formControlName="new-password"
9 >
10 <div *ngIf="formErrors['new-password']" class="alert alert-danger">
11 {{ formErrors['new-password'] }}
12 </div>
13 </div>
14
15 <div class="form-group">
16 <label for="name">Confirm new password</label>
17 <input
18 type="password" class="form-control" id="new-confirmed-password"
19 formControlName="new-confirmed-password"
20 >
21 </div>
22
23 <input type="submit" value="Change password" class="btn btn-default" [disabled]="!form.valid">
24</form>
diff --git a/client/src/app/account/account-details/account-details.component.html b/client/src/app/account/account-details/account-details.component.html
deleted file mode 100644
index 8f4f176af..000000000
--- a/client/src/app/account/account-details/account-details.component.html
+++ /dev/null
@@ -1,16 +0,0 @@
1<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
2
3<form role="form" (ngSubmit)="updateDetails()" [formGroup]="form">
4 <div class="form-group">
5 <input
6 type="checkbox" id="displayNSFW"
7 formControlName="displayNSFW"
8 >
9 <label for="displayNSFW">Display videos that contain mature or explicit content</label>
10 <div *ngIf="formErrors['displayNSFW']" class="alert alert-danger">
11 {{ formErrors['displayNSFW'] }}
12 </div>
13 </div>
14
15 <input type="submit" value="Update" class="btn btn-default" [disabled]="!form.valid">
16</form>
diff --git a/client/src/app/account/account-routing.module.ts b/client/src/app/account/account-routing.module.ts
index 74d9aa03e..2e9de1cfb 100644
--- a/client/src/app/account/account-routing.module.ts
+++ b/client/src/app/account/account-routing.module.ts
@@ -5,17 +5,33 @@ import { MetaGuard } from '@ngx-meta/core'
5 5
6import { LoginGuard } from '../core' 6import { LoginGuard } from '../core'
7import { AccountComponent } from './account.component' 7import { AccountComponent } from './account.component'
8import { AccountSettingsComponent } from './account-settings/account-settings.component'
8 9
9const accountRoutes: Routes = [ 10const accountRoutes: Routes = [
10 { 11 {
11 path: 'account', 12 path: 'account',
12 component: AccountComponent, 13 component: AccountComponent,
13 canActivate: [ MetaGuard, LoginGuard ], 14 canActivateChild: [ MetaGuard, LoginGuard ],
14 data: { 15 children: [
15 meta: { 16 {
16 title: 'My account' 17 path: 'settings',
17 } 18 component: AccountSettingsComponent,
18 } 19 data: {
20 meta: {
21 title: 'Account settings'
22 }
23 }
24 },
25 // {
26 // path: 'videos',
27 // component: AccountVideosComponent,
28 // data: {
29 // meta: {
30 // title: 'Account videos'
31 // }
32 // }
33 // }
34 ]
19 } 35 }
20] 36]
21 37
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.html b/client/src/app/account/account-settings/account-change-password/account-change-password.component.html
new file mode 100644
index 000000000..bfb55218f
--- /dev/null
+++ b/client/src/app/account/account-settings/account-change-password/account-change-password.component.html
@@ -0,0 +1,18 @@
1<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
2
3<form role="form" (ngSubmit)="changePassword()" [formGroup]="form">
4 <input
5 type="password" class="form-control" id="new-password" placeholder="Old password"
6 formControlName="new-password"
7 >
8 <div *ngIf="formErrors['new-password']" class="alert alert-danger">
9 {{ formErrors['new-password'] }}
10 </div>
11
12 <input
13 type="password" id="new-confirmed-password" placeholder="New password"
14 formControlName="new-confirmed-password"
15 >
16
17 <input type="submit" value="Change password" [disabled]="!form.valid">
18</form>
diff --git a/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss b/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss
new file mode 100644
index 000000000..593355b70
--- /dev/null
+++ b/client/src/app/account/account-settings/account-change-password/account-change-password.component.scss
@@ -0,0 +1,9 @@
1input[type=password] {
2 @include peertube-input-text(340px);
3 display: block;
4 margin-bottom: 10px;
5}
6
7input[type=submit] {
8 @include peertube-button;
9}
diff --git a/client/src/app/account/account-change-password/account-change-password.component.ts b/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts
index 69edec54b..8979e1734 100644
--- a/client/src/app/account/account-change-password/account-change-password.component.ts
+++ b/client/src/app/account/account-settings/account-change-password/account-change-password.component.ts
@@ -1,16 +1,13 @@
1import { Component, OnInit } from '@angular/core' 1import { Component, OnInit } from '@angular/core'
2import { FormBuilder, FormGroup } from '@angular/forms' 2import { FormBuilder, FormGroup } from '@angular/forms'
3import { Router } from '@angular/router'
4
5import { NotificationsService } from 'angular2-notifications' 3import { NotificationsService } from 'angular2-notifications'
6 4import { FormReactive, USER_PASSWORD, UserService } from '../../../shared'
7import { FormReactive, UserService, USER_PASSWORD } from '../../shared'
8 5
9@Component({ 6@Component({
10 selector: 'my-account-change-password', 7 selector: 'my-account-change-password',
11 templateUrl: './account-change-password.component.html' 8 templateUrl: './account-change-password.component.html',
9 styleUrls: [ './account-change-password.component.scss' ]
12}) 10})
13
14export class AccountChangePasswordComponent extends FormReactive implements OnInit { 11export class AccountChangePasswordComponent extends FormReactive implements OnInit {
15 error: string = null 12 error: string = null
16 13
diff --git a/client/src/app/account/account-change-password/index.ts b/client/src/app/account/account-settings/account-change-password/index.ts
index 44c330b66..44c330b66 100644
--- a/client/src/app/account/account-change-password/index.ts
+++ b/client/src/app/account/account-settings/account-change-password/index.ts
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.html b/client/src/app/account/account-settings/account-details/account-details.component.html
new file mode 100644
index 000000000..c3cf6b629
--- /dev/null
+++ b/client/src/app/account/account-settings/account-details/account-details.component.html
@@ -0,0 +1,14 @@
1<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
2
3<form role="form" (ngSubmit)="updateDetails()" [formGroup]="form">
4 <input
5 type="checkbox" id="displayNSFW"
6 formControlName="displayNSFW"
7 >
8 <label for="displayNSFW">Display videos that contain mature or explicit content</label>
9 <div *ngIf="formErrors['displayNSFW']" class="alert alert-danger">
10 {{ formErrors['displayNSFW'] }}
11 </div>
12
13 <input type="submit" value="Update" [disabled]="!form.valid">
14</form>
diff --git a/client/src/app/account/account-settings/account-details/account-details.component.scss b/client/src/app/account/account-settings/account-details/account-details.component.scss
new file mode 100644
index 000000000..b1810d4f9
--- /dev/null
+++ b/client/src/app/account/account-settings/account-details/account-details.component.scss
@@ -0,0 +1,11 @@
1label {
2 font-size: 15px;
3 font-weight: $font-regular;
4 margin-left: 5px;
5}
6
7input[type=submit] {
8 @include peertube-button;
9
10 display: block;
11}
diff --git a/client/src/app/account/account-details/account-details.component.ts b/client/src/app/account/account-settings/account-details/account-details.component.ts
index d7a6e6871..d835c53e5 100644
--- a/client/src/app/account/account-details/account-details.component.ts
+++ b/client/src/app/account/account-settings/account-details/account-details.component.ts
@@ -1,21 +1,14 @@
1import { Component, OnInit, Input } from '@angular/core' 1import { Component, Input, OnInit } from '@angular/core'
2import { FormBuilder, FormGroup } from '@angular/forms' 2import { FormBuilder, FormGroup } from '@angular/forms'
3import { Router } from '@angular/router'
4
5import { NotificationsService } from 'angular2-notifications' 3import { NotificationsService } from 'angular2-notifications'
6 4import { UserUpdateMe } from '../../../../../../shared'
7import { AuthService } from '../../core' 5import { AuthService } from '../../../core'
8import { 6import { FormReactive, User, UserService } from '../../../shared'
9 FormReactive,
10 User,
11 UserService,
12 USER_PASSWORD
13} from '../../shared'
14import { UserUpdateMe } from '../../../../../shared'
15 7
16@Component({ 8@Component({
17 selector: 'my-account-details', 9 selector: 'my-account-details',
18 templateUrl: './account-details.component.html' 10 templateUrl: './account-details.component.html',
11 styleUrls: [ './account-details.component.scss' ]
19}) 12})
20 13
21export class AccountDetailsComponent extends FormReactive implements OnInit { 14export class AccountDetailsComponent extends FormReactive implements OnInit {
diff --git a/client/src/app/account/account-details/index.ts b/client/src/app/account/account-settings/account-details/index.ts
index 4829f608a..4829f608a 100644
--- a/client/src/app/account/account-details/index.ts
+++ b/client/src/app/account/account-settings/account-details/index.ts
diff --git a/client/src/app/account/account-settings/account-settings.component.html b/client/src/app/account/account-settings/account-settings.component.html
new file mode 100644
index 000000000..2509eb5aa
--- /dev/null
+++ b/client/src/app/account/account-settings/account-settings.component.html
@@ -0,0 +1,9 @@
1<div class="user-info">
2 {{ user.username }}
3</div>
4
5<div class="account-title">Account settings</div>
6<my-account-change-password></my-account-change-password>
7
8<div class="account-title">Filtering</div>
9<my-account-details [user]="user"></my-account-details>
diff --git a/client/src/app/account/account-settings/account-settings.component.scss b/client/src/app/account/account-settings/account-settings.component.scss
new file mode 100644
index 000000000..a0822631d
--- /dev/null
+++ b/client/src/app/account/account-settings/account-settings.component.scss
@@ -0,0 +1,13 @@
1.user-info {
2 font-size: 20px;
3 font-weight: $font-bold;
4}
5
6.account-title {
7 text-transform: uppercase;
8 color: $orange-color;
9 font-weight: $font-bold;
10 font-size: 13px;
11 margin-top: 55px;
12 margin-bottom: 30px;
13}
diff --git a/client/src/app/account/account-settings/account-settings.component.ts b/client/src/app/account/account-settings/account-settings.component.ts
new file mode 100644
index 000000000..c3b670e02
--- /dev/null
+++ b/client/src/app/account/account-settings/account-settings.component.ts
@@ -0,0 +1,18 @@
1import { Component, OnInit } from '@angular/core'
2import { User } from '../../shared'
3import { AuthService } from '../../core'
4
5@Component({
6 selector: 'my-account-settings',
7 templateUrl: './account-settings.component.html',
8 styleUrls: [ './account-settings.component.scss' ]
9})
10export class AccountSettingsComponent implements OnInit {
11 user: User = null
12
13 constructor (private authService: AuthService) {}
14
15 ngOnInit () {
16 this.user = this.authService.getUser()
17 }
18}
diff --git a/client/src/app/account/account.component.html b/client/src/app/account/account.component.html
index 177e54999..d82a4ca4d 100644
--- a/client/src/app/account/account.component.html
+++ b/client/src/app/account/account.component.html
@@ -1,25 +1,11 @@
1<div class="row"> 1<div class="row">
2 <div class="content-padding"> 2 <div class="sub-menu">
3 <h3>Account</h3> 3 <a routerLink="/account/settings" routerLinkActive="active" class="title-page">My account</a>
4 4
5 <div class="col-md-6 col-sm-12"> 5 <a routerLink="/account/videos" routerLinkActive="active" class="title-page">My videos</a>
6 <div class="panel panel-default"> 6 </div>
7 <div class="panel-heading">Change password</div>
8
9 <div class="panel-body">
10 <my-account-change-password></my-account-change-password>
11 </div>
12 </div>
13 </div>
14
15 <div class="col-md-6 col-sm-12">
16 <div class="panel panel-default">
17 <div class="panel-heading">Update my informations</div>
18 7
19 <div class="panel-body"> 8 <div class="margin-content">
20 <my-account-details [user]="user"></my-account-details> 9 <router-outlet></router-outlet>
21 </div>
22 </div>
23 </div>
24 </div> 10 </div>
25</div> 11</div>
diff --git a/client/src/app/account/account.component.scss b/client/src/app/account/account.component.scss
index 61b80d0a7..e69de29bb 100644
--- a/client/src/app/account/account.component.scss
+++ b/client/src/app/account/account.component.scss
@@ -1,3 +0,0 @@
1.panel {
2 margin-top: 40px;
3}
diff --git a/client/src/app/account/account.component.ts b/client/src/app/account/account.component.ts
index 929934f67..3d3677ab0 100644
--- a/client/src/app/account/account.component.ts
+++ b/client/src/app/account/account.component.ts
@@ -1,28 +1,8 @@
1import { Component, OnInit } from '@angular/core' 1import { Component } from '@angular/core'
2import { FormBuilder, FormGroup } from '@angular/forms'
3import { Router } from '@angular/router'
4
5import { NotificationsService } from 'angular2-notifications'
6
7import { AuthService } from '../core'
8import {
9 FormReactive,
10 User,
11 UserService,
12 USER_PASSWORD
13} from '../shared'
14 2
15@Component({ 3@Component({
16 selector: 'my-account', 4 selector: 'my-account',
17 templateUrl: './account.component.html', 5 templateUrl: './account.component.html',
18 styleUrls: [ './account.component.scss' ] 6 styleUrls: [ './account.component.scss' ]
19}) 7})
20export class AccountComponent implements OnInit { 8export class AccountComponent {}
21 user: User = null
22
23 constructor (private authService: AuthService) {}
24
25 ngOnInit () {
26 this.user = this.authService.getUser()
27 }
28}
diff --git a/client/src/app/account/account.module.ts b/client/src/app/account/account.module.ts
index 380e9d235..ff444ddeb 100644
--- a/client/src/app/account/account.module.ts
+++ b/client/src/app/account/account.module.ts
@@ -1,11 +1,11 @@
1import { NgModule } from '@angular/core' 1import { NgModule } from '@angular/core'
2 2import { SharedModule } from '../shared'
3import { AccountRoutingModule } from './account-routing.module' 3import { AccountRoutingModule } from './account-routing.module'
4import { AccountChangePasswordComponent } from './account-settings/account-change-password/account-change-password.component'
5import { AccountDetailsComponent } from './account-settings/account-details/account-details.component'
6import { AccountSettingsComponent } from './account-settings/account-settings.component'
4import { AccountComponent } from './account.component' 7import { AccountComponent } from './account.component'
5import { AccountChangePasswordComponent } from './account-change-password'
6import { AccountDetailsComponent } from './account-details'
7import { AccountService } from './account.service' 8import { AccountService } from './account.service'
8import { SharedModule } from '../shared'
9 9
10@NgModule({ 10@NgModule({
11 imports: [ 11 imports: [
@@ -15,6 +15,7 @@ import { SharedModule } from '../shared'
15 15
16 declarations: [ 16 declarations: [
17 AccountComponent, 17 AccountComponent,
18 AccountSettingsComponent,
18 AccountChangePasswordComponent, 19 AccountChangePasswordComponent,
19 AccountDetailsComponent 20 AccountDetailsComponent
20 ], 21 ],
diff --git a/client/src/app/app.component.scss b/client/src/app/app.component.scss
index f245d0563..1baffa5c8 100644
--- a/client/src/app/app.component.scss
+++ b/client/src/app/app.component.scss
@@ -2,14 +2,6 @@
2 min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin}); 2 min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin});
3} 3}
4 4
5.main-col {
6 margin-left: $menu-width;
7
8 &.expanded {
9 margin-left: 0;
10 }
11}
12
13.sub-header-container { 5.sub-header-container {
14 margin-top: $header-height; 6 margin-top: $header-height;
15} 7}
diff --git a/client/src/app/menu/menu.component.html b/client/src/app/menu/menu.component.html
index 21f8d8ba4..0ed8ec518 100644
--- a/client/src/app/menu/menu.component.html
+++ b/client/src/app/menu/menu.component.html
@@ -1,7 +1,7 @@
1<menu> 1<menu>
2 <div *ngIf="isLoggedIn" class="logged-in-block"> 2 <div *ngIf="isLoggedIn" class="logged-in-block">
3 <div class="logged-in-info"> 3 <div class="logged-in-info">
4 <div class="logged-in-username">{{ user.username }}</div> 4 <a routerLink="/account/settings" class="logged-in-username">{{ user.username }}</a>
5 <div class="logged-in-email">{{ user.email }}</div> 5 <div class="logged-in-email">{{ user.email }}</div>
6 </div> 6 </div>
7 7
diff --git a/client/src/app/menu/menu.component.scss b/client/src/app/menu/menu.component.scss
index 2c2106733..9d67ca66c 100644
--- a/client/src/app/menu/menu.component.scss
+++ b/client/src/app/menu/menu.component.scss
@@ -28,6 +28,10 @@ menu {
28 .logged-in-username { 28 .logged-in-username {
29 font-size: 16px; 29 font-size: 16px;
30 font-weight: $font-semibold; 30 font-weight: $font-semibold;
31 color: $menu-color;
32 cursor: pointer;
33
34 @include disable-default-a-behaviour;
31 } 35 }
32 36
33 .logged-in-email { 37 .logged-in-email {
@@ -57,6 +61,12 @@ menu {
57 width: 190px; 61 width: 190px;
58 border-radius: 3px; 62 border-radius: 3px;
59 text-align: center; 63 text-align: center;
64 color: $menu-color;
65 display: block;
66 cursor: pointer;
67 margin-bottom: 15px;
68
69 @include disable-default-a-behaviour;
60 70
61 &.login-button { 71 &.login-button {
62 background-color: $orange-color; 72 background-color: $orange-color;
@@ -82,6 +92,13 @@ menu {
82 92
83 a { 93 a {
84 display: flex; 94 display: flex;
95 color: $menu-color;
96 cursor: pointer;
97 height: 22px;
98 line-height: 22px;
99 font-size: 16px;
100 margin-bottom: 15px;
101 @include disable-default-a-behaviour;
85 102
86 .icon { 103 .icon {
87 width: 22px; 104 width: 22px;
@@ -113,16 +130,4 @@ menu {
113 } 130 }
114 } 131 }
115 } 132 }
116
117 a {
118 color: $menu-color;
119 height: 22px;
120 line-height: 22px;
121 display: block;
122 font-size: 16px;
123 cursor: pointer;
124 margin-bottom: 15px;
125
126 @include disable-default-a-behaviour;
127 }
128} 133}
diff --git a/client/src/app/shared/search/search.component.scss b/client/src/app/shared/search/search.component.scss
index ffd891904..191d3d597 100644
--- a/client/src/app/shared/search/search.component.scss
+++ b/client/src/app/shared/search/search.component.scss
@@ -1,13 +1,7 @@
1#search-video { 1#search-video {
2 display: inline-block; 2 @include peertube-input-text($search-input-width);
3 height: $button-height;
4 width: $search-input-width;
5 margin-right: 15px; 3 margin-right: 15px;
6 padding-right: 25px; // For the search icon 4 padding-right: 25px; // For the search icon
7 background: #fff;
8 border: 1px solid #C6C6C6;
9 border-radius: 3px;
10 padding-left: 15px;
11 5
12 &::placeholder { 6 &::placeholder {
13 color: #000; 7 color: #000;
@@ -29,19 +23,9 @@
29} 23}
30 24
31.upload-button { 25.upload-button {
32 display: inline-block; 26 @include peertube-button-link;
33 color: #fff;
34 font-weight: $font-semibold;
35 font-size: 15px;
36 height: $button-height;
37 line-height: $button-height;
38 border-radius: 3px;
39 text-align: center;
40 margin-right: 25px;
41 background-color: $orange-color;
42 padding: 0 17px 0 13px;
43 27
44 @include disable-default-a-behaviour; 28 margin-right: 25px;
45 29
46 .icon.icon-upload { 30 .icon.icon-upload {
47 display: inline-block; 31 display: inline-block;
diff --git a/client/src/app/videos/video-list/index.ts b/client/src/app/videos/video-list/index.ts
index a5a60364a..594e31984 100644
--- a/client/src/app/videos/video-list/index.ts
+++ b/client/src/app/videos/video-list/index.ts
@@ -1,4 +1,3 @@
1export * from './my-videos.component'
2export * from './video-recently-added.component' 1export * from './video-recently-added.component'
3export * from './video-trending.component' 2export * from './video-trending.component'
4export * from './shared' 3export * from './shared'
diff --git a/client/src/app/videos/video-list/my-videos.component.ts b/client/src/app/videos/video-list/my-videos.component.ts
deleted file mode 100644
index 146db8262..000000000
--- a/client/src/app/videos/video-list/my-videos.component.ts
+++ /dev/null
@@ -1,36 +0,0 @@
1import { Component, OnDestroy, OnInit } from '@angular/core'
2import { ActivatedRoute, Router } from '@angular/router'
3
4import { NotificationsService } from 'angular2-notifications'
5
6import { AbstractVideoList } from './shared'
7import { VideoService } from '../shared'
8
9@Component({
10 selector: 'my-videos',
11 styleUrls: [ './shared/abstract-video-list.scss' ],
12 templateUrl: './shared/abstract-video-list.html'
13})
14export class MyVideosComponent extends AbstractVideoList implements OnInit, OnDestroy {
15
16 constructor (
17 protected router: Router,
18 protected route: ActivatedRoute,
19 protected notificationsService: NotificationsService,
20 private videoService: VideoService
21 ) {
22 super()
23 }
24
25 ngOnInit () {
26 super.ngOnInit()
27 }
28
29 ngOnDestroy () {
30 super.ngOnDestroy()
31 }
32
33 getVideosObservable () {
34 return this.videoService.getMyVideos(this.pagination, this.sort)
35 }
36}
diff --git a/client/src/app/videos/video-list/shared/abstract-video-list.html b/client/src/app/videos/video-list/shared/abstract-video-list.html
index 69e16319e..bd4f6b1f8 100644
--- a/client/src/app/videos/video-list/shared/abstract-video-list.html
+++ b/client/src/app/videos/video-list/shared/abstract-video-list.html
@@ -1,18 +1,19 @@
1<div class="title-page"> 1<div class="margin-content">
2 {{ titlePage }} 2 <div class="title-page title-page-single">
3</div> 3 {{ titlePage }}
4 </div>
4 5
5<div 6 <div
6 class="videos-miniatures" 7 infiniteScroll
7 infiniteScroll 8 [infiniteScrollUpDistance]="1.5"
8 [infiniteScrollUpDistance]="1.5" 9 [infiniteScrollDistance]="0.5"
9 [infiniteScrollDistance]="0.5" 10 (scrolled)="onNearOfBottom()"
10 (scrolled)="onNearOfBottom()" 11 (scrolledUp)="onNearOfTop()"
11 (scrolledUp)="onNearOfTop()"
12>
13 <my-video-miniature
14 class="ng-animate"
15 *ngFor="let video of videos" [video]="video" [user]="user" [currentSort]="sort"
16 > 12 >
17 </my-video-miniature> 13 <my-video-miniature
14 class="ng-animate"
15 *ngFor="let video of videos" [video]="video" [user]="user" [currentSort]="sort"
16 >
17 </my-video-miniature>
18 </div>
18</div> 19</div>
diff --git a/client/src/app/videos/video-list/shared/abstract-video-list.scss b/client/src/app/videos/video-list/shared/abstract-video-list.scss
index de174802b..e69de29bb 100644
--- a/client/src/app/videos/video-list/shared/abstract-video-list.scss
+++ b/client/src/app/videos/video-list/shared/abstract-video-list.scss
@@ -1,23 +0,0 @@
1.videos-info {
2 @media screen and (max-width: 400px) {
3 margin-left: 0;
4 }
5
6 border-bottom: 1px solid #f1f1f1;
7 height: 40px;
8 line-height: 40px;
9
10 .videos-total-results {
11 font-size: 13px;
12 }
13
14 my-loader {
15 display: inline-block;
16 margin-left: 5px;
17 }
18}
19
20pagination {
21 display: block;
22 text-align: center;
23}
diff --git a/client/src/app/videos/video-list/shared/abstract-video-list.ts b/client/src/app/videos/video-list/shared/abstract-video-list.ts
index 44cdc1d9f..a684ffef4 100644
--- a/client/src/app/videos/video-list/shared/abstract-video-list.ts
+++ b/client/src/app/videos/video-list/shared/abstract-video-list.ts
@@ -36,7 +36,9 @@ export abstract class AbstractVideoList implements OnInit, OnDestroy {
36 } 36 }
37 37
38 ngOnDestroy () { 38 ngOnDestroy () {
39 this.subActivatedRoute.unsubscribe() 39 if (this.subActivatedRoute) {
40 this.subActivatedRoute.unsubscribe()
41 }
40 } 42 }
41 43
42 onNearOfTop () { 44 onNearOfTop () {
diff --git a/client/src/app/videos/videos-routing.module.ts b/client/src/app/videos/videos-routing.module.ts
index 1f894df7a..204851c81 100644
--- a/client/src/app/videos/videos-routing.module.ts
+++ b/client/src/app/videos/videos-routing.module.ts
@@ -1,7 +1,6 @@
1import { NgModule } from '@angular/core' 1import { NgModule } from '@angular/core'
2import { RouterModule, Routes } from '@angular/router' 2import { RouterModule, Routes } from '@angular/router'
3import { MetaGuard } from '@ngx-meta/core' 3import { MetaGuard } from '@ngx-meta/core'
4import { MyVideosComponent } from './video-list'
5import { VideoRecentlyAddedComponent } from './video-list/video-recently-added.component' 4import { VideoRecentlyAddedComponent } from './video-list/video-recently-added.component'
6import { VideoTrendingComponent } from './video-list/video-trending.component' 5import { VideoTrendingComponent } from './video-list/video-trending.component'
7import { VideosComponent } from './videos.component' 6import { VideosComponent } from './videos.component'
@@ -18,15 +17,6 @@ const videosRoutes: Routes = [
18 redirectTo: 'recently-added' 17 redirectTo: 'recently-added'
19 }, 18 },
20 { 19 {
21 path: 'mine',
22 component: MyVideosComponent,
23 data: {
24 meta: {
25 title: 'My videos'
26 }
27 }
28 },
29 {
30 path: 'trending', 20 path: 'trending',
31 component: VideoTrendingComponent, 21 component: VideoTrendingComponent,
32 data: { 22 data: {
diff --git a/client/src/app/videos/videos.module.ts b/client/src/app/videos/videos.module.ts
index f3981d275..1d6194158 100644
--- a/client/src/app/videos/videos.module.ts
+++ b/client/src/app/videos/videos.module.ts
@@ -2,7 +2,7 @@ import { NgModule } from '@angular/core'
2import { InfiniteScrollModule } from 'ngx-infinite-scroll' 2import { InfiniteScrollModule } from 'ngx-infinite-scroll'
3import { SharedModule } from '../shared' 3import { SharedModule } from '../shared'
4import { VideoService } from './shared' 4import { VideoService } from './shared'
5import { MyVideosComponent, VideoMiniatureComponent } from './video-list' 5import { VideoMiniatureComponent } from './video-list'
6import { VideoRecentlyAddedComponent } from './video-list/video-recently-added.component' 6import { VideoRecentlyAddedComponent } from './video-list/video-recently-added.component'
7import { VideoTrendingComponent } from './video-list/video-trending.component' 7import { VideoTrendingComponent } from './video-list/video-trending.component'
8import { VideosRoutingModule } from './videos-routing.module' 8import { VideosRoutingModule } from './videos-routing.module'
@@ -20,7 +20,6 @@ import { VideosComponent } from './videos.component'
20 20
21 VideoTrendingComponent, 21 VideoTrendingComponent,
22 VideoRecentlyAddedComponent, 22 VideoRecentlyAddedComponent,
23 MyVideosComponent,
24 VideoMiniatureComponent 23 VideoMiniatureComponent
25 ], 24 ],
26 25
diff --git a/client/src/sass/_mixins.scss b/client/src/sass/_mixins.scss
index 681657d90..5798b8f6e 100644
--- a/client/src/sass/_mixins.scss
+++ b/client/src/sass/_mixins.scss
@@ -4,3 +4,38 @@
4 outline: none !important; 4 outline: none !important;
5 } 5 }
6} 6}
7
8@mixin peertube-input-text($width) {
9 display: inline-block;
10 height: $button-height;
11 width: $width;
12 background: #fff;
13 border: 1px solid #C6C6C6;
14 border-radius: 3px;
15 padding-left: 15px;
16
17 &::placeholder {
18 color: #585858;
19 }
20}
21
22@mixin peertube-button {
23 border: none;
24 color: #fff;
25 font-weight: $font-semibold;
26 font-size: 15px;
27 height: $button-height;
28 line-height: $button-height;
29 border-radius: 3px;
30 text-align: center;
31 background-color: $orange-color;
32 padding: 0 17px 0 13px;
33 cursor: pointer;
34}
35
36@mixin peertube-button-link {
37 display: inline-block;
38
39 @include peertube-button;
40 @include disable-default-a-behaviour;
41}
diff --git a/client/src/sass/_variables.scss b/client/src/sass/_variables.scss
index e32b37462..d05452367 100644
--- a/client/src/sass/_variables.scss
+++ b/client/src/sass/_variables.scss
@@ -8,6 +8,8 @@ $orange-color: #F1680D;
8$black-background: #000; 8$black-background: #000;
9$grey-background: #f6f2f2; 9$grey-background: #f6f2f2;
10 10
11$expanded-horizontal-margins: 150px;
12
11$button-height: 30px; 13$button-height: 30px;
12 14
13$header-height: 50px; 15$header-height: 50px;
diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss
index fc61a22da..db63db5f5 100644
--- a/client/src/sass/application.scss
+++ b/client/src/sass/application.scss
@@ -33,14 +33,50 @@ input.readonly {
33} 33}
34 34
35.main-col { 35.main-col {
36 padding: 30px; 36 margin-left: $menu-width;
37 37
38 .title-page { 38 .title-page {
39 color: #000;
39 font-size: 16px; 40 font-size: 16px;
40 font-weight: $font-bold;
41 display: inline-block; 41 display: inline-block;
42 border-bottom: 2px solid $orange-color; 42 margin-right: 55px;
43 margin-bottom: 25px; 43 font-weight: $font-semibold;
44 @include disable-default-a-behaviour;
45
46 &.active, &.title-page-single {
47 border-bottom: 2px solid $orange-color;
48 font-weight: $font-bold;
49 margin-top: 30px;
50 margin-bottom: 25px;
51 }
52 }
53
54 .margin-content {
55 margin-left: 10px;
56 margin-right: 10px;
57 }
58
59 .sub-menu {
60 background-color: #F7F7F7;
61 width: 100%;
62 height: 81px;
63 margin-bottom: 30px;
64 display: flex;
65 align-items: center;
66 }
67
68 // Override some properties if the main content is expanded (no menu on the left)
69 &.expanded {
70 margin-left: 0;
71
72 .margin-content {
73 margin-left: $expanded-horizontal-margins;
74 margin-right: $expanded-horizontal-margins;
75 }
76
77 .sub-menu {
78 padding-left: $expanded-horizontal-margins;
79 }
44 } 80 }
45} 81}
46 82
diff --git a/client/src/sass/pre-customizations.scss b/client/src/sass/pre-customizations.scss
index 693489828..52eef50f2 100644
--- a/client/src/sass/pre-customizations.scss
+++ b/client/src/sass/pre-customizations.scss
@@ -1,4 +1,5 @@
1@import '_variables.scss'; 1@import '_variables.scss';
2@import '_mixins.scss';
2 3
3$bootstrap-sass-asset-helper: false !default; 4$bootstrap-sass-asset-helper: false !default;
4// 5//
generated by cgit v1.2.3 (git 2.25.1) at 2024-12-13 23:42:50 +0000