Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-23 11:56:00 +01:00
Code Issues Projects Releases Wiki Activity

password generator options toggle

Browse Source
This commit is contained in:
Kyle Spearrin 2018-01-31 21:13:42 -05:00
parent e52b104a72
commit 06106e1775
5 changed files with 24 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/app/vault/password-generator.component.html
View File

@ -17,9 +17,13 @@
</div> </div>
<div class="box"> <div class="box">
<div class="box-header"> <div class="box-header">
{{'options' | i18n}} <button type="button" (click)="toggleOptions()">
<i class="fa fa-plus-square-o" [hidden]="showOptions"></i>
<i class="fa fa-minus-square-o" [hidden]="!showOptions"></i>
{{'options' | i18n}}
</button>
</div> </div>
<div class="box-content condensed"> <div class="box-content condensed" *ngIf="showOptions">
<div class="box-content-row box-content-row-slider" appBoxRow> <div class="box-content-row box-content-row-slider" appBoxRow>
<label for="length">{{'length' | i18n}}</label> <label for="length">{{'length' | i18n}}</label>
<span>{{options.length}}</span> <span>{{options.length}}</span>
@ -47,7 +51,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="box"> <div class="box" *ngIf="showOptions">
<div class="box-content condensed"> <div class="box-content condensed">
<div class="box-content-row box-content-row-input" appBoxRow> <div class="box-content-row box-content-row-input" appBoxRow>
<label for="min-number">{{'minNumbers' | i18n}}</label> <label for="min-number">{{'minNumbers' | i18n}}</label>
@ -68,8 +72,9 @@
</div> </div>
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="primary" appBlurClick *ngIf="showSelect" (click)="select()"> <button type="button" class="primary" appBlurClick *ngIf="showSelect" (click)="select()"
<i class="fa fa-lg fa-check"></i> {{'select' | i18n}} title="{{'select' | i18n}}">
<i class="fa fa-lg fa-fw fa-check"></i>
</button> </button>
<button type="button" data-dismiss="modal">{{'close' | i18n}}</button> <button type="button" data-dismiss="modal">{{'close' | i18n}}</button>
</div> </div>

5
src/app/vault/password-generator.component.ts
View File

@ -24,6 +24,7 @@ export class PasswordGeneratorComponent implements OnInit {
options: any = {}; options: any = {};
password: string = '-'; password: string = '-';
showOptions = false;
constructor(private passwordGenerationService: PasswordGenerationService, private analytics: Angulartics2, constructor(private passwordGenerationService: PasswordGenerationService, private analytics: Angulartics2,
private utilsService: UtilsService) { } private utilsService: UtilsService) { }
@ -89,4 +90,8 @@ export class PasswordGeneratorComponent implements OnInit {
this.analytics.eventTrack.next({ action: 'Selected Generated Password' }); this.analytics.eventTrack.next({ action: 'Selected Generated Password' });
this.onSelected.emit(this.password); this.onSelected.emit(this.password);
} }
toggleOptions() {
this.showOptions = !this.showOptions;
}
} }

1
src/scss/base.scss
View File

@ -44,6 +44,7 @@ input, select, textarea, button {
button { button {
white-space: nowrap; white-space: nowrap;
cursor: pointer;
} }
textarea { textarea {

7
src/scss/box.scss
View File

@ -7,6 +7,13 @@
margin: 0 10px 5px 10px; margin: 0 10px 5px 10px;
color: $gray-light; color: $gray-light;
text-transform: uppercase; text-transform: uppercase;
button {
background-color: transparent;
border: none;
color: $gray-light;
text-transform: uppercase;
}
} }
.box-content { .box-content {

1
src/scss/buttons.scss
View File

@ -9,6 +9,7 @@
color: $button-color; color: $button-color;
white-space: nowrap; white-space: nowrap;
text-align: center; text-align: center;
cursor: pointer;
&:hover:not([disabled]), &:focus:not([disabled]) { &:hover:not([disabled]), &:focus:not([disabled]) {
cursor: pointer; cursor: pointer;