Merge pull request #1435 from jsit/fix/1417-communities-search-layout

fix: Fix Communities search/filter header #1417
This commit is contained in:
Dessalines 2023-06-21 08:20:39 -04:00 committed by GitHub
commit f19271eba9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -100,19 +100,17 @@ export class Communities extends Component<any, CommunitiesState> {
const { listingType, page } = this.getCommunitiesQueryParams(); const { listingType, page } = this.getCommunitiesQueryParams();
return ( return (
<div> <div>
<div className="row"> <h1 className="h4">{i18n.t("list_of_communities")}</h1>
<div className="col-md-6"> <div className="row g-2 justify-content-between">
<h4>{i18n.t("list_of_communities")}</h4> <div className="col-auto">
<span className="mb-2">
<ListingTypeSelect <ListingTypeSelect
type_={listingType} type_={listingType}
showLocal={showLocal(this.isoData)} showLocal={showLocal(this.isoData)}
showSubscribed showSubscribed
onChange={this.handleListingTypeChange} onChange={this.handleListingTypeChange}
/> />
</span>
</div> </div>
<div className="col-md-6">{this.searchForm()}</div> <div className="col-auto">{this.searchForm()}</div>
</div> </div>
<div className="table-responsive"> <div className="table-responsive">
@ -220,14 +218,14 @@ export class Communities extends Component<any, CommunitiesState> {
searchForm() { searchForm() {
return ( return (
<form <form
className="row justify-content-end" className="row mb-2"
onSubmit={linkEvent(this, this.handleSearchSubmit)} onSubmit={linkEvent(this, this.handleSearchSubmit)}
> >
<div className="col-auto"> <div className="col-auto">
<input <input
type="text" type="text"
id="communities-search" id="communities-search"
className="form-control me-2 mb-2" className="form-control"
value={this.state.searchText} value={this.state.searchText}
placeholder={`${i18n.t("search")}...`} placeholder={`${i18n.t("search")}...`}
onInput={linkEvent(this, this.handleSearchChange)} onInput={linkEvent(this, this.handleSearchChange)}
@ -239,7 +237,7 @@ export class Communities extends Component<any, CommunitiesState> {
<label className="visually-hidden" htmlFor="communities-search"> <label className="visually-hidden" htmlFor="communities-search">
{i18n.t("search")} {i18n.t("search")}
</label> </label>
<button type="submit" className="btn btn-secondary mb-2"> <button type="submit" className="btn btn-secondary">
<span>{i18n.t("search")}</span> <span>{i18n.t("search")}</span>
</button> </button>
</div> </div>