feat: minor improvements

This commit is contained in:
kunish 2023-09-10 16:42:00 +08:00
parent 392f20932d
commit f4788bb463
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
7 changed files with 50 additions and 20 deletions

View File

@ -11,7 +11,6 @@ import {
IconSettings,
} from '@tabler/icons-solidjs'
import { For, ParentComponent, Show, createSignal } from 'solid-js'
import { twMerge } from 'tailwind-merge'
import { LogoText } from '~/components'
import { ROUTES, themes } from '~/constants'
import { setCurTheme } from '~/signals'
@ -44,7 +43,7 @@ const ThemeSwitcher = () => (
<div class="drawer-side">
<label for="themes" class="drawer-overlay" />
<ul class="menu rounded-l-box gap-2 bg-base-300 p-2 shadow">
<ul class="menu rounded-l-box gap-2 bg-base-300 p-2">
<For each={themes}>
{(theme) => (
<li
@ -101,9 +100,9 @@ export const Header = () => {
const [openedDrawer, setOpenedDrawer] = createSignal(false)
return (
<ul class="navbar sticky inset-x-0 top-0 z-50 flex w-auto items-center justify-center bg-base-300 px-4">
<ul class="navbar sticky inset-x-0 top-0 z-50 flex w-auto items-center justify-center bg-base-300 px-4 shadow-lg">
<div class="navbar-start gap-4">
<div class={twMerge('drawer w-auto lg:hidden', '')}>
<div class="drawer w-auto lg:hidden">
<input
id="navs"
type="checkbox"
@ -121,7 +120,7 @@ export const Header = () => {
<div class="drawer-side">
<label for="navs" class="drawer-overlay" />
<ul class="menu rounded-r-box min-h-full w-2/5 gap-2 bg-base-300 pt-20 shadow">
<ul class="menu rounded-r-box min-h-full w-2/5 gap-2 bg-base-300 pt-20">
<For each={navs()}>
{({ href, name }) => (
<li onClick={() => setOpenedDrawer(false)}>

View File

@ -24,7 +24,7 @@ export const ProxyNodeCard = (props: {
return (
<div
class={twMerge(
'card card-bordered tooltip-bottom card-compact flex gap-1 border-neutral-focus bg-neutral p-3 text-neutral-content sm:tooltip',
'card card-bordered tooltip-bottom card-compact flex gap-1 border-neutral-focus bg-neutral p-3 text-neutral-content shadow-lg sm:tooltip',
isSelected && 'border-primary bg-primary-content text-primary',
onClick && 'cursor-pointer',
)}

View File

@ -12,31 +12,32 @@
:root {
scrollbar-width: thin;
scrollbar-color: hsl(var(--p)) transparent;
scrollbar-color: transparent transparent;
}
::-webkit-scrollbar {
background: transparent;
display: none;
}
::-webkit-scrollbar:vertical {
width: 0;
width: 6px;
}
::-webkit-scrollbar:horizontal {
height: 0;
height: 6px;
}
@media (width >= 640px) {
:root {
scrollbar-color: hsl(var(--p)) transparent;
}
::-webkit-scrollbar {
display: block;
}
::-webkit-scrollbar-thumb {
@apply rounded-box bg-primary;
}
::-webkit-scrollbar:vertical {
width: 6px;
}
::-webkit-scrollbar:horizontal {
height: 6px;
}
}

View File

@ -47,7 +47,7 @@ import {
useRequest,
useTwemoji,
} from '~/signals'
import type { DNSQuery, Config as IConfig } from '~/types'
import type { BackendVersion, DNSQuery, Config as IConfig } from '~/types'
const dnsQueryFormSchema = z.object({
name: z.string(),
@ -85,7 +85,11 @@ const DNSQueryForm = () => {
return (
<div class="flex flex-col">
<form use:form={form} class="flex flex-col gap-2 sm:flex-row">
<input name="name" class="input input-bordered w-full sm:flex-1" />
<input
type="search"
name="name"
class="input input-bordered w-full sm:flex-1"
/>
<div class="flex items-center gap-2">
<select name="type" class="select select-bordered">
@ -424,6 +428,25 @@ const ConfigForXd = () => {
)
}
const Versions = () => {
const request = useRequest()
const [backendVersion, setBackendVersion] = createSignal('')
onMount(async () => {
const { version } = await request.get('version').json<BackendVersion>()
setBackendVersion(version)
})
return (
<div class="flex gap-4">
<kbd class="kbd">{import.meta.env.version}</kbd>
<kbd class="kbd">{backendVersion()}</kbd>
</div>
)
}
export default () => {
return (
<div class="flex flex-col gap-4">
@ -431,7 +454,7 @@ export default () => {
<ConfigForm />
<ConfigForXd />
<kbd class="kbd">{import.meta.env.version}</kbd>
<Versions />
</div>
)
}

View File

@ -330,6 +330,7 @@ export default () => {
<div class="flex w-full items-center gap-2 md:flex-1">
<input
type="search"
class="input input-primary input-sm flex-1 sm:input-md"
placeholder={t('search')}
onInput={(e) => setSearch(e.target.value)}

View File

@ -80,6 +80,7 @@ export default () => {
return (
<div class="flex h-full flex-col gap-4 p-1">
<input
type="search"
class="input input-primary flex-shrink-0"
placeholder={t('search')}
onInput={(e) => setSearch(e.target.value)}

View File

@ -169,3 +169,8 @@ export type DNSQuery = {
type: number
}[]
}
export type BackendVersion = {
meta: boolean
version: string
}