chore(ui): clean up

This commit is contained in:
Ou 2024-10-19 14:42:23 +08:00
parent 89fe57c5a2
commit 96e80cff7b
5 changed files with 14 additions and 12 deletions

View File

@ -51,6 +51,9 @@ export function Dnd() {
{items.map(id => ( {items.map(id => (
<motion.li <motion.li
key={id} key={id}
transition={{
type: "tween",
}}
variants={{ variants={{
hidden: { y: 20, opacity: 0 }, hidden: { y: 20, opacity: 0 },
visible: { visible: {

View File

@ -17,12 +17,10 @@ export function Column({ id }: { id: ColumnID }) {
if (id === currentColumnID) { if (id === currentColumnID) {
return ( return (
<> <>
<div className="flex justify-center md:hidden"> <div className="flex justify-center md:hidden mb-6">
<NavBar /> <NavBar />
</div> </div>
<div className="mt-10"> <Dnd />
<Dnd />
</div>
</> </>
) )
} }

View File

@ -9,7 +9,7 @@ export function Toast() {
unstyled: true, unstyled: true,
classNames: { classNames: {
toast: clsx( toast: clsx(
"flex gap-1 p-1 rounded-xl backdrop-blur-5 items-center bg-op-40! w-full", "flex gap-1 p-1 rounded-xl backdrop-blur-5 items-center bg-op-70! w-full",
"bg-blue", "bg-blue",
"data-[type=error]:(bg-red)", "data-[type=error]:(bg-red)",
"data-[type=success]:(bg-green)", "data-[type=success]:(bg-green)",
@ -17,10 +17,10 @@ export function Toast() {
"data-[type=warning]:(bg-yellow)", "data-[type=warning]:(bg-yellow)",
), ),
icon: "text-white ml-1 dark:text-dark-600 text-op-80!", icon: "text-white ml-1 dark:text-dark-600 text-op-80!",
content: "bg-base bg-op-70! p-2 rounded-md color-base w-full backdrop-blur-md", content: "bg-base bg-op-70! p-2 rounded-lg color-base w-full backdrop-blur-md",
title: "font-normal text-base", title: "font-normal text-base",
description: "color-base text-op-80! text-sm", description: "color-base text-op-80! text-sm",
actionButton: "bg-base bg-op-70! rounded-md py-2 w-4em backdrop-blur-md hover:(bg-base bg-op-60!)", actionButton: "bg-base bg-op-70! rounded-lg py-2 w-4em backdrop-blur-md hover:(bg-base bg-op-60!)",
closeButton: "bg-base bg-op-50! border-0 hover:(bg-base bg-op-70!)", closeButton: "bg-base bg-op-50! border-0 hover:(bg-base bg-op-70!)",
}, },
}} }}

View File

@ -50,7 +50,7 @@ export function Menu() {
id="dropdown-menu" id="dropdown-menu"
className={clsx([ className={clsx([
"absolute top-2rem right-0 z-99 w-200px", "absolute top-2rem right-0 z-99 w-200px",
"bg-primary p-1 backdrop-blur-5 bg-op-40! rounded-xl", "bg-primary p-1 backdrop-blur-5 bg-op-70! rounded-xl",
])} ])}
initial={{ initial={{
scale: 0.9, scale: 0.9,
@ -59,7 +59,7 @@ export function Menu() {
scale: 1, scale: 1,
}} }}
> >
<ol className="bg-base bg-op-70! backdrop-blur-md p-2 rounded-md color-base text-base"> <ol className="bg-base bg-op-70! backdrop-blur-md p-2 rounded-lg color-base text-base">
{enabledLogin && !loggedIn && ( {enabledLogin && !loggedIn && (
<li onClick={login}> <li onClick={login}>
<span className="i-ph:sign-in-duotone inline-block" /> <span className="i-ph:sign-in-duotone inline-block" />

View File

@ -54,9 +54,10 @@ function RootComponent() {
<Header /> <Header />
</header> </header>
<main className={clsx([ <main className={clsx([
"min-h-[calc(100vh-170px)]", "mt-2",
"md:(min-h-[calc(100vh-110px)])", "min-h-[calc(100vh-180px)]",
"lg:(min-h-[calc(100vh-124px)])", "md:(min-h-[calc(100vh-175px)])",
"lg:(min-h-[calc(100vh-194px)])",
])} ])}
> >
<Outlet /> <Outlet />