大调整
This commit is contained in:
@@ -1,9 +1,7 @@
|
||||
import { Link } from 'react-router-dom';
|
||||
import DropdownMessage from './DropdownComment';
|
||||
import DropdownNotification from './DropdownNotification';
|
||||
import DropdownUser from './DropdownUser';
|
||||
import LogoIcon from '../../images/logo/logo-icon.svg';
|
||||
import DarkModeSwitcher from './DarkModeSwitcher';
|
||||
import logo from '@/images/logo/logo.png'
|
||||
|
||||
const Header = (props: {
|
||||
sidebarOpen: string | boolean | undefined;
|
||||
@@ -12,55 +10,55 @@ const Header = (props: {
|
||||
return (
|
||||
<header className="sticky top-0 z-999 flex w-full bg-white drop-shadow-1 dark:bg-boxdark dark:drop-shadow-none">
|
||||
<div className="flex flex-grow items-center justify-between px-4 py-4 shadow-2 md:px-6 2xl:px-11">
|
||||
<div className="flex items-center gap-2 sm:gap-4 lg:hidden">
|
||||
{/* <!-- Hamburger Toggle BTN --> */}
|
||||
<button
|
||||
aria-controls="sidebar"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
props.setSidebarOpen(!props.sidebarOpen);
|
||||
}}
|
||||
className="z-99999 block rounded-sm border border-stroke bg-white p-1.5 shadow-sm dark:border-strokedark dark:bg-boxdark lg:hidden"
|
||||
>
|
||||
<span className="relative block h-5.5 w-5.5 cursor-pointer">
|
||||
<span className="du-block absolute right-0 h-full w-full">
|
||||
<span
|
||||
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-[0] duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!w-full delay-300'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-150 duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && 'delay-400 !w-full'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-200 duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!w-full delay-500'
|
||||
}`}
|
||||
></span>
|
||||
<div className='flex items-center'>
|
||||
<div className="flex items-center gap-4 lg:hidden">
|
||||
<button
|
||||
aria-controls="sidebar"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
props.setSidebarOpen(!props.sidebarOpen);
|
||||
}}
|
||||
className="z-99999 block rounded-sm border border-stroke bg-white p-1.5 shadow-sm dark:border-strokedark dark:bg-boxdark lg:hidden"
|
||||
>
|
||||
<span className="relative block h-5.5 w-5.5 cursor-pointer">
|
||||
<span className="du-block absolute right-0 h-full w-full">
|
||||
<span
|
||||
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-[0] duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!w-full delay-300'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-150 duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && 'delay-400 !w-full'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`relative left-0 top-0 my-1 block h-0.5 w-0 rounded-sm bg-black delay-200 duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!w-full delay-500'
|
||||
}`}
|
||||
></span>
|
||||
</span>
|
||||
<span className="absolute right-0 h-full w-full rotate-45">
|
||||
<span
|
||||
className={`absolute left-2.5 top-0 block h-full w-0.5 rounded-sm bg-black delay-300 duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!h-0 !delay-[0]'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`delay-400 absolute left-0 top-2.5 block h-0.5 w-full rounded-sm bg-black duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!h-0 !delay-200'
|
||||
}`}
|
||||
></span>
|
||||
</span>
|
||||
</span>
|
||||
<span className="absolute right-0 h-full w-full rotate-45">
|
||||
<span
|
||||
className={`absolute left-2.5 top-0 block h-full w-0.5 rounded-sm bg-black delay-300 duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!h-0 !delay-[0]'
|
||||
}`}
|
||||
></span>
|
||||
<span
|
||||
className={`delay-400 absolute left-0 top-2.5 block h-0.5 w-full rounded-sm bg-black duration-200 ease-in-out dark:bg-white ${!props.sidebarOpen && '!h-0 !delay-200'
|
||||
}`}
|
||||
></span>
|
||||
</span>
|
||||
</span>
|
||||
</button>
|
||||
{/* <!-- Hamburger Toggle BTN --> */}
|
||||
</button>
|
||||
|
||||
<Link className="block flex-shrink-0 lg:hidden" to="/">
|
||||
<img src={LogoIcon} alt="Logo" />
|
||||
</Link>
|
||||
<Link className="block flex-shrink-0 lg:hidden" to="/">
|
||||
<img src={logo} alt="logo" className='w-8' />
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<div className="hidden xs:block ml-5 2xl:ml-0">再渺小的星光,也有属于他的光芒!</div>
|
||||
</div>
|
||||
|
||||
<div className="hidden sm:block">再渺小的星光,也有属于他的光芒!</div>
|
||||
|
||||
<div className="flex items-center gap-3 2xsm:gap-7">
|
||||
<ul className="flex items-center gap-2 2xsm:gap-4">
|
||||
<li>
|
||||
<li className='hidden md:block'>
|
||||
<a href="https://github.com/LiuYuYang01/ThriveX-Blog" target='_blank' className='hover:text-primary'>开源不易,赏个Star吧!!!</a>
|
||||
</li>
|
||||
|
||||
|
||||
@@ -15,7 +15,6 @@ import Footprint from '@/pages/Footprint';
|
||||
import Setup from '@/pages/Setup';
|
||||
import Rss from '@/pages/Rss';
|
||||
import File from "@/pages/File";
|
||||
import Stats from '@/pages/Stats';
|
||||
import Iterative from '@/pages/Iterative';
|
||||
import Page from '@/pages/Route';
|
||||
import Role from '@/pages/Role';
|
||||
@@ -51,7 +50,6 @@ export default () => {
|
||||
{ path: "/role", title: "角色管理", component: <Role /> },
|
||||
{ path: "/rss", title: "订阅中心", component: <Rss /> },
|
||||
{ path: "/file", title: "文件管理", component: <File /> },
|
||||
{ path: "/stats", title: "数据可视化", component: <Stats /> },
|
||||
{ path: "/iter", title: "项目更新记录", component: <Iterative /> },
|
||||
{ path: "/work", title: "工作台", component: <Work /> },
|
||||
];
|
||||
|
||||
@@ -30,7 +30,6 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
|
||||
storedSidebarExpanded === null ? false : storedSidebarExpanded === 'true'
|
||||
);
|
||||
|
||||
// close on click outside
|
||||
useEffect(() => {
|
||||
const clickHandler = ({ target }: MouseEvent) => {
|
||||
if (!sidebar.current || !trigger.current) return;
|
||||
@@ -46,7 +45,6 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
|
||||
return () => document.removeEventListener('click', clickHandler);
|
||||
});
|
||||
|
||||
// close if the esc key is pressed
|
||||
useEffect(() => {
|
||||
const keyHandler = ({ keyCode }: KeyboardEvent) => {
|
||||
if (!sidebarOpen || keyCode !== 27) return;
|
||||
@@ -206,12 +204,6 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
|
||||
icon: <BiFolderOpen className='text-[22px]' />,
|
||||
name: "文件系统"
|
||||
},
|
||||
{
|
||||
to: "/stats",
|
||||
path: "stats",
|
||||
icon: <BiLineChart className='text-[22px]' />,
|
||||
name: "数据可视化"
|
||||
},
|
||||
{
|
||||
to: "/iter",
|
||||
path: "iter",
|
||||
@@ -268,21 +260,7 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen }: SidebarProps) => {
|
||||
aria-controls="sidebar"
|
||||
aria-expanded={sidebarOpen}
|
||||
className="block lg:hidden"
|
||||
>
|
||||
<svg
|
||||
className="fill-current"
|
||||
width="20"
|
||||
height="18"
|
||||
viewBox="0 0 20 18"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M19 8.175H2.98748L9.36248 1.6875C9.69998 1.35 9.69998 0.825 9.36248 0.4875C9.02498 0.15 8.49998 0.15 8.16248 0.4875L0.399976 8.3625C0.0624756 8.7 0.0624756 9.225 0.399976 9.5625L8.16248 17.4375C8.31248 17.5875 8.53748 17.7 8.76248 17.7C8.98748 17.7 9.17498 17.625 9.36248 17.475C9.69998 17.1375 9.69998 16.6125 9.36248 16.275L3.02498 9.8625H19C19.45 9.8625 19.825 9.4875 19.825 9.0375C19.825 8.55 19.45 8.175 19 8.175Z"
|
||||
fill=""
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="no-scrollbar flex flex-col overflow-y-auto duration-300 ease-linear">
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { Card } from 'antd';
|
||||
import HeaderInfo from './components/HeaderInfo';
|
||||
import Stats from './components/Stats';
|
||||
|
||||
const Home = () => {
|
||||
return (
|
||||
@@ -8,9 +9,7 @@ const Home = () => {
|
||||
<HeaderInfo />
|
||||
</Card>
|
||||
|
||||
<Card className='mt-2'>
|
||||
暂时没有灵感,先空着
|
||||
</Card>
|
||||
<Stats />
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -15,6 +15,7 @@ module.exports = {
|
||||
screens: {
|
||||
'2xsm': '375px',
|
||||
xsm: '425px',
|
||||
xs: '550px',
|
||||
'3xl': '2000px',
|
||||
...defaultTheme.screens,
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user