Public-Mirror/metacubexd
1
0
Fork 0
mirror of https://github.com/MetaCubeX/metacubexd.git synced 2024-11-14 18:35:34 +08:00
Code Issues Projects Releases Wiki Activity

feat(rules): search input align with tabs

Browse Source
This commit is contained in:
kunish 2024-10-13 02:17:17 +08:00
parent 554b361184
commit ab018c529d
No known key found for this signature in database
GPG Key ID: 67D3ACD788F3A7CD
2 changed files with 25 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/pages/Connections.tsx
View File

@ -414,7 +414,7 @@ export default () => {
</select>
</div>
<div class="join flex flex-1 items-center md:flex-1">
<div class="join flex flex-1 items-center">
<input
type="search"
class="input input-sm join-item input-primary min-w-0 flex-1"

45
src/pages/Rules.tsx
View File

@ -128,7 +128,7 @@ export default () => {
<DocumentTitle>{t('rules')}</DocumentTitle>
<div class="flex h-full flex-col gap-2">
<div class="flex items-center gap-2">
<div class="flex w-full flex-wrap items-center gap-2">
<div class="tabs-boxed tabs gap-2">
<For each={tabs()}>
{(tab) => (
@ -146,28 +146,31 @@ export default () => {
</For>
</div>
<Show when={activeTab() === ActiveTab.ruleProviders}>
<Button
class="btn btn-circle btn-sm"
disabled={allProviderIsUpdating()}
onClick={(e) => onUpdateAllProviderClick(e)}
icon={
<IconReload
class={twMerge(
allProviderIsUpdating() && 'animate-spin text-success',
)}
/>
}
<div class="join flex flex-1 items-center">
<input
class="input input-sm join-item input-primary min-w-0 flex-1"
type="search"
placeholder={t('search')}
value={globalFilter()}
onInput={(e) => setGlobalFilter(e.currentTarget.value)}
/>
</Show>
</div>
<input
class="input input-sm input-bordered input-primary"
placeholder={t('search')}
value={globalFilter()}
onInput={(e) => setGlobalFilter(e.currentTarget.value)}
/>
<Show when={activeTab() === ActiveTab.ruleProviders}>
<Button
class="btn btn-primary join-item btn-sm"
disabled={allProviderIsUpdating()}
onClick={(e) => onUpdateAllProviderClick(e)}
icon={
<IconReload
class={twMerge(
allProviderIsUpdating() && 'animate-spin text-success',
)}
/>
}
/>
</Show>
</div>
</div>
<div
ref={(ref) => (scrollElementRef = ref)}