mirror of
https://github.com/bitwarden/browser.git
synced 2024-09-12 01:48:21 +02:00
Feature/use hcaptcha if bot (#1000)
* Add captcha to login component * Add catpcha to login page * Update content width if captcha is visible * extend submit to handle widening if captcha is required * Improve login styling * Add Captcha to registration page * Remove padding from captcha div The padding was messing up image selection of captcha items * Update jslib * PR review * update jslib
This commit is contained in:
parent
d7287e7aa3
commit
c863d68057
2
jslib
2
jslib
@ -1 +1 @@
|
|||||||
Subproject commit 58be5796b0c2b19aacf52d4a1c179aeb80924443
|
Subproject commit c77441b35348c821af7fd6261b6dc72732d5ebad
|
@ -1,5 +1,5 @@
|
|||||||
<form id="login-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise" attr.aria-hidden="{{showingModal}}">
|
<form id="login-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise" attr.aria-hidden="{{showingModal}}">
|
||||||
<div class="content">
|
<div id="content" class="content">
|
||||||
<img class="logo-image" alt="Bitwarden">
|
<img class="logo-image" alt="Bitwarden">
|
||||||
<p class="lead">{{'loginOrCreateNewAccount' | i18n}}</p>
|
<p class="lead">{{'loginOrCreateNewAccount' | i18n}}</p>
|
||||||
<div class="box last">
|
<div class="box last">
|
||||||
@ -22,6 +22,9 @@
|
|||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="box-content-row" [hidden]="!showCaptcha()">
|
||||||
|
<iframe id="hcaptcha_iframe" height="80"></iframe>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -106,4 +106,12 @@ export class LoginComponent extends BaseLoginComponent implements OnDestroy {
|
|||||||
onWindowHidden() {
|
onWindowHidden() {
|
||||||
this.showPassword = false;
|
this.showPassword = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async submit() {
|
||||||
|
await super.submit();
|
||||||
|
if (this.captchaSiteKey) {
|
||||||
|
const content = document.getElementById('content') as HTMLDivElement;
|
||||||
|
content.setAttribute('style', 'width:335px');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -61,6 +61,9 @@
|
|||||||
<label for="hint">{{'masterPassHint' | i18n}}</label>
|
<label for="hint">{{'masterPassHint' | i18n}}</label>
|
||||||
<input id="hint" type="text" name="Hint" [(ngModel)]="hint">
|
<input id="hint" type="text" name="Hint" [(ngModel)]="hint">
|
||||||
</div>
|
</div>
|
||||||
|
<div class="box-content-row" [hidden]="!showCaptcha()">
|
||||||
|
<iframe id="hcaptcha_iframe" height="80"></iframe>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="box-footer">
|
<div class="box-footer">
|
||||||
{{'masterPassHintDesc' | i18n}}
|
{{'masterPassHintDesc' | i18n}}
|
||||||
|
@ -9,6 +9,7 @@ import { Router } from '@angular/router';
|
|||||||
import { ApiService } from 'jslib-common/abstractions/api.service';
|
import { ApiService } from 'jslib-common/abstractions/api.service';
|
||||||
import { AuthService } from 'jslib-common/abstractions/auth.service';
|
import { AuthService } from 'jslib-common/abstractions/auth.service';
|
||||||
import { CryptoService } from 'jslib-common/abstractions/crypto.service';
|
import { CryptoService } from 'jslib-common/abstractions/crypto.service';
|
||||||
|
import { EnvironmentService } from 'jslib-common/abstractions/environment.service';
|
||||||
import { I18nService } from 'jslib-common/abstractions/i18n.service';
|
import { I18nService } from 'jslib-common/abstractions/i18n.service';
|
||||||
import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
|
import { PasswordGenerationService } from 'jslib-common/abstractions/passwordGeneration.service';
|
||||||
import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
|
import { PlatformUtilsService } from 'jslib-common/abstractions/platformUtils.service';
|
||||||
@ -29,9 +30,10 @@ export class RegisterComponent extends BaseRegisterComponent implements OnInit,
|
|||||||
i18nService: I18nService, cryptoService: CryptoService,
|
i18nService: I18nService, cryptoService: CryptoService,
|
||||||
apiService: ApiService, stateService: StateService,
|
apiService: ApiService, stateService: StateService,
|
||||||
platformUtilsService: PlatformUtilsService, passwordGenerationService: PasswordGenerationService,
|
platformUtilsService: PlatformUtilsService, passwordGenerationService: PasswordGenerationService,
|
||||||
private broadcasterService: BroadcasterService, private ngZone: NgZone) {
|
environmentService: EnvironmentService, private broadcasterService: BroadcasterService,
|
||||||
|
private ngZone: NgZone) {
|
||||||
super(authService, router, i18nService, cryptoService, apiService, stateService, platformUtilsService,
|
super(authService, router, i18nService, cryptoService, apiService, stateService, platformUtilsService,
|
||||||
passwordGenerationService);
|
passwordGenerationService, environmentService);
|
||||||
}
|
}
|
||||||
|
|
||||||
async ngOnInit() {
|
async ngOnInit() {
|
||||||
@ -45,6 +47,8 @@ export class RegisterComponent extends BaseRegisterComponent implements OnInit,
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
super.ngOnInit();
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnDestroy() {
|
ngOnDestroy() {
|
||||||
|
@ -225,6 +225,12 @@ p.lead {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#hcaptcha_iframe {
|
||||||
|
width: 100%;
|
||||||
|
border: none;
|
||||||
|
transition: height 0.25s linear;
|
||||||
|
}
|
||||||
|
|
||||||
form, .form {
|
form, .form {
|
||||||
.form-group {
|
.form-group {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
@ -42,6 +42,7 @@
|
|||||||
#login-page, #register-page, #hint-page, #two-factor-page, #lock-page {
|
#login-page, #register-page, #hint-page, #two-factor-page, #lock-page {
|
||||||
.content {
|
.content {
|
||||||
width: 300px;
|
width: 300px;
|
||||||
|
transition: width 0.25s linear;
|
||||||
|
|
||||||
p {
|
p {
|
||||||
text-align: center
|
text-align: center
|
||||||
|
Loading…
Reference in New Issue
Block a user