shiyue/kan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: glass modal

Browse Source
This commit is contained in:
Henry
2024-03-18 22:40:24 +00:00
parent e058a2db30
commit 7aa64db983
5 changed files with 16 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/components/dashboard.tsx
View File

@@ -5,7 +5,7 @@ import { auth } from "~/server/auth";
import SideNavigation from "./SideNavigation";
import FeedbackButton from "./FeedbackButton";
export default async function Layout(props: { children: React.ReactNode }) {
export default async function Dashboard(props: { children: React.ReactNode }) {
const session = await auth();
if (!session?.user) {

4
src/app/components/modal.tsx
View File

@@ -24,7 +24,7 @@ const Modal: React.FC<Props> = ({ children }) => {
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<div className="fixed inset-0 bg-dark-50 bg-opacity-5 transition-opacity" />
<div className="fixed inset-0 bg-dark-50 bg-opacity-40 transition-opacity" />
</Transition.Child>
<div className="fixed inset-0 z-10 w-screen overflow-y-auto">
@@ -38,7 +38,7 @@ const Modal: React.FC<Props> = ({ children }) => {
leaveFrom="opacity-100 translate-y-0 sm:scale-100"
leaveTo="opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
>
<Dialog.Panel className="relative mt-[25vh] transform rounded-lg border border-dark-400 bg-dark-100 px-4 pb-4 pt-5 text-left shadow-xl transition-all sm:mb-8 sm:w-full sm:max-w-sm sm:p-6">
<Dialog.Panel className="shadow-3xl relative mt-[25vh] transform rounded-lg border border-dark-400 bg-dark-100/20 px-4 pb-4 pt-5 text-left backdrop-blur-lg transition-all sm:mb-8 sm:w-full sm:max-w-sm sm:p-6">
{children}
</Dialog.Panel>
</Transition.Child>