trustchain-oc1-orchestral/authentik
Archived
10
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

web/elements: use dedicated button for search clear instead of webkit exclusive one

Browse source 
closes #1499

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer 2021-09-29 21:47:38 +02:00
parent a2f3c54c2a
commit e4898f4b92
1 changed files with 24 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
web/src/elements/table/TableSearch.ts
View file

@ -1,6 +1,6 @@
import { t } from "@lingui/macro";
import { CSSResult, html, LitElement, TemplateResult } from "lit";
import { css, CSSResult, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators";
import { ifDefined } from "lit/directives/if-defined";
@ -20,7 +20,19 @@ export class TableSearch extends LitElement {
onSearch?: (value: string) => void;
static get styles(): CSSResult[] {
return [PFBase, PFButton, PFToolbar, PFInputGroup, PFFormControl, AKGlobal];
return [
PFBase,
PFButton,
PFToolbar,
PFInputGroup,
PFFormControl,
AKGlobal,
css`
::-webkit-search-cancel-button {
display: none;
}
`,
];
}
render(): TemplateResult {
@ -50,6 +62,16 @@ export class TableSearch extends LitElement {
this.onSearch((ev.target as HTMLInputElement).value);
}}
/>
<button
class="pf-c-button pf-m-control"
type="reset"
@click=${() => {
if (!this.onSearch) return;
this.onSearch("");
}}
>
<i class="fas fa-times" aria-hidden="true"></i>
</button>
<button class="pf-c-button pf-m-control" type="submit">
<i class="fas fa-search" aria-hidden="true"></i>
</button>