Feat: account page dark mode (#11977)

This commit is contained in:
Yi Xiao
2024-12-23 11:17:49 +08:00
committed by GitHub
parent 39df994ff9
commit 74b1b60125
19 changed files with 165 additions and 123 deletions

View File

@@ -1,6 +1,6 @@
import { Dialog, Transition } from '@headlessui/react'
import { Fragment } from 'react'
import { XMarkIcon } from '@heroicons/react/24/outline'
import { RiCloseLine } from '@remixicon/react'
import classNames from '@/utils/classnames'
// https://headlessui.com/react/dialog
@@ -39,7 +39,7 @@ export default function Modal({
leaveFrom="opacity-100"
leaveTo="opacity-0"
>
<div className="fixed inset-0 bg-black bg-opacity-25" />
<div className="fixed inset-0 bg-background-overlay-fullscreen" />
</Transition.Child>
<div
@@ -66,16 +66,16 @@ export default function Modal({
)}>
{title && <Dialog.Title
as="h3"
className="text-lg font-medium leading-6 text-text-primary"
className="title-2xl-semi-bold text-text-primary"
>
{title}
</Dialog.Title>}
{description && <Dialog.Description className='text-text-tertiary text-xs font-normal mt-2'>
{description && <Dialog.Description className='text-text-secondary body-md-regular mt-2'>
{description}
</Dialog.Description>}
{closable
&& <div className='absolute z-10 top-6 right-6 w-5 h-5 rounded-2xl flex items-center justify-center hover:cursor-pointer hover:bg-components-panel-on-panel-item-bg-hover'>
<XMarkIcon className='w-4 h-4 text-text-tertiary' onClick={
&& <div className='absolute z-10 top-6 right-6 w-5 h-5 rounded-2xl flex items-center justify-center hover:cursor-pointer hover:bg-state-base-hover'>
<RiCloseLine className='w-4 h-4 text-text-tertiary' onClick={
(e) => {
e.stopPropagation()
onClose()