mirror of
https://github.com/MetaCubeX/metacubexd.git
synced 2024-11-10 05:15:35 +08:00
fix: proxy providers grid layout
This commit is contained in:
parent
353b5ebff3
commit
6d242a4457
@ -1,15 +1,14 @@
|
||||
import { JSX, ParentComponent, Show } from 'solid-js'
|
||||
import { children, JSX, ParentComponent, Show } from 'solid-js'
|
||||
import { twMerge } from 'tailwind-merge'
|
||||
|
||||
type Props = {
|
||||
title: JSX.Element
|
||||
content: JSX.Element
|
||||
isOpen?: boolean
|
||||
onCollapse: (collapsed: boolean) => void
|
||||
}
|
||||
|
||||
export const Collapse: ParentComponent<Props> = (props) => {
|
||||
const { title, content, onCollapse } = props
|
||||
const { title, onCollapse } = props
|
||||
|
||||
const getCollapseClassName = () => {
|
||||
const openedClassName = 'collapse-open'
|
||||
@ -44,7 +43,7 @@ export const Collapse: ParentComponent<Props> = (props) => {
|
||||
'collapse-content grid grid-cols-2 gap-2 transition-opacity duration-1000',
|
||||
)}
|
||||
>
|
||||
<Show when={props.isOpen}>{content}</Show>
|
||||
<Show when={props.isOpen}>{children(() => props.children)()}</Show>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
@ -203,17 +203,14 @@ export default () => {
|
||||
<Collapse
|
||||
isOpen={collapsedMap()[proxy.name]}
|
||||
title={title}
|
||||
content={
|
||||
onCollapse={(val) => setCollapsedMap(proxy.name, val)}
|
||||
>
|
||||
<ProxyCardGroups
|
||||
proxyNames={sortedProxyNames}
|
||||
now={proxy.now}
|
||||
onClick={(name) => {
|
||||
void onProxyNodeClick(proxy, name)
|
||||
}}
|
||||
/>
|
||||
}
|
||||
onCollapse={(val) => setCollapsedMap(proxy.name, val)}
|
||||
onClick={(name) => void onProxyNodeClick(proxy, name)}
|
||||
/>
|
||||
</Collapse>
|
||||
)
|
||||
}}
|
||||
</For>
|
||||
@ -221,7 +218,7 @@ export default () => {
|
||||
</Show>
|
||||
|
||||
<Show when={activeTab() === ActiveTab.proxyProviders}>
|
||||
<div class="grid grid-cols-1 gap-2 sm:grid-cols-2">
|
||||
<div class="grid grid-cols-1 place-items-start gap-2 sm:grid-cols-2">
|
||||
<For each={proxyProviders()}>
|
||||
{(proxyProvider) => {
|
||||
const sortedProxyNames = filterProxiesByAvailability(
|
||||
@ -296,11 +293,12 @@ export default () => {
|
||||
<Collapse
|
||||
isOpen={collapsedMap()[proxyProvider.name]}
|
||||
title={title}
|
||||
content={<ProxyCardGroups proxyNames={sortedProxyNames} />}
|
||||
onCollapse={(val) =>
|
||||
setCollapsedMap(proxyProvider.name, val)
|
||||
}
|
||||
/>
|
||||
>
|
||||
<ProxyCardGroups proxyNames={sortedProxyNames} />
|
||||
</Collapse>
|
||||
)
|
||||
}}
|
||||
</For>
|
||||
|
Loading…
Reference in New Issue
Block a user