fix(config): the bottom edge of the page gets cutoff, closes #385

This commit is contained in:
kunish 2023-10-19 23:54:57 +08:00
parent dc8fddb08a
commit 522be608a7
No known key found for this signature in database
GPG Key ID: 647A12B4F782C430
7 changed files with 23 additions and 38 deletions

View File

@ -66,7 +66,6 @@
"sort-package-json": "^2.6.0",
"tailwind-merge": "^1.14.0",
"tailwindcss": "^3.3.3",
"tailwindcss-safe-area": "^0.4.1",
"typescript": "^5.2.2",
"uuid": "^9.0.1",
"vite": "^4.5.0",

View File

@ -161,9 +161,6 @@ dependencies:
tailwindcss:
specifier: ^3.3.3
version: 3.3.3(ts-node@10.9.1)
tailwindcss-safe-area:
specifier: ^0.4.1
version: 0.4.1
typescript:
specifier: ^5.2.2
version: 5.2.2
@ -2291,12 +2288,6 @@ packages:
resolution: {integrity: sha512-4tT2UrL5LBqDwoed9wZ6N3umC4Yhz3W3FloMmiiG4JwmUJWpie0c7lcnUNd4gtMKuDEO4wRVS8B6Xa0uMRsMKg==}
dev: false
/@types/node@20.8.6:
resolution: {integrity: sha512-eWO4K2Ji70QzKUqRy6oyJWUeB7+g2cRagT3T/nxYibYcT4y2BDL8lqolRXjTHmkZCdJfIPaY73KbJAZmcryxTQ==}
dependencies:
undici-types: 5.25.3
dev: false
/@types/node@20.8.7:
resolution: {integrity: sha512-21TKHHh3eUHIi2MloeptJWALuCu5H7HQTdTrWIFReA8ad+aggoX+lRes3ex7/FtpC+sVUpFMQ+QTfYr74mruiQ==}
dependencies:
@ -2310,7 +2301,7 @@ packages:
/@types/resolve@1.17.1:
resolution: {integrity: sha512-yy7HuzQhj0dhGpD8RLXSZWEkLsV9ibvxvi6EiJ3bkqLAO1RGo0WbkWQiwpRlSFymTJRz0d3k5LM3kkx8ArDbLw==}
dependencies:
'@types/node': 20.8.6
'@types/node': 20.8.7
dev: false
/@types/semver@7.5.2:
@ -4346,7 +4337,7 @@ packages:
resolution: {integrity: sha512-KWYVV1c4i+jbMpaBC+U++4Va0cp8OisU185o73T1vo99hqi7w8tSJfUXYswwqqrjzwxa6KpRK54WhPvwf5w6PQ==}
engines: {node: '>= 10.13.0'}
dependencies:
'@types/node': 20.8.6
'@types/node': 20.8.7
merge-stream: 2.0.0
supports-color: 7.2.0
dev: false
@ -5920,11 +5911,6 @@ packages:
resolution: {integrity: sha512-3mFKyCo/MBcgyOTlrY8T7odzZFx+w+qKSMAmdFzRvqBfLlSigU6TZnlFHK0lkMwj9Bj8OYU+9yW9lmGuS0QEnQ==}
dev: false
/tailwindcss-safe-area@0.4.1:
resolution: {integrity: sha512-6EOe8D39F8N8poKWkeOcIt2SchyJ8CVfm/k5iZak6+QgOzii0TukNIfItdGbf7ylVtq3CF2CK/Oxo5xvtLwVmQ==}
engines: {node: '>=16'}
dev: false
/tailwindcss@3.3.3(ts-node@10.9.1):
resolution: {integrity: sha512-A0KgSkef7eE4Mf+nKJ83i75TMyq8HqY3qmFIJSWy8bNt0v1lG7jUcpGpoTFxAwYcWOphcTBLPPJg+bDfhDf52w==}
engines: {node: '>=14.0.0'}

View File

@ -47,7 +47,7 @@ export const App = () => {
<I18nProvider locale={locale()}>
<div
class={twMerge(
'relative flex h-screen flex-col overscroll-y-none subpixel-antialiased p-safe',
'relative flex h-screen flex-col overscroll-y-none subpixel-antialiased',
useTwemoji() ? 'font-twemoji' : 'font-no-twemoji',
)}
data-theme={curTheme()}
@ -55,23 +55,25 @@ export const App = () => {
<Header />
<div class="flex-1 overflow-y-auto p-2 sm:p-4">
<Routes>
<div class="pb-8">
<Routes>
<Show when={endpoint()}>
<Route path={ROUTES.Overview} component={Overview} />
<Route path={ROUTES.Proxies} component={Proxies} />
<Route path={ROUTES.Rules} component={Rules} />
<Route path={ROUTES.Conns} component={Connections} />
<Route path={ROUTES.Log} component={Logs} />
<Route path={ROUTES.Config} component={Config} />
<Route path="*" element={<Navigate href={ROUTES.Overview} />} />
</Show>
<Route path={endpoint() ? ROUTES.Setup : '*'} component={Setup} />
</Routes>
<Show when={endpoint()}>
<Route path={ROUTES.Overview} component={Overview} />
<Route path={ROUTES.Proxies} component={Proxies} />
<Route path={ROUTES.Rules} component={Rules} />
<Route path={ROUTES.Conns} component={Connections} />
<Route path={ROUTES.Log} component={Logs} />
<Route path={ROUTES.Config} component={Config} />
<Route path="*" element={<Navigate href={ROUTES.Overview} />} />
<ProtectedResources />
</Show>
<Route path={endpoint() ? ROUTES.Setup : '*'} component={Setup} />
</Routes>
<Show when={endpoint()}>
<ProtectedResources />
</Show>
</div>
</div>
<Toaster position="bottom-center" />

View File

@ -100,7 +100,7 @@ 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 shadow-lg">
<ul class="navbar z-50 flex w-auto items-center justify-center bg-base-300 px-4 shadow-lg">
<div class="navbar-start gap-4">
<div class="drawer w-auto lg:hidden">
<input

View File

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

View File

@ -1,10 +1,9 @@
import daisyui from 'daisyui'
import { Config } from 'tailwindcss'
import safeArea from 'tailwindcss-safe-area'
export default {
content: ['src/**/*.{css,ts,tsx}'],
plugins: [daisyui, safeArea],
plugins: [daisyui],
daisyui: { themes: true },
theme: {
fontFamily: {

1
typings/index.d.ts vendored
View File

@ -1 +0,0 @@
declare module 'tailwindcss-safe-area'