refactor(AdminCenterLayout): simplify layout structure and improve styling
- Removed unused imports and simplified margin handling in AdminCenterLayout. - Updated layout classes for better responsiveness and visual consistency. - Enhanced sidebar and outlet rendering with improved Flex component usage. - Streamlined overall layout for a cleaner and more modern appearance.
This commit is contained in:
@@ -4,40 +4,25 @@ import { Outlet } from 'react-router-dom';
|
||||
import { useMediaQuery } from 'react-responsive';
|
||||
import AdminCenterSidebar from '@/pages/admin-center/sidebar/sidebar';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useAppDispatch } from '@/hooks/useAppDispatch';
|
||||
|
||||
const AdminCenterLayout: React.FC = () => {
|
||||
const dispatch = useAppDispatch();
|
||||
const isTablet = useMediaQuery({ query: '(min-width:768px)' });
|
||||
const isMarginAvailable = useMediaQuery({ query: '(min-width: 1000px)' });
|
||||
const { t } = useTranslation('admin-center/sidebar');
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
marginBlock: 96,
|
||||
minHeight: '90vh',
|
||||
marginLeft: `${isMarginAvailable ? '5%' : ''}`,
|
||||
marginRight: `${isMarginAvailable ? '5%' : ''}`,
|
||||
}}
|
||||
>
|
||||
<div className="my-6">
|
||||
<Typography.Title level={4}>{t('adminCenter')}</Typography.Title>
|
||||
|
||||
{isTablet ? (
|
||||
<Flex
|
||||
gap={24}
|
||||
align="flex-start"
|
||||
style={{
|
||||
width: '100%',
|
||||
marginBlockStart: 24,
|
||||
}}
|
||||
className="w-full mt-6"
|
||||
>
|
||||
<Flex style={{ width: '100%', maxWidth: 240 }}>
|
||||
<Flex className="w-full max-w-60">
|
||||
<AdminCenterSidebar />
|
||||
</Flex>
|
||||
<Flex style={{ width: '100%' }}>
|
||||
<Flex className="w-full">
|
||||
<Outlet />
|
||||
</Flex>
|
||||
</Flex>
|
||||
@@ -45,9 +30,7 @@ const AdminCenterLayout: React.FC = () => {
|
||||
<Flex
|
||||
vertical
|
||||
gap={24}
|
||||
style={{
|
||||
marginBlockStart: 24,
|
||||
}}
|
||||
className="mt-6"
|
||||
>
|
||||
<AdminCenterSidebar />
|
||||
<Outlet />
|
||||
|
||||
Reference in New Issue
Block a user