chore: adjust layout
This commit is contained in:
parent
8c16c19fa6
commit
a723b02f19
@ -1,8 +1,7 @@
|
|||||||
import { Link, Outlet, useLocation, useNavigation } from "react-router-dom";
|
import { Link, Outlet, useLocation, useNavigation } from "react-router-dom";
|
||||||
import { Layout, Menu, MenuProps, Skeleton, theme } from "antd";
|
import { Layout, Menu, MenuProps, Skeleton } from "antd";
|
||||||
|
|
||||||
import { NavConfigs } from "../routes.tsx";
|
import { NavConfigs } from "../routes.tsx";
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
|
|
||||||
const { Header, Footer, Content } = Layout;
|
const { Header, Footer, Content } = Layout;
|
||||||
|
|
||||||
@ -14,10 +13,6 @@ const navItems: MenuProps["items"] = NavConfigs.map((c) => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
function Root() {
|
function Root() {
|
||||||
const {
|
|
||||||
token: { colorBgContainer },
|
|
||||||
} = theme.useToken();
|
|
||||||
|
|
||||||
const nav = useNavigation();
|
const nav = useNavigation();
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
|
|
||||||
@ -40,14 +35,14 @@ function Root() {
|
|||||||
<Layout>
|
<Layout>
|
||||||
<Content
|
<Content
|
||||||
style={{
|
style={{
|
||||||
background: colorBgContainer,
|
background: "#F8F8F8",
|
||||||
display: "flex",
|
display: "flex",
|
||||||
justifyContent: "center",
|
justifyContent: "center",
|
||||||
paddingTop: "30px",
|
paddingTop: "30px",
|
||||||
paddingBottom: "30px",
|
paddingBottom: "30px",
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div style={{ width: "90%" }}>
|
<div style={{ width: "85%" }}>
|
||||||
<Skeleton loading={nav.state === "loading"} active>
|
<Skeleton loading={nav.state === "loading"} active>
|
||||||
<Outlet />
|
<Outlet />
|
||||||
</Skeleton>
|
</Skeleton>
|
||||||
|
Reference in New Issue
Block a user