style fixes on add/edit lists

This commit is contained in:
Kyle Spearrin 2018-06-09 00:39:14 -04:00
parent 8f258a2d05
commit fbc756c6e3
2 changed files with 42 additions and 40 deletions

View File

@ -45,6 +45,7 @@ import { FallbackSrcDirective } from 'jslib/angular/directives/fallback-src.dire
import { InputVerbatimDirective } from 'jslib/angular/directives/input-verbatim.directive'; import { InputVerbatimDirective } from 'jslib/angular/directives/input-verbatim.directive';
import { StopClickDirective } from 'jslib/angular/directives/stop-click.directive'; import { StopClickDirective } from 'jslib/angular/directives/stop-click.directive';
import { StopPropDirective } from 'jslib/angular/directives/stop-prop.directive'; import { StopPropDirective } from 'jslib/angular/directives/stop-prop.directive';
import { TrueFalseValueDirective } from 'jslib/angular/directives/true-false-value.directive';
import { I18nPipe } from 'jslib/angular/pipes/i18n.pipe'; import { I18nPipe } from 'jslib/angular/pipes/i18n.pipe';
import { SearchCiphersPipe } from 'jslib/angular/pipes/search-ciphers.pipe'; import { SearchCiphersPipe } from 'jslib/angular/pipes/search-ciphers.pipe';
@ -90,6 +91,7 @@ import { Folder } from 'jslib/models/domain';
SearchCiphersPipe, SearchCiphersPipe,
StopClickDirective, StopClickDirective,
StopPropDirective, StopPropDirective,
TrueFalseValueDirective,
TwoFactorComponent, TwoFactorComponent,
TwoFactorOptionsComponent, TwoFactorOptionsComponent,
UserLayoutComponent, UserLayoutComponent,

View File

@ -96,21 +96,20 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-4 form-group"> <div class="col-5 form-group">
<label for="loginUriMatch{{i}}"> <label for="loginUriMatch{{i}}">
{{'matchDetection' | i18n}} {{'matchDetection' | i18n}}
</label> </label>
<div class="d-flex">
<select class="form-control" id="loginUriMatch{{i}}" name="Login.Uris[{{i}}].Match" [(ngModel)]="u.match" (change)="loginUriMatchChanged(u)"> <select class="form-control" id="loginUriMatch{{i}}" name="Login.Uris[{{i}}].Match" [(ngModel)]="u.match" (change)="loginUriMatchChanged(u)">
<option *ngFor="let o of uriMatchOptions" [ngValue]="o.value">{{o.name}}</option> <option *ngFor="let o of uriMatchOptions" [ngValue]="o.value">{{o.name}}</option>
</select> </select>
</div> <button class="btn btn-link text-danger ml-2" (click)="removeUri(u)" title="{{'remove' | i18n}}">
<div class="col-1">
<label class="invisible">&nbsp;</label>
<button class="btn btn-link text-danger" (click)="removeUri(u)" title="{{'remove' | i18n}}">
<i class="fa fa-minus-circle fa-lg"></i> <i class="fa fa-minus-circle fa-lg"></i>
</button> </button>
</div> </div>
</div> </div>
</div>
</ng-container> </ng-container>
<a href="#" appStopClick appBlurClick (click)="addUri()" class="d-inline-block mb-3"> <a href="#" appStopClick appBlurClick (click)="addUri()" class="d-inline-block mb-3">
<i class="fa fa-plus-circle fa-fw"></i> {{'newUri' | i18n}} <i class="fa fa-plus-circle fa-fw"></i> {{'newUri' | i18n}}
@ -271,12 +270,13 @@
<h3 class="mt-4">{{'customFields' | i18n}}</h3> <h3 class="mt-4">{{'customFields' | i18n}}</h3>
<ng-container *ngIf="cipher.hasFields"> <ng-container *ngIf="cipher.hasFields">
<div class="row" appBoxRow *ngFor="let f of cipher.fields; let i = index"> <div class="row" appBoxRow *ngFor="let f of cipher.fields; let i = index">
<div class="col-4 form-group"> <div class="col-5 form-group">
<label for="fieldName{{i}}">{{'name' | i18n}}</label> <label for="fieldName{{i}}">{{'name' | i18n}}</label>
<input id="fieldName{{i}}" type="text" name="Field.Name{{i}}" [(ngModel)]="f.name" class="form-control"> <input id="fieldName{{i}}" type="text" name="Field.Name{{i}}" [(ngModel)]="f.name" class="form-control">
</div> </div>
<div class="col-6 form-group"> <div class="col-7 form-group">
<label for="fieldValue{{i}}">{{'value' | i18n}}</label> <label for="fieldValue{{i}}">{{'value' | i18n}}</label>
<div class="d-flex align-items-center">
<div class="input-group" *ngIf="f.type === fieldType.Text"> <div class="input-group" *ngIf="f.type === fieldType.Text">
<input id="fieldValue{{i}}" class="form-control" type="text" name="Field.Value{{i}}" [(ngModel)]="f.value"> <input id="fieldValue{{i}}" class="form-control" type="text" name="Field.Value{{i}}" [(ngModel)]="f.value">
<div class="input-group-append"> <div class="input-group-append">
@ -299,22 +299,22 @@
</button> </button>
</div> </div>
</div> </div>
<div class="flex-fill">
<input id="fieldValue{{i}}" name="Field.Value{{i}}" type="checkbox" [(ngModel)]="f.value" *ngIf="f.type === fieldType.Boolean" <input id="fieldValue{{i}}" name="Field.Value{{i}}" type="checkbox" [(ngModel)]="f.value" *ngIf="f.type === fieldType.Boolean"
appTrueFalseValue trueValue="true" falseValue="false"> appTrueFalseValue trueValue="true" falseValue="false">
</div> </div>
<div class="col-1"> <button class="btn btn-link text-danger ml-2" (click)="removeField(f)" title="{{'remove' | i18n}}">
<label class="invisible">&nbsp;</label>
<button class="btn btn-link text-danger" (click)="removeField(f)" title="{{'remove' | i18n}}">
<i class="fa fa-minus-circle fa-lg"></i> <i class="fa fa-minus-circle fa-lg"></i>
</button> </button>
</div> </div>
</div> </div>
</div>
</ng-container> </ng-container>
<a href="#" appStopClick appBlurClick (click)="addField()" class="d-inline-block mb-2"> <a href="#" appStopClick appBlurClick (click)="addField()" class="d-inline-block mb-2">
<i class="fa fa-plus-circle fa-fw"></i> {{'newCustomField' | i18n}} <i class="fa fa-plus-circle fa-fw"></i> {{'newCustomField' | i18n}}
</a> </a>
<div class="row"> <div class="row">
<div class="col-4"> <div class="col-5">
<label for="addFieldType" class="sr-only">{{'type' | i18n}}</label> <label for="addFieldType" class="sr-only">{{'type' | i18n}}</label>
<select id="addFieldType" class="form-control" name="AddFieldType" [(ngModel)]="addFieldType"> <select id="addFieldType" class="form-control" name="AddFieldType" [(ngModel)]="addFieldType">
<option *ngFor="let o of addFieldTypeOptions" [ngValue]="o.value">{{o.name}}</option> <option *ngFor="let o of addFieldTypeOptions" [ngValue]="o.value">{{o.name}}</option>