Fixed up the reset password pages and some small tweaks

pull/4116/head v4.0.1277
tidusjar 4 years ago
parent 4c571101c7
commit 6955c59680

@ -1,21 +1,32 @@
<!--
you can substitue the span of reauth email for a input with the email and
include the remember me checkbox
-->
<div *ngIf="form && customizationSettings && background">
<div class="bg" [style.background-image]="background"></div>
<div class="container" id="login">
<div class="card card-container">
<!-- <img class="profile-img-card" src="//lh3.googleusercontent.com/-6V8xOA6M7BA/AAAAAAAAAAI/AAAAAAAAAAA/rzlHcD0KYwo/photo.jpg?sz=120" alt="" /> -->
<div *ngIf="!customizationSettings.logo"><img id="profile-img" class="profile-img-card" src="{{baseUrl}}/images/logo.png" /></div>
<div *ngIf="customizationSettings.logo"><img id="profile-img" class="center" [src]="customizationSettings.logo" /></div>
<p id="profile-name" class="profile-name-card"></p>

<div *ngIf="background" @fadeInOut class="bg" [style.background-image]="background">
<div class="login-gradient-bar">
</div>
</div>
<div class="small-middle-container">
<div *ngIf="form && customizationSettings">
<mat-card class="mat-elevation-z8 top-margin login-card">
<H1 *ngIf="!customizationSettings.logo && !customizationSettings.applicationName" class="login_logo">OMBI</H1>
<H1 *ngIf="customizationSettings.applicationName && !customizationSettings.logo" [ngClass]="{'bigText': customizationSettings.applicationName.length >= 7 && customizationSettings.applicationName.length < 14, 'hugeText': customizationSettings.applicationName.length >= 14 }" class="login_logo custom">{{customizationSettings.applicationName}}</H1>
<img mat-card-image *ngIf="customizationSettings.logo" [src]="customizationSettings.logo">
<mat-card-content id="login-box">
<form class="form-signin" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
<form class="form-signin" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
<input type="email" id="inputEmail" class="form-control" formControlName="email" [attr.placeholder]="'PasswordReset.EmailAddressPlaceholder' | translate" autofocus>
<button class="btn btn-success-outline" [disabled]="form.invalid" type="submit" [translate]="'PasswordReset.ResetPasswordButton'"></button>
</form><!-- /form -->
</div><!-- /card-container -->
</div><!-- /container -->
</div>
<mat-form-field class="dark full-width" appearance="outline">
<mat-label>{{'PasswordReset.EmailAddressPlaceholder' | translate}}</mat-label>
<input type="email" id="username-field" matInput formControlName="email" autofocus/>
<mat-error id="username-error" *ngIf="form.get('email').hasError('required')">
{{'PasswordReset.EmailAddressPlaceholder' | translate}} is <strong>required</strong></mat-error>
</mat-form-field>
<button id="reset" mat-raised-button color="accent" type="submit">{{'PasswordReset.ResetPasswordButton' | translate}}</button>
</form>
</mat-card-content>
</mat-card>
</div>
</div>

