-<h3>Make friends</h3>
+<div class="row">
+ <div class="content-padding">
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+ <h3>Make friends</h3>
-<form (ngSubmit)="makeFriends()" [formGroup]="form">
- <div class="form-group" *ngFor="let host of hosts; let id = index; trackBy:customTrackBy">
- <label for="username">Host</label>
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
- <div class="input-group">
- <input
- type="text" class="form-control" placeholder="domain.tld"
- [id]="'host-' + id" [formControlName]="'host-' + id"
- />
- <span class="input-group-btn">
- <button *ngIf="displayAddField(id)" (click)="addField()" class="btn btn-default" type="button">+</button>
- <button *ngIf="displayRemoveField(id)" (click)="removeField(id)" class="btn btn-default" type="button">-</button>
- </span>
- </div>
+ <form (ngSubmit)="makeFriends()" [formGroup]="form">
+ <div class="form-group" *ngFor="let host of hosts; let id = index; trackBy:customTrackBy">
+ <label for="username">Host</label>
- <div [hidden]="form.controls['host-' + id].valid || form.controls['host-' + id].pristine" class="alert alert-warning">
- It should be a valid host.
- </div>
- </div>
+ <div class="input-group">
+ <input
+ type="text" class="form-control" placeholder="domain.tld"
+ [id]="'host-' + id" [formControlName]="'host-' + id"
+ />
+ <span class="input-group-btn">
+ <button *ngIf="displayAddField(id)" (click)="addField()" class="btn btn-default" type="button">+</button>
+ <button *ngIf="displayRemoveField(id)" (click)="removeField(id)" class="btn btn-default" type="button">-</button>
+ </span>
+ </div>
- <div *ngIf="canMakeFriends() === false" class="alert alert-warning">
- It seems that you are not on a HTTPS pod. Your webserver need to have TLS activated in order to make friends.
- </div>
+ <div [hidden]="form.controls['host-' + id].valid || form.controls['host-' + id].pristine" class="alert alert-warning">
+ It should be a valid host.
+ </div>
+ </div>
- <input type="submit" value="Make friends" class="btn btn-default" [disabled]="!isFormValid()">
-</form>
+ <div *ngIf="canMakeFriends() === false" class="alert alert-warning">
+ It seems that you are not on a HTTPS pod. Your webserver need to have TLS activated in order to make friends.
+ </div>
+
+ <input type="submit" value="Make friends" class="btn btn-default" [disabled]="!isFormValid()">
+ </form>
+ </div>
+</div>
-<h3>Friends list</h3>
+<div class="row">
+ <div class="content-padding">
+ <h3>Friends list</h3>
-<ng2-smart-table [settings]="tableSettings" [source]="friendsSource"></ng2-smart-table>
+ <ng2-smart-table [settings]="tableSettings" [source]="friendsSource"></ng2-smart-table>
-<a *ngIf="hasFriends()" class="btn btn-danger pull-left" (click)="quitFriends()">
- Quit friends
-</a>
+
<a *ngIf="hasFriends()" class="btn btn-danger pull-left" (click)="quitFriends()">
+ Quit friends
+ </a>
-<a *ngIf="!hasFriends()" class="btn btn-success pull-right" [routerLink]="['/admin/friends/add']">
- Make friends
-</a>
+ <a *ngIf="!hasFriends()" class="btn btn-success pull-right" [routerLink]="['/admin/friends/add']">
+ Make friends
+ </a>
+ </div>
+</div>
-<h3>Requests stats</h3>
+<div class="row">
+ <div class="content-padding">
-<div *ngFor="let requestSchedulerName of statsTitles | keys" class="col-lg-4 col-md-12">
- <div class="panel panel-default" *ngIf="stats[requestSchedulerName] !== null">
- <div class="panel-heading">{{ statsTitles[requestSchedulerName] }}</div>
+ <h3>Requests stats</h3>
- <div class="panel-body">
- <div class="requests-general">
- <div>
- <span class="label-description">Remaining requests:</span>
- {{ stats[requestSchedulerName].totalRequests }}
- </div>
+ <div *ngFor="let requestSchedulerName of statsTitles | keys" class="col-lg-4 col-md-12">
+ <div class="panel panel-default" *ngIf="stats[requestSchedulerName] !== null">
+ <div class="panel-heading">{{ statsTitles[requestSchedulerName] }}</div>
- <div>
- <span class="label-description">Interval seconds between requests:</span>
- {{ stats[requestSchedulerName].secondsInterval }}
- </div>
+ <div class="panel-body">
+ <div class="requests-general">
+ <div>
+ <span class="label-description">Remaining requests:</span>
+ {{ stats[requestSchedulerName].totalRequests }}
+ </div>
- <div>
- <span class="label-description">Remaining time before the scheduled request:</span>
- {{ stats[requestSchedulerName].remainingSeconds }}
- </div>
- </div>
+ <div>
+ <span class="label-description">Interval seconds between requests:</span>
+ {{ stats[requestSchedulerName].secondsInterval }}
+ </div>
- <div class="requests-limit">
- <div>
- <span class="label-description">Maximum number of different pods for a scheduled request:</span>
- {{ stats[requestSchedulerName].requestsLimitPods }}
- </div>
+ <div>
+ <span class="label-description">Remaining time before the scheduled request:</span>
+ {{ stats[requestSchedulerName].remainingSeconds }}
+ </div>
+ </div>
+
+ <div class="requests-limit">
+ <div>
+ <span class="label-description">Maximum number of different pods for a scheduled request:</span>
+ {{ stats[requestSchedulerName].requestsLimitPods }}
+ </div>
- <div>
- <span class="label-description">Maximum number of requests per pod for a scheduled request:</span>
- {{ stats[requestSchedulerName].requestsLimitPerPod }}
+ <div>
+ <span class="label-description">Maximum number of requests per pod for a scheduled request:</span>
+ {{ stats[requestSchedulerName].requestsLimitPerPod }}
+ </div>
+ </div>
</div>
</div>
</div>
-<h3>Add user</h3>
+<div class="row">
+ <div class="content-padding">
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+ <h3>Add user</h3>
-<form role="form" (ngSubmit)="addUser()" [formGroup]="form">
- <div class="form-group">
- <label for="username">Username</label>
- <input
- type="text" class="form-control" id="username" placeholder="Username"
- formControlName="username"
- >
- <div *ngIf="formErrors.username" class="alert alert-danger">
- {{ formErrors.username }}
- </div>
- </div>
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
- <div class="form-group">
- <label for="email">Email</label>
- <input
- type="text" class="form-control" id="email" placeholder="Email"
- formControlName="email"
- >
- <div *ngIf="formErrors.email" class="alert alert-danger">
- {{ formErrors.email }}
- </div>
- </div>
+ <form role="form" (ngSubmit)="addUser()" [formGroup]="form">
+ <div class="form-group">
+ <label for="username">Username</label>
+ <input
+ type="text" class="form-control" id="username" placeholder="Username"
+ formControlName="username"
+ >
+ <div *ngIf="formErrors.username" class="alert alert-danger">
+ {{ formErrors.username }}
+ </div>
+ </div>
- <div class="form-group">
- <label for="password">Password</label>
- <input
- type="password" class="form-control" id="password" placeholder="Password"
- formControlName="password"
- >
- <div *ngIf="formErrors.password" class="alert alert-danger">
- {{ formErrors.password }}
- </div>
- </div>
+
<div class="form-group">
+ <label for="email">Email</label>
+ <input
+ type="text" class="form-control" id="email" placeholder="Email"
+ formControlName="email"
+ >
+ <div *ngIf="formErrors.email" class="alert alert-danger">
+ {{ formErrors.email }}
+ </div>
+ </div>
- <input type="submit" value="Add user" class="btn btn-default" [disabled]="!form.valid">
-</form>
+ <div class="form-group">
+ <label for="password">Password</label>
+ <input
+ type="password" class="form-control" id="password" placeholder="Password"
+ formControlName="password"
+ >
+ <div *ngIf="formErrors.password" class="alert alert-danger">
+ {{ formErrors.password }}
+ </div>
+ </div>
+
+ <input type="submit" value="Add user" class="btn btn-default" [disabled]="!form.valid">
+ </form>
+ </div>
+</div>
-<h3>Users list</h3>
+<div class="row">
+ <div class="content-padding">
-<ng2-smart-table
- [settings]="tableSettings" [source]="usersSource"
- (delete)="removeUser($event)"
-></ng2-smart-table>
+ <h3>Users list</h3>
-<a class="add-user btn btn-success pull-right" [routerLink]="['/admin/users/add']">
- <span class="glyphicon glyphicon-plus"></span>
- Add user
-</a>
+ <ng2-smart-table
+ [settings]="tableSettings" [source]="usersSource"
+ (delete)="removeUser($event)"
+ ></ng2-smart-table>
+
+ <a class="add-user btn btn-success pull-right" [routerLink]="['/admin/users/add']">
+ <span class="glyphicon glyphicon-plus"></span>
+ Add user
+ </a>
+ </div>
+</div>
-<h3>Video abuses list</h3>
+<div class="row">
+ <div class="content-padding">
-<ng2-smart-table
- [settings]="tableSettings" [source]="videoAbusesSource"
-></ng2-smart-table>
+ <h3>Video abuses list</h3>
+
+ <ng2-smart-table
+ [settings]="tableSettings" [source]="videoAbusesSource"
+ ></ng2-smart-table>
+
+ </div>
+</div>
-<h3>Account</h3>
+<div class="row">
+ <div class="content-padding">
+ <h3>Account</h3>
-<div class="col-md-6 col-sm-12">
-<div class="panel panel-default">
- <div class="panel-heading">Change password</div>
+
<div class="col-md-6 col-sm-12">
+
<div class="panel panel-default">
+
<div class="panel-heading">Change password</div>
- <div class="panel-body">
- <my-account-change-password></my-account-change-password>
- </div>
-</div>
-</div>
+
<div class="panel-body">
+ <my-account-change-password></my-account-change-password>
+ </div>
+ </div>
+ </div>
-<div class="col-md-6 col-sm-12">
-<div class="panel panel-default">
- <div class="panel-heading">Update my informations</div>
+
<div class="col-md-6 col-sm-12">
+
<div class="panel panel-default">
+
<div class="panel-heading">Update my informations</div>
- <div class="panel-body">
- <my-account-details [user]="user"></my-account-details>
+ <div class="panel-body">
+ <my-account-details [user]="user"></my-account-details>
+ </div>
+ </div>
+ </div>
</div>
</div>
-</div>
</div>
<div class="col-md-10 col-sm-9 col-xs-9 main-col">
- <div class="header">
- <my-search></my-search>
+ <div class="row header">
+ <!-- We need to reset col-md-* because my-search is in fixed position -->
+ <my-search class="col-md-10 col-sm-9 col-xs-9"></my-search>
</div>
<div class="main-row">
<router-outlet></router-outlet>
</div>
- <footer>
+ <footer class="row">
PeerTube, CopyLeft 2015-2017
</footer>
</div>
}
}
+my-search {
+ // Fix col-md-* padding
+ padding: 0;
+}
+
footer {
- border-top: 1px solid rgba(0, 0, 0, 0.2);
- padding: 10px;
+ border-top: 1px solid $footer-border-color;
+ padding: 10px 0;
text-align: center;
- font-size: small;
- margin: 30px 10px 0 10px;
+ font-size: 11px;
+ margin-top: 30px;
}
-<h3>Login</h3>
+<div class="row">
+ <div class="content-padding">
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+ <h3>Login</h3>
-<form role="form" (ngSubmit)="login()" [formGroup]="form">
- <div class="form-group">
- <label for="username">Username</label>
- <input
- type="text" class="form-control" id="username" placeholder="Username" required
- formControlName="username"
- >
- <div *ngIf="formErrors.username" class="alert alert-danger">
- {{ formErrors.username }}
- </div>
- </div>
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
- <div class="form-group">
- <label for="password">Password</label>
- <input
- type="password" class="form-control" name="password" id="password" placeholder="Password" required
- formControlName="password"
- >
- <div *ngIf="formErrors.password" class="alert alert-danger">
- {{ formErrors.password }}
- </div>
- </div>
+ <form role="form" (ngSubmit)="login()" [formGroup]="form">
+ <div class="form-group">
+ <label for="username">Username</label>
+ <input
+ type="text" class="form-control" id="username" placeholder="Username" required
+ formControlName="username"
+ >
+ <div *ngIf="formErrors.username" class="alert alert-danger">
+ {{ formErrors.username }}
+ </div>
+ </div>
- <input type="submit" value="Login" class="btn btn-default" [disabled]="!form.valid">
-</form>
+ <div class="form-group">
+ <label for="password">Password</label>
+ <input
+ type="password" class="form-control" name="password" id="password" placeholder="Password" required
+ formControlName="password"
+ >
+ <div *ngIf="formErrors.password" class="alert alert-danger">
+ {{ formErrors.password }}
+ </div>
+ </div>
+
+ <input type="submit" value="Login" class="btn btn-default" [disabled]="!form.valid">
+ </form>
+ </div>
+</div>
-<h3>Signup</h3>
+<div class="row">
+ <div class="content-padding">
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+ <h3>Signup</h3>
-<form role="form" (ngSubmit)="signup()" [formGroup]="form">
- <div class="form-group">
- <label for="username">Username</label>
- <input
- type="text" class="form-control" id="username" placeholder="Username"
- formControlName="username"
- >
- <div *ngIf="formErrors.username" class="alert alert-danger">
- {{ formErrors.username }}
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+
+ <form role="form" (ngSubmit)="signup()" [formGroup]="form">
+ <div class="form-group">
+ <label for="username">Username</label>
+ <input
+ type="text" class="form-control" id="username" placeholder="Username"
+ formControlName="username"
+ >
+ <div *ngIf="formErrors.username" class="alert alert-danger">
+ {{ formErrors.username }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="email">Email</label>
- <input
- type="text" class="form-control" id="email" placeholder="Email"
- formControlName="email"
- >
- <div *ngIf="formErrors.email" class="alert alert-danger">
- {{ formErrors.email }}
+ <div class="form-group">
+ <label for="email">Email</label>
+ <input
+ type="text" class="form-control" id="email" placeholder="Email"
+ formControlName="email"
+ >
+ <div *ngIf="formErrors.email" class="alert alert-danger">
+ {{ formErrors.email }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="password">Password</label>
- <input
- type="password" class="form-control" id="password" placeholder="Password"
- formControlName="password"
- >
- <div *ngIf="formErrors.password" class="alert alert-danger">
- {{ formErrors.password }}
+ <div class="form-group">
+ <label for="password">Password</label>
+ <input
+ type="password" class="form-control" id="password" placeholder="Password"
+ formControlName="password"
+ >
+ <div *ngIf="formErrors.password" class="alert alert-danger">
+ {{ formErrors.password }}
+ </div>
</div>
- </div>
- <input type="submit" value="Signup" class="btn btn-default" [disabled]="!form.valid">
-</form>
+ <input type="submit" value="Signup" class="btn btn-default" [disabled]="!form.valid">
+ </form>
+
+ </div>
+</div>
-<h3>Upload a video</h3>
-
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
-
-<form novalidate [formGroup]="form">
- <div class="form-group">
- <label for="name">Name</label>
- <input
- type="text" class="form-control" id="name"
- formControlName="name"
- >
- <div *ngIf="formErrors.name" class="alert alert-danger">
- {{ formErrors.name }}
- </div>
+<div class="row">
+ <div class="content-padding">
+
+ <h3>Upload a video</h3>
+
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+
+ <form novalidate [formGroup]="form">
+ <div class="form-group">
+ <label for="name">Name</label>
+ <input
+ type="text" class="form-control" id="name"
+ formControlName="name"
+ >
+ <div *ngIf="formErrors.name" class="alert alert-danger">
+ {{ formErrors.name }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="nsfw">NSFW</label>
+ <input
+ type="checkbox" id="nsfw"
+ formControlName="nsfw"
+ >
+ </div>
+
+ <div class="form-group">
+ <label for="category">Category</label>
+ <select class="form-control" id="category" formControlName="category">
+ <option></option>
+ <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.category" class="alert alert-danger">
+ {{ formErrors.category }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="licence">Licence</label>
+ <select class="form-control" id="licence" formControlName="licence">
+ <option></option>
+ <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.licence" class="alert alert-danger">
+ {{ formErrors.licence }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="language">Language</label>
+ <select class="form-control" id="language" formControlName="language">
+ <option></option>
+ <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
+ </select>
+
+ <div *ngIf="formErrors.language" class="alert alert-danger">
+ {{ formErrors.language }}
+ </div>
+ </div>
+
+ <div class="form-group">
+ <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
+ <tag-input
+ [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
+ formControlName="tags" maxItems="3" modelAsStrings="true"
+ ></tag-input>
+ </div>
+
+ <div class="form-group">
+ <label for="videofile">File</label>
+ <div class="btn btn-default btn-file" [ngClass]="{ 'disabled': filename !== null }" >
+ <span>Select the video...</span>
+ <input
+ type="file" name="videofile" id="videofile"
+ ng2FileSelect [uploader]="uploader" [disabled]="filename !== null"
+ (change)="fileChanged()"
+ >
+ </div>
+ </div>
+
+ <div class="file-to-upload">
+ <div class="file" *ngIf="uploader.queue.length > 0">
+ <span class="filename">{{ filename }}</span>
+ <span class="glyphicon glyphicon-remove" (click)="removeFile()"></span>
+ </div>
+ </div>
+
+ <div *ngIf="fileError" class="alert alert-danger">
+ {{ fileError }}
+ </div>
+
+ <div class="form-group">
+ <label for="description">Description</label>
+ <textarea
+ id="description" class="form-control" placeholder="Description..."
+ formControlName="description"
+ >
+ </textarea>
+ <div *ngIf="formErrors.description" class="alert alert-danger">
+ {{ formErrors.description }}
+ </div>
+ </div>
+
+ <div class="progress">
+ <progressbar [value]="uploader.progress" max="100"></progressbar>
+ </div>
+
+ <div class="form-group">
+ <input
+ type="button" value="Upload" class="btn btn-default form-control"
+ (click)="upload()"
+ >
+ </div>
+ </form>
</div>
-
- <div class="form-group">
- <label for="nsfw">NSFW</label>
- <input
- type="checkbox" id="nsfw"
- formControlName="nsfw"
- >
- </div>
-
- <div class="form-group">
- <label for="category">Category</label>
- <select class="form-control" id="category" formControlName="category">
- <option></option>
- <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
- </select>
-
- <div *ngIf="formErrors.category" class="alert alert-danger">
- {{ formErrors.category }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="licence">Licence</label>
- <select class="form-control" id="licence" formControlName="licence">
- <option></option>
- <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
- </select>
-
- <div *ngIf="formErrors.licence" class="alert alert-danger">
- {{ formErrors.licence }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="language">Language</label>
- <select class="form-control" id="language" formControlName="language">
- <option></option>
- <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
- </select>
-
- <div *ngIf="formErrors.language" class="alert alert-danger">
- {{ formErrors.language }}
- </div>
- </div>
-
- <div class="form-group">
- <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
- <tag-input
- [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
- formControlName="tags" maxItems="3" modelAsStrings="true"
- ></tag-input>
- </div>
-
- <div class="form-group">
- <label for="videofile">File</label>
- <div class="btn btn-default btn-file" [ngClass]="{ 'disabled': filename !== null }" >
- <span>Select the video...</span>
- <input
- type="file" name="videofile" id="videofile"
- ng2FileSelect [uploader]="uploader" [disabled]="filename !== null"
- (change)="fileChanged()"
- >
- </div>
- </div>
-
- <div class="file-to-upload">
- <div class="file" *ngIf="uploader.queue.length > 0">
- <span class="filename">{{ filename }}</span>
- <span class="glyphicon glyphicon-remove" (click)="removeFile()"></span>
- </div>
- </div>
-
- <div *ngIf="fileError" class="alert alert-danger">
- {{ fileError }}
- </div>
-
- <div class="form-group">
- <label for="description">Description</label>
- <textarea
- id="description" class="form-control" placeholder="Description..."
- formControlName="description"
- >
- </textarea>
- <div *ngIf="formErrors.description" class="alert alert-danger">
- {{ formErrors.description }}
- </div>
- </div>
-
- <div class="progress">
- <progressbar [value]="uploader.progress" max="100"></progressbar>
- </div>
-
- <div class="form-group">
- <input
- type="button" value="Upload" class="btn btn-default form-control"
- (click)="upload()"
- >
- </div>
-</form>
+</div>
-<h3>Update {{ video?.name }}</h3>
+<div class="row">
+ <div class="content-padding">
-<div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+ <h3>Update {{ video?.name }}</h3>
-<form novalidate [formGroup]="form">
- <div class="form-group">
- <label for="name">Name</label>
- <input
- type="text" class="form-control" id="name"
- formControlName="name"
- >
- <div *ngIf="formErrors.name" class="alert alert-danger">
- {{ formErrors.name }}
+ <div *ngIf="error" class="alert alert-danger">{{ error }}</div>
+
+ <form novalidate [formGroup]="form">
+ <div class="form-group">
+ <label for="name">Name</label>
+ <input
+ type="text" class="form-control" id="name"
+ formControlName="name"
+ >
+ <div *ngIf="formErrors.name" class="alert alert-danger">
+ {{ formErrors.name }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="nsfw">NSFW</label>
- <input
- type="checkbox" id="nsfw"
- formControlName="nsfw"
- >
- </div>
+
<div class="form-group">
+ <label for="nsfw">NSFW</label>
+ <input
+ type="checkbox" id="nsfw"
+ formControlName="nsfw"
+ >
+ </div>
- <div class="form-group">
- <label for="category">Category</label>
- <select class="form-control" id="category" formControlName="category">
- <option></option>
- <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
- </select>
+
<div class="form-group">
+ <label for="category">Category</label>
+ <select class="form-control" id="category" formControlName="category">
+ <option></option>
+ <option *ngFor="let category of videoCategories" [value]="category.id">{{ category.label }}</option>
+ </select>
- <div *ngIf="formErrors.category" class="alert alert-danger">
- {{ formErrors.category }}
+ <div *ngIf="formErrors.category" class="alert alert-danger">
+ {{ formErrors.category }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="licence">Licence</label>
- <select class="form-control" id="licence" formControlName="licence">
- <option></option>
- <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
- </select>
+
<div class="form-group">
+ <label for="licence">Licence</label>
+ <select class="form-control" id="licence" formControlName="licence">
+ <option></option>
+ <option *ngFor="let licence of videoLicences" [value]="licence.id">{{ licence.label }}</option>
+ </select>
- <div *ngIf="formErrors.licence" class="alert alert-danger">
- {{ formErrors.licence }}
+ <div *ngIf="formErrors.licence" class="alert alert-danger">
+ {{ formErrors.licence }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="language">Language</label>
- <select class="form-control" id="language" formControlName="language">
- <option></option>
- <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
- </select>
+
<div class="form-group">
+ <label for="language">Language</label>
+ <select class="form-control" id="language" formControlName="language">
+ <option></option>
+ <option *ngFor="let language of videoLanguages" [value]="language.id">{{ language.label }}</option>
+ </select>
- <div *ngIf="formErrors.language" class="alert alert-danger">
- {{ formErrors.language }}
+ <div *ngIf="formErrors.language" class="alert alert-danger">
+ {{ formErrors.language }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
- <tag-input
- [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
- formControlName="tags" maxItems="3" modelAsStrings="true"
- ></tag-input>
- </div>
+
<div class="form-group">
+ <label for="tags" class="label-tags">Tags</label> <span class="little-information">(press enter to add the tag)</span>
+ <tag-input
+ [ngModel]="tags" [validators]="tagValidators" [errorMessages]="tagValidatorsMessages"
+ formControlName="tags" maxItems="3" modelAsStrings="true"
+ ></tag-input>
+ </div>
- <div class="form-group">
- <label for="description">Description</label>
- <textarea
- id="description" class="form-control" placeholder="Description..."
- formControlName="description"
- >
- </textarea>
- <div *ngIf="formErrors.description" class="alert alert-danger">
- {{ formErrors.description }}
+ <div class="form-group">
+ <label for="description">Description</label>
+ <textarea
+ id="description" class="form-control" placeholder="Description..."
+ formControlName="description"
+ >
+ </textarea>
+ <div *ngIf="formErrors.description" class="alert alert-danger">
+ {{ formErrors.description }}
+ </div>
</div>
- </div>
- <div class="form-group">
- <input
- type="button" value="Update" class="btn btn-default form-control"
- (click)="update()"
- >
+ <div class="form-group">
+ <input
+ type="button" value="Update" class="btn btn-default form-control"
+ (click)="update()"
+ >
+ </div>
+ </form>
</div>
-</form>
+</div>
-<div class="row col-md-12 videos-info">
- <div class="col-md-9 col-xs-5 videos-total-results">
- <span *ngIf="pagination.totalItems !== null">{{ pagination.totalItems }} videos</span>
-
- <my-loader [loading]="loading | async"></my-loader>
- </div>
+<div class="row">
+ <div class="content-padding">
+ <div class="videos-info">
+ <div class="col-md-9 col-xs-5 videos-total-results">
+ <span *ngIf="pagination.totalItems !== null">{{ pagination.totalItems }} videos</span>
+ <my-loader [loading]="loading | async"></my-loader>
+ </div>
- <my-video-sort class="col-md-3 col-xs-7" [currentSort]="sort" (sort)="onSort($event)"></my-video-sort>
+ <my-video-sort class="col-md-3 col-xs-7" [currentSort]="sort" (sort)="onSort($event)"></my-video-sort>
+ </div>
+ </div>
</div>
-<div class="videos-miniatures">
- <div class="col-md-12 no-video" *ngIf="isThereNoVideo()">There is no video.</div>
+<div class="content-padding videos-miniatures">
+ <div class="no-video" *ngIf="isThereNoVideo()">There is no video.</div>
<my-video-miniature
class="ng-animate"
margin-left: 0;
}
- margin-bottom: 20px;
border-bottom: 1px solid #f1f1f1;
height: 40px;
line-height: 40px;
- my-video-sort {
- padding-right: 0;
- }
-
.videos-total-results {
font-size: 13px;
- padding-left: 0;
}
my-loader {
.videos-miniatures {
min-height: 720px;
text-align: center;
+ padding-top: 0;
my-video-miniature {
text-align: left;
</span>
<a [routerLink]="['/videos/list', { field: 'author', search: video.author, sort: currentSort }]" class="video-miniature-author">{{ video.by }}</a>
- <span class="video-miniature-views-created-at">
- <span class="video-miniature-views">{{ video.views }} views</span>
- <span class="video-miniature-created-at">{{ video.createdAt | date:'short' }}</span>
- </span>
+ <span class="video-miniature-created-at">{{ video.createdAt | date:'short' }}</span>
</div>
</div>
font-weight: bold;
transition: color 0.2s;
font-size: 15px;
- color: $video-miniature-title-color;
&:hover {
text-decoration: none;
}
}
- .video-miniature-author, .video-miniature-views-created-at {
+ .video-miniature-author, .video-miniature-created-at {
display: block;
margin-left: 1px;
font-size: 11px;
color: $video-miniature-other-infos;
opacity: 0.9;
-
- .video-miniature-created-at::before {
- content: '\002022';
- margin: 0 2px 0 1px;
- }
}
.video-miniature-author {
</div>
<div class="row">
- <div class="col-md-12">
- <!-- We need the video container for videojs so we just hide it -->
- <div [hidden]="videoNotFound" class="embed-responsive embed-responsive-19by9">
- <video id="video-container" class="video-js vjs-default-skin vjs-big-play-centered"></video>
- </div>
-
- <div *ngIf="videoNotFound" id="video-not-found">Video not found :'(</div>
+ <!-- We need the video container for videojs so we just hide it -->
+ <div [hidden]="videoNotFound" class="embed-responsive embed-responsive-19by9">
+ <video id="video-container" class="video-js vjs-default-skin vjs-big-play-centered"></video>
</div>
+
+ <div *ngIf="videoNotFound" id="video-not-found">Video not found :'(</div>
</div>
<div id="torrent-info" class="row">
<div *ngIf="video !== null" id="video-info">
<div class="row video-name-views">
- <div id="video-name" class="col-md-8">
+ <div class="col-md-8 video-name">
{{ video.name }}
</div>
font-size: 18px;
height: $video-watch-title-height;
line-height: $video-watch-title-height;
- padding: 0 30px;
+
+ .video-name {
+ padding-left: $video-watch-info-padding-left;
+ }
.video-views {
text-align: right;
+ // Keep a symmetry with the video name
+ padding-right: $video-watch-info-padding-left
}
}
.video-small-block-author {
font-size: 15px;
font-weight: bold;
+ text-align: left;
+ padding-left: $video-watch-info-padding-left;
}
.video-small-block-share, .video-small-block-more {
margin-top: 30px;
.video-details-date-description {
- padding-left: 30px;
+ padding-left: $video-watch-info-padding-left;
.video-details-date {
font-weight: bold;
$header-height: 65px;
$header-border-color: #e9eff6;
-$video-miniature-title-color: #16a2b7;
+$footer-border-color: $header-border-color;
+
$video-miniature-other-infos: #686767;
$video-watch-border-color: #eceef4;
$video-watch-title-height: 90px;
$video-watch-info-color: #8e909b;
$video-watch-info-height: 120px;
+$video-watch-info-padding-left: 40px;
}
.main-col {
- padding: 0;
- .main-row {
+ .content-padding {
padding: 15px 30px;
@media screen and (min-width: 1400px) {
projects / oweals / peertube.git / commitdiff