-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
597c022
commit dfb6599
Showing
75 changed files
with
17,543 additions
and
2,420 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,18 +1,56 @@ | ||
import React, { PropsWithChildren } from 'react'; | ||
import AuthenticationCardLogo from '@/Components/AuthenticationCardLogo'; | ||
import { Link } from '@inertiajs/react'; | ||
import React, { PropsWithChildren, ReactNode } from 'react'; | ||
import AuthenticationCardLogo from './AuthenticationCardLogo'; | ||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from './ui/card'; | ||
|
||
interface GuestLayoutProps { | ||
header?: string | null; | ||
description?: string | ReactNode | null; | ||
} | ||
|
||
export default function AuthenticationCard({ | ||
header = null, | ||
description = null, | ||
children, | ||
}: PropsWithChildren<Record<string, unknown>>) { | ||
}: PropsWithChildren<GuestLayoutProps>) { | ||
|
||
|
||
return ( | ||
<div className="min-h-screen flex flex-col sm:justify-center items-center pt-6 sm:pt-0 bg-gray-100 dark:bg-gray-900"> | ||
<div> | ||
<AuthenticationCardLogo /> | ||
</div> | ||
<div className='flex min-h-screen flex-col items-center pt-6 sm:justify-center sm:pt-0'> | ||
<Link href={route('dashboard')}> | ||
<AuthenticationCardLogo className='mx-auto h-16 w-16 fill-foreground' /> | ||
</Link> | ||
|
||
<div className="w-full sm:max-w-md mt-6 px-6 py-4 bg-white dark:bg-gray-800 shadow-md overflow-hidden sm:rounded-lg"> | ||
{children} | ||
<div className='mt-10 w-full max-w-lg'> | ||
<Card className='rounded-none border-l-transparent border-r-transparent shadow-none sm:rounded-lg sm:border-l-border sm:border-r-border sm:shadow-sm lg:rounded-xl '> | ||
<CardHeader className='flex-row justify-between'> | ||
<div> | ||
<CardTitle>{header}</CardTitle> | ||
<CardDescription className='mt-2'>{description}</CardDescription> | ||
</div> | ||
</CardHeader> | ||
<CardContent>{children}</CardContent> | ||
</Card> | ||
</div> | ||
</div> | ||
// <div className="min-h-screen flex flex-col sm:justify-center items-center pt-6 sm:pt-0 bg-gray-100 dark:bg-gray-900"> | ||
// {/* <div> | ||
// <AuthenticationCardLogo /> | ||
// </div> | ||
|
||
// <div className="w-full sm:max-w-md mt-6 px-6 py-4 bg-white dark:bg-gray-800 shadow-md overflow-hidden sm:rounded-lg"> | ||
// {children} | ||
// </div> */} | ||
// <Card> | ||
// <CardHeader> | ||
// <div className='flex'> | ||
// <AuthenticationCardLogo /> | ||
// </div> | ||
// </CardHeader> | ||
// <CardContent> | ||
// {children} | ||
// </CardContent> | ||
// </Card> | ||
// </div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
import clsx from 'clsx'; | ||
import React, { ReactNode } from 'react'; | ||
|
||
export default function Container({ | ||
withNoHorizontalPadding = false, | ||
children, | ||
}: { | ||
withNoHorizontalPadding?: boolean; | ||
children: ReactNode; | ||
}) { | ||
return ( | ||
<div | ||
className={clsx( | ||
'mx-auto max-w-7xl py-4 sm:px-6 sm:py-10 lg:px-8', | ||
withNoHorizontalPadding ? null : 'px-4 sm:px-0' | ||
)}> | ||
{children} | ||
</div> | ||
); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
import React, { createContext, useContext, useEffect, useState } from 'react'; | ||
type Theme = 'dark' | 'light' | 'system'; | ||
|
||
type ThemeProviderProps = { | ||
children: React.ReactNode; | ||
defaultTheme?: Theme; | ||
storageKey?: string; | ||
}; | ||
|
||
type ThemeProviderState = { | ||
theme: Theme; | ||
setTheme: (theme: Theme) => void; | ||
}; | ||
|
||
const initialState: ThemeProviderState = { | ||
theme: 'system', | ||
setTheme: () => null, | ||
}; | ||
|
||
const ThemeProviderContext = createContext<ThemeProviderState>(initialState); | ||
|
||
export function ThemeProvider({ | ||
children, | ||
defaultTheme = 'system', | ||
storageKey = 'vite-ui-theme', | ||
...props | ||
}: ThemeProviderProps) { | ||
const [theme, setTheme] = useState<Theme>(() => (localStorage.getItem(storageKey) as Theme) || defaultTheme); | ||
|
||
useEffect(() => { | ||
const root = window.document.documentElement; | ||
|
||
root.classList.remove('light', 'dark'); | ||
|
||
if (theme === 'system') { | ||
const systemTheme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light'; | ||
|
||
root.classList.add(systemTheme); | ||
return; | ||
} | ||
|
||
root.classList.add(theme); | ||
}, [theme]); | ||
|
||
const value = { | ||
theme, | ||
window: (window as any).route, | ||
setTheme: (theme: Theme) => { | ||
localStorage.setItem(storageKey, theme); | ||
setTheme(theme); | ||
}, | ||
}; | ||
|
||
return ( | ||
<ThemeProviderContext.Provider {...props} value={value}> | ||
{children} | ||
</ThemeProviderContext.Provider> | ||
); | ||
} | ||
|
||
export const useTheme = () => { | ||
const context = useContext(ThemeProviderContext); | ||
|
||
if (context === undefined) throw new Error('useTheme must be used within a ThemeProvider'); | ||
|
||
return context; | ||
}; |
Oops, something went wrong.