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

feat(connections): update connections page top area

Browse Source
This commit is contained in:
kunish 2023-09-07 15:09:01 +08:00
parent e31c1eb9e0
commit 64659b26f1
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/pages/Connections.tsx
View File

@ -292,7 +292,7 @@ export default () => {
getCoreRowModel: getCoreRowModel(), getCoreRowModel: getCoreRowModel(),
}) })
const tabs = () => [ const tabs = createMemo(() => [
{ {
type: ActiveTab.activeConnections, type: ActiveTab.activeConnections,
name: t('activeConnections'), name: t('activeConnections'),
@ -303,7 +303,7 @@ export default () => {
name: t('closedConnections'), name: t('closedConnections'),
count: closedConnectionsWithSpeed().length, count: closedConnectionsWithSpeed().length,
}, },
] ])
return ( return (
<div class="flex h-full flex-col gap-2"> <div class="flex h-full flex-col gap-2">
@ -314,7 +314,7 @@ export default () => {
<button <button
class={twMerge( class={twMerge(
activeTab() === tab.type && 'tab-active', activeTab() === tab.type && 'tab-active',
'tab gap-2 px-2', 'tab tab-sm gap-2 sm:tab-md',
)} )}
onClick={() => setActiveTab(tab.type)} onClick={() => setActiveTab(tab.type)}
> >
@ -327,26 +327,26 @@ export default () => {
<div class="flex w-full items-center gap-2 md:flex-1"> <div class="flex w-full items-center gap-2 md:flex-1">
<input <input
class="input input-primary input-sm w-96" class="input input-primary input-sm flex-1 sm:input-md"
placeholder={t('search')} placeholder={t('search')}
onInput={(e) => setSearch(e.target.value)} onInput={(e) => setSearch(e.target.value)}
/> />
<Button <Button
class="btn-circle btn-sm" class="btn-circle btn-sm sm:btn-md"
onClick={() => setPaused((paused) => !paused)} onClick={() => setPaused((paused) => !paused)}
> >
{paused() ? <IconPlayerPlay /> : <IconPlayerPause />} {paused() ? <IconPlayerPlay /> : <IconPlayerPause />}
</Button> </Button>
<Button <Button
class="btn-circle btn-sm" class="btn-circle btn-sm sm:btn-md"
onClick={() => request.delete('connections')} onClick={() => request.delete('connections')}
> >
<IconCircleX /> <IconCircleX />
</Button> </Button>
<label for="connection-modal" class="btn btn-circle btn-sm"> <label for="connection-modal" class="btn btn-circle btn-sm sm:btn-md">
<IconSettings /> <IconSettings />
</label> </label>
</div> </div>