@ -2,12 +2,14 @@
import { Component, OnInit, Inject } from "@angular/core";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { DomSanitizer } from "@angular/platform-browser";
import { fadeInOutAnimation } from "../animations/fadeinout";
import { ICustomizationSettings } from "../interfaces";
import { IdentityService, ImageService, NotificationService, SettingsService } from "../services";
@Component({
templateUrl: "./resetpassword.component.html",
animations: [fadeInOutAnimation],
styleUrls: ["./login.component.scss"],
})
export class ResetPasswordComponent implements OnInit {

@ -1,30 +1,56 @@
<div *ngIf="form && customizationSettings">
<div class="bg" [style.background-image]="background"></div>
<div class="container" id="login">
<div class="card card-container">
<!-- <img class="profile-img-card" src="//lh3.googleusercontent.com/-6V8xOA6M7BA/AAAAAAAAAAI/AAAAAAAAAAA/rzlHcD0KYwo/photo.jpg?sz=120" alt="" /> -->
<div *ngIf="!customizationSettings.logo"><img id="profile-img" class="profile-img-card" src="{{baseUrl}}/images/logo.png" /></div>
<div *ngIf="customizationSettings.logo"><img id="profile-img" class="center" [src]="customizationSettings.logo" /></div>
<p id="profile-name" class="profile-name-card"></p>

<div *ngIf="background" @fadeInOut class="bg" [style.background-image]="background">
<div class="login-gradient-bar">
</div>
</div>
<div class="small-middle-container">
<div *ngIf="form && customizationSettings">
<mat-card class="mat-elevation-z8 top-margin login-card">
<H1 *ngIf="!customizationSettings.logo && !customizationSettings.applicationName" class="login_logo">OMBI</H1>
<H1 *ngIf="customizationSettings.applicationName && !customizationSettings.logo" [ngClass]="{'bigText': customizationSettings.applicationName.length >= 7 && customizationSettings.applicationName.length < 14, 'hugeText': customizationSettings.applicationName.length >= 14 }" class="login_logo custom">{{customizationSettings.applicationName}}</H1>
<img mat-card-image *ngIf="customizationSettings.logo" [src]="customizationSettings.logo">
<mat-card-content id="login-box">
<div *ngIf="form.value.password !== form.value.confirmPassword" class="alert alert-danger">The passwords do not match</div>
<div *ngIf="form.invalid && form.dirty" class="alert alert-danger">
<div *ngIf="form.get('password').hasError('required')">The Password is required</div>
<div *ngIf="form.get('email').hasError('required')">The Email is required</div>
<div *ngIf="form.get('confirmPassword').hasError('required')">The Confirm Password is required</div>
</div>
<form class="form-signin" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
<mat-form-field class="dark full-width" appearance="outline">
<mat-label>{{'PasswordReset.EmailAddressPlaceholder' | translate}}</mat-label>
<input type="email" id="username-field" matInput formControlName="email" autofocus/>
<mat-error id="username-error" *ngIf="form.get('email').hasError('required')">
{{'PasswordReset.EmailAddressPlaceholder' | translate}} is <strong>required</strong></mat-error>
</mat-form-field>
<div *ngIf="form.value.password !== form.value.confirmPassword" class="alert alert-danger">The passwords do not match</div>
<div *ngIf="form.invalid && form.dirty" class="alert alert-danger">
<mat-form-field class="dark full-width" appearance="outline">
<mat-label>New Password</mat-label>
<input type="password" id="username-field" matInput formControlName="password" autofocus/>
<mat-error id="username-error" *ngIf="form.get('password').hasError('required')">
Password is <strong>required</strong></mat-error>
</mat-form-field>
<div *ngIf="form.get('password').hasError('required')">The Password is required</div>
<div *ngIf="form.get('email').hasError('required')">The Email is required</div>
<div *ngIf="form.get('confirmPassword').hasError('required')">The Confirm Password is required</div>
</div>
<mat-form-field class="dark full-width" appearance="outline">
<mat-label>Confirm Password</mat-label>
<input type="password" id="username-field" matInput formControlName="confirmPassword" autofocus/>
<mat-error id="username-error" *ngIf="form.get('confirmPassword').hasError('required')">
Password is <strong>required</strong></mat-error>
</mat-form-field>
<form class="form-signin" novalidate [formGroup]="form" (ngSubmit)="onSubmit(form)">
<input type="email" id="inputEmail" class="form-control" formControlName="email" placeholder="Email Address" autofocus>
<input type="password" class="form-control" formControlName="password" placeholder="New Password">
<input type="password" class="form-control" formControlName="confirmPassword" placeholder="Confirm New Password">
<button class="btn btn-success-outline" [disabled]="form.invalid" type="submit">Reset Password</button>
<button id="reset" mat-raised-button color="accent" [disabled]="form.invalid" type="submit">{{'Reset Password' | translate}}</button>
</form>
</mat-card-content>
</form>
</mat-card>
</div>
<!-- /card-container -->
</div>
<!-- /container -->
</div>

@ -1,6 +1,5 @@
<h1 mat-dialog-title>
Advanced Options</h1>
<h1 mat-dialog-title><i class="fas fa-sliders-h"></i> {{'MediaDetails.AdvancedOptions' | translate }}</h1>
<hr>
<div mat-dialog-content>
<mat-form-field appearance="outline" floatLabel=auto>
<mat-label>{{'MediaDetails.QualityProfilesSelect' | translate }}</mat-label>
@ -18,6 +17,6 @@
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-button [mat-dialog-close]="" cdkFocusInitial>Close</button>
<button mat-button [mat-dialog-close]="data" cdkFocusInitial>Save</button>
<button mat-button [mat-dialog-close]="" cdkFocusInitial color="warn"><i class="fas fa-times"></i> {{ 'Common.Cancel' | translate }}</button>
<button mat-button [mat-dialog-close]="data" cdkFocusInitial color="accent"><i class="fas fa-plus"></i> {{ 'Common.Submit' | translate }}</button>
</div>

@ -1,7 +1,10 @@
<h1 mat-dialog-title>
Advanced Options</h1>
<h1 mat-dialog-title><i class="fas fa-sliders-h"></i> {{'MediaDetails.AdvancedOptions' | translate }}</h1>
<div mat-dialog-content>
<hr />
<div class="alert alert-info" role="alert">
<i class="fas fa-x7 fa-exclamation-triangle glyphicon"></i>
<span>{{'MediaDetails.AutoApproveOptionsTvShort' | translate }}</span>
</div>
<mat-form-field>
<mat-label>{{'MediaDetails.QualityProfilesSelect' | translate }}</mat-label>
<mat-select [(value)]="data.profileId">
@ -18,6 +21,6 @@
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-raised-button [mat-dialog-close]="" color="warn">Close</button>
<button mat-raised-button [mat-dialog-close]="data" color="accent" cdkFocusInitial>Save</button>
<button mat-raised-button [mat-dialog-close]="" color="warn"><i class="fas fa-times"></i> {{ 'Common.Cancel' | translate }}</button>
<button mat-raised-button [mat-dialog-close]="data" color="accent" cdkFocusInitial><i class="fas fa-plus"></i> {{ 'Common.Submit' | translate }}</button>
</div>

@ -254,6 +254,7 @@
"AdvancedOptions":"Advanced Options",
"AutoApproveOptions":"You can configure the request here, once requested it will be send to your DVR application and will be auto approved!",
"AutoApproveOptionsTv":"You can configure the request here, once requested it will be send to your DVR application and will be auto approved! If the request is already in Sonarr, we will not change the root folder or quality profile if you set it!",
"AutoApproveOptionsTvShort":"You can configure the request here, once requested it will be send to your DVR application! If the request is already in Sonarr, we will not change the root folder or quality profile if you set it!",
"QualityProfilesSelect":"Select A Quality Profile",
"RootFolderSelect":"Select A Root Folder",
"Status":"Status",

Loading…
Cancel
Save