52 lines
1.9 KiB
TypeScript
52 lines
1.9 KiB
TypeScript
|
import ModeSwitcher from './ModeSwitcher'
|
||
|
|
import LayoutSwitcher from './LayoutSwitcher'
|
||
|
|
import ThemeSwitcher from './ThemeSwitcher'
|
||
|
|
import DirectionSwitcher from './DirectionSwitcher'
|
||
|
|
import NavModeSwitcher from './NavModeSwitcher'
|
||
|
|
import CopyButton from './CopyButton'
|
||
|
|
import { useLocalization } from '@/utils/hooks/useLocalization'
|
||
|
|
|
||
|
|
export type ThemeConfiguratorProps = {
|
||
|
|
callBackClose?: () => void
|
||
|
|
}
|
||
|
|
|
||
|
|
const ThemeConfigurator = ({ callBackClose }: ThemeConfiguratorProps) => {
|
||
|
|
const { translate } = useLocalization()
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="flex flex-col h-full justify-between">
|
||
|
|
<div className="flex flex-col gap-y-10 mb-6">
|
||
|
|
<div className="flex items-center justify-between">
|
||
|
|
<div>
|
||
|
|
<h6>{translate('::SidePanel.Mode')}</h6>
|
||
|
|
<span>{translate('::SidePanel.Mode.Description')}</span>
|
||
|
|
</div>
|
||
|
|
<ModeSwitcher />
|
||
|
|
</div>
|
||
|
|
<div className="flex items-center justify-between">
|
||
|
|
<div>
|
||
|
|
<h6>{translate('::SidePanel.Direction')}</h6>
|
||
|
|
<span>{translate('::SidePanel.Direction.Description')}</span>
|
||
|
|
</div>
|
||
|
|
<DirectionSwitcher callBackClose={callBackClose} />
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<h6 className="mb-3">{translate('::SidePanel.NavMode')}</h6>
|
||
|
|
<NavModeSwitcher />
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<h6 className="mb-3">{translate('::SidePanel.Themed')}</h6>
|
||
|
|
<ThemeSwitcher />
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<h6 className="mb-3">{translate('::SidePanel.Layout')}</h6>
|
||
|
|
<LayoutSwitcher />
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<CopyButton />
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default ThemeConfigurator
|