chore: search input padding right to much

[datlechin]

Fixes #0000

Changes proposed in this pull request:

Reviewers should focus on:

Screenshot

Necessity

• Has the problem that is being solved here been clearly explained?
• If applicable, have various options for solving this problem been considered?
• For core PRs, does this need to be in core, or could it be in an extension?
• Are we willing to maintain this for years / potentially forever?

Confirmed

• Frontend changes: tested on a local Flarum installation.
• Backend changes: tests are green (run composer test).
• Core developer confirmed locally this works as intended.
• Tests have been added, or are not appropriate here.

Required changes:

• Related documentation PR: (Remove if irrelevant)
• Related core extension PRs: (Remove if irrelevant)

[davwheat]

I believe this was done to house the "clear" button. Could we move that button into the padding area instead of removing the padding?

[datlechin]

@davwheat the 'clear' button created by browser. see the search input in the front

[davwheat]

With the frontend forum search, a .Search-clear button appears created by Flarum itself

This is the reason we have the right padding. In reality, we should remove the .Search-input class from the users list search instead, since it doesn't use the Search component, but this will remove the search icon and such from it.

framework/framework/core/js/src/admin/components/UserListPage.tsx

Lines 119 to 130 in a6a067a

	<div className="Search-input">
	<input
	className="FormControl SearchBar"
	type="search"
	placeholder={app.translator.trans('core.admin.users.search_placeholder')}
	oninput={(e: InputEvent) => {
	this.isLoadingPage = true;
	this.query = (e?.target as HTMLInputElement)?.value;
	this.throttledSearch();
	}}
	/>
	</div>,

---

@SychO9 since this issue isn't a major one, what do you think about using a new CSS feature to fix this? (Only lacks support in Firefox right now.)

This will set padding-right to 8px when there's no .Search-clear button, so will preserve the correct padding on the forum, while allowing us to show the search icon on other fields.

.Search-input:not(:has(.Search-clear)) input {
    padding-right: 8px;
}