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

expand search input and use textarea for multiline

Browse source 
Signed-off-by: Jens Langhammer <jens@goauthentik.io>
This commit is contained in:
Jens Langhammer 2023-11-23 15:18:47 +01:00
parent 8937c0b63b
commit df81499054
No known key found for this signature in database
2 changed files with 14 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
web/src/elements/table/Table.ts
View file

@ -162,6 +162,12 @@ export abstract class Table<T> extends AKElement {
PFDropdown, PFDropdown,
PFPagination, PFPagination,
css` css`
.pf-c-toolbar__group.pf-m-search-filter {
flex-grow: 1;
}
ak-table-search {
width: 100% !important;
}
.pf-c-table thead .pf-c-table__check { .pf-c-table thead .pf-c-table__check {
min-width: 3rem; min-width: 3rem;
} }

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

@ -30,6 +30,9 @@ export class TableSearch extends AKElement {
::-webkit-search-cancel-button { ::-webkit-search-cancel-button {
display: none; display: none;
} }
.pf-c-form-control {
font-family: monospace;
}
`, `,
]; ];
} }
@ -41,23 +44,22 @@ export class TableSearch extends AKElement {
@submit=${(e: Event) => { @submit=${(e: Event) => {
e.preventDefault(); e.preventDefault();
if (!this.onSearch) return; if (!this.onSearch) return;
const el = this.shadowRoot?.querySelector<HTMLInputElement>("input[type=search]"); const el = this.shadowRoot?.querySelector<HTMLInputElement>("[name=search]");
if (!el) return; if (!el) return;
if (el.value === "") return; if (el.value === "") return;
this.onSearch(el?.value); this.onSearch(el?.value);
}} }}
> >
<input <textarea
class="pf-c-form-control" class="pf-c-form-control"
name="search" name="search"
type="search"
placeholder=${msg("Search...")} placeholder=${msg("Search...")}
value="${ifDefined(this.value)}" spellcheck="false"
@search=${(ev: Event) => { @submit=${(ev: Event) => {
if (!this.onSearch) return; if (!this.onSearch) return;
this.onSearch((ev.target as HTMLInputElement).value); this.onSearch((ev.target as HTMLInputElement).value);
}} }}
/> >${ifDefined(this.value)}</textarea>
<button <button
class="pf-c-button pf-m-control" class="pf-c-button pf-m-control"
type="reset" type="reset"