]> git.immae.eu Git - github/Chocobozzz/PeerTube.git/blob - client/src/app/login/login.component.html
Add likes/dislikes counts in the buttons
[github/Chocobozzz/PeerTube.git] / client / src / app / login / login.component.html
1 <div class="margin-content">
2 <div i18n class="title-page title-page-single">
3 Login
4 </div>
5
6 <div *ngIf="error" class="alert alert-danger">{{ error }}
7 <span *ngIf="error === 'User email is not verified.'"> <a i18n routerLink="/verify-account/ask-send-email">Request new verification email.</a></span>
8 </div>
9
10 <form role="form" (ngSubmit)="login()" [formGroup]="form">
11 <div class="form-group">
12 <div>
13 <label i18n for="username">User</label>
14 <input
15 type="text" id="username" i18n-placeholder placeholder="Username or email address" required tabindex="1"
16 formControlName="username" [ngClass]="{ 'input-error': formErrors['username'] }" #emailInput
17 >
18 <a i18n *ngIf="signupAllowed === true" routerLink="/signup" class="create-an-account">
19 or create an account
20 </a>
21
22 <a i18n *ngIf="signupAllowed === false" href="https://joinpeertube.org/instances#instances-list" target="_blank" title="Click here to see a list of instances where to register" class="create-an-account">
23 or create an account on another instance
24 </a>
25
26 <my-help *ngIf="signupAllowed === false">
27 <ng-template ptTemplate="customHtml">
28 <ng-container i18n>User registration is not allowed on this instance, but you can register on many others!</ng-container>
29 </ng-template>
30 </my-help>
31 </div>
32
33 <div *ngIf="formErrors.username" class="form-error">
34 {{ formErrors.username }}
35 </div>
36 </div>
37
38 <div class="form-group">
39 <label i18n for="password">Password</label>
40 <div>
41 <input
42 type="password" name="password" id="password" i18n-placeholder placeholder="Password" required tabindex="2"
43 formControlName="password" [ngClass]="{ 'input-error': formErrors['password'] }"
44 >
45 <a i18n class="forgot-password-button" (click)="openForgotPasswordModal()" title="Click here to reset your password">I forgot my password</a>
46 </div>
47 <div *ngIf="formErrors.password" class="form-error">
48 {{ formErrors.password }}
49 </div>
50 </div>
51
52 <input type="submit" i18n-value value="Login" [disabled]="!form.valid">
53 </form>
54 </div>
55
56 <ng-template #forgotPasswordModal>
57 <div class="modal-header">
58 <h4 i18n class="modal-title">Forgot your password</h4>
59
60 <my-global-icon iconName="cross" aria-label="Close" role="button" (click)="hideForgotPasswordModal()"></my-global-icon>
61 </div>
62
63 <div class="modal-body">
64
65 <div *ngIf="isEmailDisabled()" class="alert alert-danger" i18n>
66 We are sorry, you cannot recover your password because your instance administrator did not configure the PeerTube email system.
67 </div>
68
69 <div class="form-group" [hidden]="isEmailDisabled()">
70 <label i18n for="forgot-password-email">Email</label>
71 <input
72 type="email" id="forgot-password-email" i18n-placeholder placeholder="Email address" required
73 [(ngModel)]="forgotPasswordEmail" #forgotPasswordEmailInput
74 >
75 </div>
76 </div>
77
78 <div class="modal-footer inputs">
79 <span i18n class="action-button action-button-cancel" (click)="hideForgotPasswordModal()">Cancel</span>
80
81 <input
82 type="submit" i18n-value value="Send me an email to reset my password" class="action-button-submit"
83 (click)="askResetPassword()" [disabled]="!forgotPasswordEmailInput.validity.valid"
84 >
85 </div>
86 </ng-template>