1
0
mirror of https://github.com/bitwarden/desktop synced 2026-01-05 01:53:32 +00:00
Files
desktop/src/app/accounts/hint.component.html
Patrick H. Lauke 0396d682b1 Change links to buttons, expose aria-pressed for toggles, add aria-expanded to send view's "Options" (#1437)
* Change links to buttons, expose `aria-pressed` for toggles

- also make existing `<a routerLink...>` type controls keyboard focusable with the addition of `tabindex="0"`

* Correctly set aria-pressed

now that I have a working build environment, could verify correct way to set this with my limited Angular knowledge

* Change more links to buttons, initial style changes

* Fix layout of <button> elements with .box-content-row

* Update jslib submodule

* Add `aria-expanded` to the send view's "Show options" expand/collapse control

* Fix position of "Edit" pencil when hovering over folders

* Update jslib

* Change sends list links to buttons

* Add `aria-pressed` to vault and send list buttons

Programmatically denote which of the buttons is currently active/shown in the right-most panel

* Fix incorrect "Options" expand/collapse button in add-edit view

Currently, that buttons lacks an accName because the "Options" text is outside of it.

* Add `aria-pressed` to the send left-hand column filters

* Simplify base, list, and vault styles

Since links are now buttons, no need to double up selectors for both types of elements. No need to double-up theming in base, as this also causes incorrect "x" in toasts.

* Remove unnecessary `position:relative`

Fixes issue with cut-off focus outlines, has no other adverse effect

* Fix styling for last child of action buttons

Old approach of making right padding smaller results in unsightly, off-center icon (noticeable when focus outline is visible). This visually remains the same, but reduces right-hand margin instead.
2022-04-30 16:09:41 +02:00

32 lines
1.0 KiB
HTML

<form id="hint-page" #form (ngSubmit)="submit()" [appApiAction]="formPromise">
<div class="content">
<h1>{{ "passwordHint" | i18n }}</h1>
<div class="box last">
<div class="box-content">
<div class="box-content-row" appBoxRow>
<label for="email">{{ "emailAddress" | i18n }}</label>
<input
id="email"
type="text"
name="Email"
[(ngModel)]="email"
required
appAutofocus
appInputVerbatim
/>
</div>
</div>
<div class="box-footer">
{{ "enterEmailToGetHint" | i18n }}
</div>
</div>
<div class="buttons">
<button type="submit" class="btn primary block" [disabled]="form.loading" appBlurClick>
<b [hidden]="form.loading">{{ "submit" | i18n }}</b>
<i class="bwi bwi-spinner bwi-spin" [hidden]="!form.loading" aria-hidden="true"></i>
</button>
<a role="button" tabindex="0" routerLink="/login" class="btn block">{{ "cancel" | i18n }}</a>
</div>
</div>
</form>