Adjust Dark Mode Styles for Home Page

This commit is contained in:
aftabrehan
2024-02-02 16:24:59 +05:00
parent f87e81c4d7
commit e96577e60e
7 changed files with 20 additions and 15 deletions

View File

@@ -26,11 +26,12 @@ export const Button = ({
}: buttonProps) => {
const variantCls = {
primary: 'text-white bg-primary xs:hover:opacity-75',
secondary: 'text-black bg-zinc-100 dark:bg-white/10 xs:hover:opacity-75',
secondary:
'text-black dark:text-white bg-zinc-100 dark:bg-white/10 xs:hover:opacity-75',
ghost:
'text-black dark:text-gray-200 hover:bg-zinc-100 dark:hover:bg-white/10 xs:hover:opacity-75',
outline:
'text-black bg-white border-2 border-zinc-400 disabled:hover:border-zinc-400 sm:hover:border-primary',
'text-black dark:text-white bg-white dark:bg-neutral-800 border-2 border-zinc-400 disabled:hover:border-zinc-400 sm:hover:border-primary dark:sm:hover:border-white',
}[variant]
return (
@@ -39,7 +40,7 @@ export const Button = ({
onClick={onClick}
disabled={disabled}
className={clsx(
'h-12 px-5 flex items-center justify-center gap-2 text-base font-medium text-nowrap rounded-full transition-all duration-200 disabled:opacity-50',
'h-12 px-5 flex items-center justify-center gap-2 text-base font-medium text-nowrap outline-none rounded-full transition-all duration-200 disabled:opacity-50',
!disabled && 'group',
variantCls,
className