diff options
20 files changed, 246 insertions, 109 deletions
diff --git a/client/src/app/core/confirm/confirm.component.html b/client/src/app/core/confirm/confirm.component.html index 31b735f97..cc2c28de2 100644 --- a/client/src/app/core/confirm/confirm.component.html +++ b/client/src/app/core/confirm/confirm.component.html | |||
@@ -3,17 +3,23 @@ | |||
3 | <div class="modal-content"> | 3 | <div class="modal-content"> |
4 | 4 | ||
5 | <div class="modal-header"> | 5 | <div class="modal-header"> |
6 | <button type="button" class="close" aria-label="Close" (click)="cancel()"> | 6 | <span class="close" aria-hidden="true" (click)="cancel()"></span> |
7 | <span aria-hidden="true">×</span> | 7 | <h4 class="modal-title">{{ title }}</h4> |
8 | </button> | ||
9 | <h4 class="title-page title-page-single">{{ title }}</h4> | ||
10 | </div> | 8 | </div> |
11 | 9 | ||
12 | <div class="modal-body" [innerHtml]="message"></div> | 10 | <div class="modal-body" > |
11 | <div [innerHtml]="message"></div> | ||
13 | 12 | ||
14 | <div class="modal-footer"> | 13 | <div class="form-group inputs"> |
15 | <button type="button" class="grey-button" data-dismiss="modal" (click)="cancel()">Cancel</button> | 14 | <span class="action-button action-button-cancel" (click)="cancel()"> |
16 | <button type="button" class="orange-button" (click)="confirm()">Confirm</button> | 15 | Cancel |
16 | </span> | ||
17 | |||
18 | <input | ||
19 | type="submit" value="Confirm" class="action-button-submit" | ||
20 | (click)="confirm()" | ||
21 | > | ||
22 | </div> | ||
17 | </div> | 23 | </div> |
18 | </div> | 24 | </div> |
19 | </div> | 25 | </div> |
diff --git a/client/src/app/videos/+video-edit/shared/video-description.component.scss b/client/src/app/videos/+video-edit/shared/video-description.component.scss index d6a5190c5..2c731bee3 100644 --- a/client/src/app/videos/+video-edit/shared/video-description.component.scss +++ b/client/src/app/videos/+video-edit/shared/video-description.component.scss | |||
@@ -2,11 +2,8 @@ | |||
2 | @import '_mixins'; | 2 | @import '_mixins'; |
3 | 3 | ||
4 | textarea { | 4 | textarea { |
5 | @include peertube-input-text(100%); | 5 | @include peertube-textarea(100%, 150px); |
6 | 6 | ||
7 | padding: 5px 15px; | ||
8 | font-size: 15px; | ||
9 | height: 150px; | ||
10 | margin-bottom: 15px; | 7 | margin-bottom: 15px; |
11 | } | 8 | } |
12 | 9 | ||
diff --git a/client/src/app/videos/+video-watch/video-download.component.html b/client/src/app/videos/+video-watch/video-download.component.html index 7efc79e93..f8f17a471 100644 --- a/client/src/app/videos/+video-watch/video-download.component.html +++ b/client/src/app/videos/+video-watch/video-download.component.html | |||
@@ -1,29 +1,40 @@ | |||
1 | <div bsModal #modal="bs-modal" class="modal" tabindex="-1"> | 1 | <div bsModal #modal="bs-modal" class="modal" tabindex="-1"> |
2 | <div class="modal-dialog"> | 2 | <div class="modal-dialog"> |
3 | <div class="modal-content modal-lg"> | 3 | <div class="modal-content"> |
4 | 4 | ||
5 | <div class="modal-header"> | 5 | <div class="modal-header"> |
6 | <button type="button" class="close" aria-label="Close" (click)="hide()"> | 6 | <span class="close" aria-hidden="true" (click)="hide()"></span> |
7 | <span aria-hidden="true">×</span> | 7 | <h4 class="modal-title">Download video</h4> |
8 | </button> | ||
9 | <h4 class="title-page title-page-single">Download</h4> | ||
10 | </div> | 8 | </div> |
11 | 9 | ||
12 | <div class="modal-body"> | 10 | <div class="modal-body"> |
13 | <div *ngFor="let file of video.files" class="resolution-block"> | 11 | <div class="peertube-select-container"> |
14 | <label>{{ file.resolutionLabel }}</label> | 12 | <select [(ngModel)]="resolution"> |
13 | <option *ngFor="let file of video.files" [value]="file.resolution">{{ file.resolutionLabel }}</option> | ||
14 | </select> | ||
15 | </div> | ||
16 | |||
17 | <div class="download-type"> | ||
18 | <div class="peertube-radio-container"> | ||
19 | <input type="radio" name="download" id="download-torrent" [(ngModel)]="downloadType" value="torrent"> | ||
20 | <label for="download-torrent">Torrent</label> | ||
21 | </div> | ||
22 | |||
23 | <div class="peertube-radio-container"> | ||
24 | <input type="radio" name="download" id="download-direct" [(ngModel)]="downloadType" value="direct"> | ||
25 | <label for="download-direct">Direct download</label> | ||
26 | </div> | ||
27 | </div> | ||
15 | 28 | ||
16 | <a class="orange-button-link " target="_blank" [href]="file.torrentUrl"> | 29 | <div class="form-group inputs"> |
17 | <span class="icon icon-download"></span> | 30 | <span class="action-button action-button-cancel" (click)="hide()"> |
18 | Torrent file | 31 | Cancel |
19 | </a> | 32 | </span> |
20 | <a class="orange-button-link" target="_blank" [href]="file.fileUrl"> | ||
21 | <span class="icon icon-download"></span> | ||
22 | Download | ||
23 | </a> | ||
24 | 33 | ||
25 | <!-- Don't display magnet URI for now, this is not compatible with most torrent clients --> | 34 | <input |
26 | <!--<input #magnetUriInput (click)="magnetUriInput.select()" type="text" class="form-control input-sm readonly" readonly [value]="file.magnetUri" />--> | 35 | type="submit" value="Download" class="action-button-submit" |
36 | (click)="download()" | ||
37 | > | ||
27 | </div> | 38 | </div> |
28 | </div> | 39 | </div> |
29 | </div> | 40 | </div> |
diff --git a/client/src/app/videos/+video-watch/video-download.component.scss b/client/src/app/videos/+video-watch/video-download.component.scss index 7eac3d1c9..5fca82135 100644 --- a/client/src/app/videos/+video-watch/video-download.component.scss +++ b/client/src/app/videos/+video-watch/video-download.component.scss | |||
@@ -1,26 +1,17 @@ | |||
1 | @import '_variables'; | 1 | @import '_variables'; |
2 | @import '_mixins'; | 2 | @import '_mixins'; |
3 | 3 | ||
4 | .resolution-block:not(:first-child) { | 4 | .peertube-select-container { |
5 | margin-top: 30px; | 5 | @include peertube-select-container(130px); |
6 | } | ||
7 | |||
8 | .orange-button-link { | ||
9 | margin-right: 10px; | ||
10 | } | 6 | } |
11 | 7 | ||
12 | label { | 8 | .download-type { |
13 | display: block; | 9 | margin-top: 30px; |
14 | } | ||
15 | |||
16 | .icon { | ||
17 | @include icon(21px); | ||
18 | 10 | ||
19 | margin-right: 5px; | 11 | .peertube-radio-container { |
20 | position: relative; | 12 | @include peertube-radio-container; |
21 | top: -1px; | ||
22 | 13 | ||
23 | &.icon-download { | 14 | display: inline-block; |
24 | background-image: url('../../../assets/images/video/download-white.svg'); | 15 | margin-right: 30px; |
25 | } | 16 | } |
26 | } | 17 | } |
diff --git a/client/src/app/videos/+video-watch/video-download.component.ts b/client/src/app/videos/+video-watch/video-download.component.ts index 095df1698..44ece986c 100644 --- a/client/src/app/videos/+video-watch/video-download.component.ts +++ b/client/src/app/videos/+video-watch/video-download.component.ts | |||
@@ -1,4 +1,4 @@ | |||
1 | import { Component, Input, ViewChild } from '@angular/core' | 1 | import { Component, Input, OnInit, ViewChild } from '@angular/core' |
2 | import { ModalDirective } from 'ngx-bootstrap/modal' | 2 | import { ModalDirective } from 'ngx-bootstrap/modal' |
3 | import { VideoDetails } from '../../shared/video/video-details.model' | 3 | import { VideoDetails } from '../../shared/video/video-details.model' |
4 | 4 | ||
@@ -7,15 +7,22 @@ import { VideoDetails } from '../../shared/video/video-details.model' | |||
7 | templateUrl: './video-download.component.html', | 7 | templateUrl: './video-download.component.html', |
8 | styleUrls: [ './video-download.component.scss' ] | 8 | styleUrls: [ './video-download.component.scss' ] |
9 | }) | 9 | }) |
10 | export class VideoDownloadComponent { | 10 | export class VideoDownloadComponent implements OnInit { |
11 | @Input() video: VideoDetails = null | 11 | @Input() video: VideoDetails = null |
12 | 12 | ||
13 | @ViewChild('modal') modal: ModalDirective | 13 | @ViewChild('modal') modal: ModalDirective |
14 | 14 | ||
15 | downloadType: 'direct' | 'torrent' = 'torrent' | ||
16 | resolution = -1 | ||
17 | |||
15 | constructor () { | 18 | constructor () { |
16 | // empty | 19 | // empty |
17 | } | 20 | } |
18 | 21 | ||
22 | ngOnInit () { | ||
23 | this.resolution = this.video.files[0].resolution | ||
24 | } | ||
25 | |||
19 | show () { | 26 | show () { |
20 | this.modal.show() | 27 | this.modal.show() |
21 | } | 28 | } |
@@ -23,4 +30,15 @@ export class VideoDownloadComponent { | |||
23 | hide () { | 30 | hide () { |
24 | this.modal.hide() | 31 | this.modal.hide() |
25 | } | 32 | } |
33 | |||
34 | download () { | ||
35 | const file = this.video.files.find(f => f.resolution === this.resolution) | ||
36 | if (!file) { | ||
37 | console.error('Could not find file with resolution %d.', this.resolution) | ||
38 | return | ||
39 | } | ||
40 | |||
41 | const link = this.downloadType === 'direct' ? file.fileUrl : file.torrentUrl | ||
42 | window.open(link) | ||
43 | } | ||
26 | } | 44 | } |
diff --git a/client/src/app/videos/+video-watch/video-report.component.html b/client/src/app/videos/+video-watch/video-report.component.html index 20474bab4..a9a7beb48 100644 --- a/client/src/app/videos/+video-watch/video-report.component.html +++ b/client/src/app/videos/+video-watch/video-report.component.html | |||
@@ -1,32 +1,30 @@ | |||
1 | <div bsModal #modal="bs-modal" class="modal" tabindex="-1"> | 1 | <div bsModal #modal="bs-modal" class="modal" tabindex="-1"> |
2 | <div class="modal-dialog"> | 2 | <div class="modal-dialog"> |
3 | <div class="modal-content modal-lg"> | 3 | <div class="modal-content"> |
4 | 4 | ||
5 | <div class="modal-header"> | 5 | <div class="modal-header"> |
6 | <button type="button" class="close" aria-label="Close" (click)="hide()"> | 6 | <span class="close" aria-hidden="true" (click)="hide()"></span> |
7 | <span aria-hidden="true">×</span> | 7 | <h4 class="modal-title">Report video</h4> |
8 | </button> | ||
9 | <h4 class="title-page title-page-single">Report video</h4> | ||
10 | </div> | 8 | </div> |
11 | 9 | ||
12 | <div class="modal-body"> | 10 | <div class="modal-body"> |
13 | 11 | ||
14 | <form novalidate [formGroup]="form" (ngSubmit)="report()"> | 12 | <form novalidate [formGroup]="form" (ngSubmit)="report()"> |
15 | <div class="form-group"> | 13 | <div class="form-group"> |
16 | <label for="reason">Reason</label> | 14 | <textarea placeholder="Reason..." formControlName="reason" [ngClass]="{ 'input-error': formErrors['reason'] }"> |
17 | <textarea | ||
18 | id="reason" class="form-control" placeholder="Reason..." | ||
19 | formControlName="reason" [ngClass]="{ 'input-error': formErrors['reason'] }" | ||
20 | > | ||
21 | </textarea> | 15 | </textarea> |
22 | <div *ngIf="formErrors.reason" class="form-error"> | 16 | <div *ngIf="formErrors.reason" class="form-error"> |
23 | {{ formErrors.reason }} | 17 | {{ formErrors.reason }} |
24 | </div> | 18 | </div> |
25 | </div> | 19 | </div> |
26 | 20 | ||
27 | <div class="form-group"> | 21 | <div class="form-group inputs"> |
22 | <span class="action-button action-button-cancel" (click)="hide()"> | ||
23 | Cancel | ||
24 | </span> | ||
25 | |||
28 | <input | 26 | <input |
29 | type="submit" value="Report" class="orange-button" | 27 | type="submit" value="Submit" class="action-button-submit" |
30 | [disabled]="!form.valid" | 28 | [disabled]="!form.valid" |
31 | > | 29 | > |
32 | </div> | 30 | </div> |
diff --git a/client/src/app/videos/+video-watch/video-report.component.scss b/client/src/app/videos/+video-watch/video-report.component.scss new file mode 100644 index 000000000..09d273b35 --- /dev/null +++ b/client/src/app/videos/+video-watch/video-report.component.scss | |||
@@ -0,0 +1,6 @@ | |||
1 | @import '_variables'; | ||
2 | @import '_mixins'; | ||
3 | |||
4 | textarea { | ||
5 | @include peertube-textarea(100%, 60px); | ||
6 | } | ||
diff --git a/client/src/app/videos/+video-watch/video-report.component.ts b/client/src/app/videos/+video-watch/video-report.component.ts index b94e4144e..ece14754a 100644 --- a/client/src/app/videos/+video-watch/video-report.component.ts +++ b/client/src/app/videos/+video-watch/video-report.component.ts | |||
@@ -7,7 +7,8 @@ import { VideoDetails } from '../../shared/video/video-details.model' | |||
7 | 7 | ||
8 | @Component({ | 8 | @Component({ |
9 | selector: 'my-video-report', | 9 | selector: 'my-video-report', |
10 | templateUrl: './video-report.component.html' | 10 | templateUrl: './video-report.component.html', |
11 | styleUrls: [ './video-report.component.scss' ] | ||
11 | }) | 12 | }) |
12 | export class VideoReportComponent extends FormReactive implements OnInit { | 13 | export class VideoReportComponent extends FormReactive implements OnInit { |
13 | @Input() video: VideoDetails = null | 14 | @Input() video: VideoDetails = null |
diff --git a/client/src/app/videos/+video-watch/video-share.component.html b/client/src/app/videos/+video-watch/video-share.component.html index e99eccbfe..85cf10a6c 100644 --- a/client/src/app/videos/+video-watch/video-share.component.html +++ b/client/src/app/videos/+video-watch/video-share.component.html | |||
@@ -1,12 +1,10 @@ | |||
1 | <div bsModal #modal="bs-modal" class="modal" tabindex="-1"> | 1 | <div bsModal #modal="bs-modal" class="modal" tabindex="-1"> |
2 | <div class="modal-dialog modal-lg"> | 2 | <div class="modal-dialog"> |
3 | <div class="modal-content"> | 3 | <div class="modal-content"> |
4 | 4 | ||
5 | <div class="modal-header"> | 5 | <div class="modal-header"> |
6 | <button type="button" class="close" aria-label="Close" (click)="hide()"> | 6 | <span class="close" aria-hidden="true" (click)="hide()"></span> |
7 | <span aria-hidden="true">×</span> | 7 | <h4 class="modal-title">Share</h4> |
8 | </button> | ||
9 | <h4 class="title-page title-page-single">Share</h4> | ||
10 | </div> | 8 | </div> |
11 | 9 | ||
12 | <div class="modal-body"> | 10 | <div class="modal-body"> |
@@ -37,6 +35,12 @@ | |||
37 | <div *ngIf="notSecure()" class="alert alert-warning"> | 35 | <div *ngIf="notSecure()" class="alert alert-warning"> |
38 | The url is not secured (no HTTPS), so the embed video won't work on HTTPS websites (web browsers block non secured HTTP requests on HTTPS websites). | 36 | The url is not secured (no HTTPS), so the embed video won't work on HTTPS websites (web browsers block non secured HTTP requests on HTTPS websites). |
39 | </div> | 37 | </div> |
38 | |||
39 | <div class="form-group inputs"> | ||
40 | <span class="action-button action-button-cancel" (click)="hide()"> | ||
41 | Cancel | ||
42 | </span> | ||
43 | </div> | ||
40 | </div> | 44 | </div> |
41 | </div> | 45 | </div> |
42 | </div> | 46 | </div> |
diff --git a/client/src/app/videos/+video-watch/video-share.component.scss b/client/src/app/videos/+video-watch/video-share.component.scss index e69de29bb..184e09027 100644 --- a/client/src/app/videos/+video-watch/video-share.component.scss +++ b/client/src/app/videos/+video-watch/video-share.component.scss | |||
@@ -0,0 +1,3 @@ | |||
1 | .action-button-cancel { | ||
2 | margin-right: 0 !important; | ||
3 | } | ||
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 e742e1329..205a4333c 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.scss +++ b/client/src/app/videos/+video-watch/video-watch.component.scss | |||
@@ -101,27 +101,27 @@ | |||
101 | .action-more { | 101 | .action-more { |
102 | display: inline-block; | 102 | display: inline-block; |
103 | 103 | ||
104 | .dropdown-menu .icon { | 104 | .dropdown-menu .dropdown-item { |
105 | display: inline-block; | 105 | padding: 6px 24px; |
106 | background-repeat: no-repeat; | ||
107 | background-size: contain; | ||
108 | width: 21px; | ||
109 | height: 21px; | ||
110 | vertical-align: middle; | ||
111 | margin-right: 5px; | ||
112 | position: relative; | ||
113 | top: -1px; | ||
114 | 106 | ||
115 | &.icon-download { | 107 | .icon { |
116 | background-image: url('../../../assets/images/video/download-grey.svg'); | 108 | @include icon(24px); |
117 | } | ||
118 | 109 | ||
119 | &.icon-alert { | 110 | margin-right: 10px; |
120 | background-image: url('../../../assets/images/video/alert.svg'); | 111 | position: relative; |
121 | } | 112 | top: -1px; |
113 | |||
114 | &.icon-download { | ||
115 | background-image: url('../../../assets/images/video/download-black.svg'); | ||
116 | } | ||
117 | |||
118 | &.icon-alert { | ||
119 | background-image: url('../../../assets/images/video/alert.svg'); | ||
120 | } | ||
122 | 121 | ||
123 | &.icon-blacklist { | 122 | &.icon-blacklist { |
124 | background-image: url('../../../assets/images/video/eye-closed.svg'); | 123 | background-image: url('../../../assets/images/video/blacklist.svg'); |
124 | } | ||
125 | } | 125 | } |
126 | } | 126 | } |
127 | } | 127 | } |
diff --git a/client/src/assets/images/global/cross.svg b/client/src/assets/images/global/cross.svg new file mode 100644 index 000000000..d47a75996 --- /dev/null +++ b/client/src/assets/images/global/cross.svg | |||
@@ -0,0 +1,12 @@ | |||
1 | <?xml version="1.0" encoding="UTF-8"?> | ||
2 | <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
3 | <defs></defs> | ||
4 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round"> | ||
5 | <g id="Artboard-4" transform="translate(-312.000000, -115.000000)" stroke="#585858" stroke-width="2"> | ||
6 | <g id="7" transform="translate(312.000000, 115.000000)"> | ||
7 | <path d="M19,5 L5,19" id="Path-14"></path> | ||
8 | <path d="M19,5 L5,19" id="Path-14" transform="translate(12.000000, 12.000000) scale(-1, 1) translate(-12.000000, -12.000000) "></path> | ||
9 | </g> | ||
10 | </g> | ||
11 | </g> | ||
12 | </svg> | ||
diff --git a/client/src/assets/images/video/alert.svg b/client/src/assets/images/video/alert.svg index 6d3af029f..5b43534ad 100644 --- a/client/src/assets/images/video/alert.svg +++ b/client/src/assets/images/video/alert.svg | |||
@@ -7,9 +7,9 @@ | |||
7 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | 7 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> |
8 | <g id="Artboard-4" transform="translate(-48.000000, -467.000000)"> | 8 | <g id="Artboard-4" transform="translate(-48.000000, -467.000000)"> |
9 | <g id="161" transform="translate(48.000000, 467.000000)"> | 9 | <g id="161" transform="translate(48.000000, 467.000000)"> |
10 | <path d="M12.8715755,3.50973876 L12,1.96027114 L11.1284245,3.50973876 L2.12842446,19.5097388 L1.29015252,21 L3,21 L21,21 L22.7098475,21 L21.8715755,19.5097388 L12.8715755,3.50973876 Z" id="Triangle-2" stroke="#585858" stroke-width="2" stroke-linejoin="round"></path> | 10 | <path d="M12.8715755,3.50973876 L12,1.96027114 L11.1284245,3.50973876 L2.12842446,19.5097388 L1.29015252,21 L3,21 L21,21 L22.7098475,21 L21.8715755,19.5097388 L12.8715755,3.50973876 Z" id="Triangle-2" stroke="#000000" stroke-width="2" stroke-linejoin="round"></path> |
11 | <path d="M12,17.75 C12.6903559,17.75 13.25,17.1903559 13.25,16.5 C13.25,15.8096441 12.6903559,15.25 12,15.25 C11.3096441,15.25 10.75,15.8096441 10.75,16.5 C10.75,17.1903559 11.3096441,17.75 12,17.75 Z" id="Oval-8" fill="#585858"></path> | 11 | <path d="M12,17.75 C12.6903559,17.75 13.25,17.1903559 13.25,16.5 C13.25,15.8096441 12.6903559,15.25 12,15.25 C11.3096441,15.25 10.75,15.8096441 10.75,16.5 C10.75,17.1903559 11.3096441,17.75 12,17.75 Z" id="Oval-8" fill="#000000"></path> |
12 | <rect id="Rectangle-3" fill="#585858" x="11" y="9" width="2" height="5" rx="1"></rect> | 12 | <rect id="Rectangle-3" fill="#000000" x="11" y="9" width="2" height="5" rx="1"></rect> |
13 | </g> | 13 | </g> |
14 | </g> | 14 | </g> |
15 | </g> | 15 | </g> |
diff --git a/client/src/assets/images/video/blacklist.svg b/client/src/assets/images/video/blacklist.svg new file mode 100644 index 000000000..431c73816 --- /dev/null +++ b/client/src/assets/images/video/blacklist.svg | |||
@@ -0,0 +1,15 @@ | |||
1 | <?xml version="1.0" encoding="UTF-8"?> | ||
2 | <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
3 | <!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch --> | ||
4 | <title>no</title> | ||
5 | <desc>Created with Sketch.</desc> | ||
6 | <defs></defs> | ||
7 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> | ||
8 | <g id="Artboard-4" transform="translate(-312.000000, -863.000000)" stroke="#000000" stroke-width="2"> | ||
9 | <g id="347" transform="translate(312.000000, 863.000000)"> | ||
10 | <circle id="Oval-196" cx="12" cy="12" r="9"></circle> | ||
11 | <path d="M18,18 L6,6" id="Path-275"></path> | ||
12 | </g> | ||
13 | </g> | ||
14 | </g> | ||
15 | </svg> | ||
diff --git a/client/src/assets/images/video/download-black.svg b/client/src/assets/images/video/download-black.svg new file mode 100644 index 000000000..501836746 --- /dev/null +++ b/client/src/assets/images/video/download-black.svg | |||
@@ -0,0 +1,16 @@ | |||
1 | <?xml version="1.0" encoding="UTF-8"?> | ||
2 | <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
3 | <!-- Generator: Sketch 43.2 (39069) - http://www.bohemiancoding.com/sketch --> | ||
4 | <title>download</title> | ||
5 | <desc>Created with Sketch.</desc> | ||
6 | <defs></defs> | ||
7 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round"> | ||
8 | <g id="Artboard-4" transform="translate(-180.000000, -291.000000)" stroke="#000000" stroke-width="2"> | ||
9 | <g id="84" transform="translate(180.000000, 291.000000)"> | ||
10 | <path d="M12,3 L12,15" id="Path-58"></path> | ||
11 | <polyline id="Path-59" stroke-linejoin="round" transform="translate(12.000000, 14.000000) rotate(-270.000000) translate(-12.000000, -14.000000) " points="9 8 15 14 9 20"></polyline> | ||
12 | <path d="M3,18 L3,20.0590859 C3,20.6127331 3.44494889,21.0615528 3.99340349,21.0615528 L20.0067018,21.0615528 C20.5553434,21.0615528 21.0001052,20.6098102 21.0001051,20.0590859 L21.0001049,18" id="Path-12" stroke-linejoin="round"></path> | ||
13 | </g> | ||
14 | </g> | ||
15 | </g> | ||
16 | </svg> | ||
diff --git a/client/src/assets/images/video/eye-closed.svg b/client/src/assets/images/video/eye-closed.svg deleted file mode 100644 index c5b739659..000000000 --- a/client/src/assets/images/video/eye-closed.svg +++ /dev/null | |||
@@ -1,18 +0,0 @@ | |||
1 | <?xml version="1.0" encoding="UTF-8"?> | ||
2 | <svg width="24px" height="24px" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> | ||
3 | <defs></defs> | ||
4 | <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linecap="round"> | ||
5 | <g id="Artboard-4" transform="translate(-796.000000, -1046.000000)" stroke="#585858" stroke-width="2"> | ||
6 | <g id="Extras" transform="translate(48.000000, 1046.000000)"> | ||
7 | <g id="eye-closed" transform="translate(760.000000, 12.000000) scale(1, -1) translate(-760.000000, -12.000000) translate(748.000000, 0.000000)"> | ||
8 | <path d="M2,14 C2,14 5,7 12,7 C19,7 22,14 22,14" id="Path-80" stroke-linejoin="round"></path> | ||
9 | <path d="M12,7 L12,5" id="Path-81"></path> | ||
10 | <path d="M18,8.5 L19,7" id="Path-81"></path> | ||
11 | <path d="M21,12 L22.5,11" id="Path-81"></path> | ||
12 | <path d="M1.5,12 L3,11" id="Path-81" transform="translate(2.250000, 11.500000) scale(1, -1) translate(-2.250000, -11.500000) "></path> | ||
13 | <path d="M5,8.5 L6,7" id="Path-81" transform="translate(5.500000, 7.750000) scale(-1, 1) translate(-5.500000, -7.750000) "></path> | ||
14 | </g> | ||
15 | </g> | ||
16 | </g> | ||
17 | </g> | ||
18 | </svg> | ||
diff --git a/client/src/sass/application.scss b/client/src/sass/application.scss index a1c222c31..0d96d5ec0 100644 --- a/client/src/sass/application.scss +++ b/client/src/sass/application.scss | |||
@@ -258,9 +258,39 @@ p-datatable { | |||
258 | .modal { | 258 | .modal { |
259 | .modal-header { | 259 | .modal-header { |
260 | border-bottom: none; | 260 | border-bottom: none; |
261 | margin-bottom: 5px; | ||
261 | 262 | ||
262 | .title-page-single { | 263 | .modal-title { |
263 | margin: 0; | 264 | font-size: 20px; |
265 | font-weight: $font-semibold; | ||
266 | } | ||
267 | |||
268 | .close { | ||
269 | @include icon(24px); | ||
270 | |||
271 | position: relative; | ||
272 | right: -1px; | ||
273 | float: right; | ||
274 | background-image: url('../assets/images/global/cross.svg'); | ||
275 | } | ||
276 | } | ||
277 | |||
278 | .inputs { | ||
279 | margin-top: 40px; | ||
280 | margin-bottom: 0; | ||
281 | text-align: right; | ||
282 | |||
283 | .action-button-cancel { | ||
284 | @include peertube-button; | ||
285 | @include grey-button; | ||
286 | |||
287 | display: inline-block; | ||
288 | margin-right: 10px; | ||
289 | } | ||
290 | |||
291 | .action-button-submit { | ||
292 | @include peertube-button; | ||
293 | @include orange-button; | ||
264 | } | 294 | } |
265 | } | 295 | } |
266 | } | 296 | } |
diff --git a/client/src/sass/include/_bootstrap.scss b/client/src/sass/include/_bootstrap.scss index 3857bb521..4f0e2893e 100644 --- a/client/src/sass/include/_bootstrap.scss +++ b/client/src/sass/include/_bootstrap.scss | |||
@@ -37,7 +37,7 @@ | |||
37 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/panels"; | 37 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/panels"; |
38 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/responsive-embed"; | 38 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/responsive-embed"; |
39 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/wells"; | 39 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/wells"; |
40 | @import "~bootstrap-sass/assets/stylesheets/bootstrap/close"; | 40 | //@import "~bootstrap-sass/assets/stylesheets/bootstrap/close"; |
41 | 41 | ||
42 | // Components w/ JavaScript | 42 | // Components w/ JavaScript |
43 | @import "~bootstrap-sass/assets/stylesheets/bootstrap/modals"; | 43 | @import "~bootstrap-sass/assets/stylesheets/bootstrap/modals"; |
diff --git a/client/src/sass/include/_mixins.scss b/client/src/sass/include/_mixins.scss index a07bd5d28..252cf2173 100644 --- a/client/src/sass/include/_mixins.scss +++ b/client/src/sass/include/_mixins.scss | |||
@@ -22,6 +22,14 @@ | |||
22 | } | 22 | } |
23 | } | 23 | } |
24 | 24 | ||
25 | @mixin peertube-textarea ($width, $height) { | ||
26 | @include peertube-input-text($width); | ||
27 | |||
28 | height: $height; | ||
29 | padding: 5px 15px; | ||
30 | font-size: 15px; | ||
31 | } | ||
32 | |||
25 | @mixin orange-button { | 33 | @mixin orange-button { |
26 | &, &:active, &:focus { | 34 | &, &:active, &:focus { |
27 | color: #fff; | 35 | color: #fff; |
@@ -101,6 +109,7 @@ | |||
101 | overflow: hidden; | 109 | overflow: hidden; |
102 | background: #fff; | 110 | background: #fff; |
103 | position: relative; | 111 | position: relative; |
112 | font-size: 15px; | ||
104 | 113 | ||
105 | &:after { | 114 | &:after { |
106 | top: 50%; | 115 | top: 50%; |
@@ -149,6 +158,44 @@ | |||
149 | } | 158 | } |
150 | } | 159 | } |
151 | 160 | ||
161 | // Thanks: https://codepen.io/triss90/pen/XNEdRe/ | ||
162 | @mixin peertube-radio-container { | ||
163 | input[type="radio"] { | ||
164 | display: none; | ||
165 | |||
166 | & + label { | ||
167 | font-weight: $font-regular; | ||
168 | cursor: pointer; | ||
169 | |||
170 | &:before { | ||
171 | position: relative; | ||
172 | top: -2px; | ||
173 | content: ''; | ||
174 | background: #fff; | ||
175 | border-radius: 100%; | ||
176 | border: 1px solid #000; | ||
177 | display: inline-block; | ||
178 | width: 15px; | ||
179 | height: 15px; | ||
180 | vertical-align: middle; | ||
181 | cursor: pointer; | ||
182 | text-align: center; | ||
183 | margin-right: 10px; | ||
184 | } | ||
185 | } | ||
186 | |||
187 | &:checked + label:before { | ||
188 | background-color: #000; | ||
189 | box-shadow: inset 0 0 0 4px #fff; | ||
190 | } | ||
191 | |||
192 | &:focus + label:before { | ||
193 | outline: none; | ||
194 | border-color: #000; | ||
195 | } | ||
196 | } | ||
197 | } | ||
198 | |||
152 | @mixin peertube-checkbox ($border-width) { | 199 | @mixin peertube-checkbox ($border-width) { |
153 | display: none; | 200 | display: none; |
154 | 201 | ||
diff --git a/server/lib/cache/videos-preview-cache.ts b/server/lib/cache/videos-preview-cache.ts index 28908b186..0eb43efcc 100644 --- a/server/lib/cache/videos-preview-cache.ts +++ b/server/lib/cache/videos-preview-cache.ts | |||
@@ -47,7 +47,7 @@ class VideosPreviewCache { | |||
47 | } | 47 | } |
48 | 48 | ||
49 | private async loadPreviews (key: string) { | 49 | private async loadPreviews (key: string) { |
50 | const video = await VideoModel.loadByUUID(key) | 50 | const video = await VideoModel.loadByUUIDAndPopulateAccountAndServerAndTags(key) |
51 | if (!video) return undefined | 51 | if (!video) return undefined |
52 | 52 | ||
53 | if (video.isOwned()) throw new Error('Cannot load preview of owned video.') | 53 | if (video.isOwned()) throw new Error('Cannot load preview of owned video.') |