chore: update navbar

YuzeTT · Nov 21, 2023 · ea49f88 · ea49f88
1 parent 99aa5bc
commit ea49f88
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 7 deletions.
diff --git a/src/components/AccountButton.tsx b/src/components/AccountButton.tsx
@@ -0,0 +1,10 @@
+import isVip from "../utils/isVip"
+
+export default function AccountButton() {
+  return (
+    <a href='/user' className={`p-1 rounded-full flex items-center ${isVip().level===0?'bg-green-100 text-green-700':isVip().level === '1'?'bg-[#E8BD87] text-[#FFFFFF]':isVip().level === '100'?'bg-blue-500 text-[#FFFFFF]':''}`}>
+      <div className="i-ri-account-circle-fill text-xl" />
+      <div className='text-sm mx-1'>{isVip().level==100?'管理站点':'我的账户'}</div>
+    </a>
+  )
+}
diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
@@ -1,12 +1,12 @@
 import { useLocation, useNavigate } from "react-router-dom"
 // import { useLocation } from 'react-router';
 import list from '../utils/router';
+import AccountButton from "./AccountButton";
 // import { useState } from 'react'
 // import { Alert } from 'antd';
 // import { useState } from "react";
 
 // import { motion } from "framer-motion"
-import isVip from "../utils/isVip"
 
 export default function Navbar() {
   const navigate = useNavigate();
@@ -93,10 +93,7 @@ export default function Navbar() {
             </div>:''
           } */}
           {/* <button onClick={()=>{setShowText(!showText)}}></button> */}
-          <a href='/user' className={`p-1 rounded-full flex items-center ${isVip().level===0?'bg-green-100 text-green-700':isVip().level === '1'?'bg-[#E8BD87] text-[#FFFFFF]':isVip().level === '100'?'bg-blue-500 text-[#FFFFFF]':''}`}>
-            <div className="i-ri-account-circle-fill text-xl" />
-            <div className='text-sm mx-1'>{isVip().level==100?'管理站点':'我的账户'}</div>
-          </a>
+          <AccountButton />
           {/* <motion.div className='flex justify-end flex-1 items-center space-x-2'> */}
              {/* <div className='flex items-center p-1 bg-zinc-100 rounded-xl card'>
                 <div className='px-2'>

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -5,6 +5,7 @@ import { CopyToClipboard } from 'react-copy-to-clipboard';
 import list from '../utils/router'
 // import FollowMe from '../components/FollowMe';
 import isVip from '../utils/isVip';
+import AccountButton from "../components/AccountButton";
 
 export default function index() {
   const navigate = useNavigate();
@@ -75,10 +76,13 @@ export default function index() {
           </a>
         </div>
 
-        <a href='/user' className='absolute top-0 right-0 m-4 bg-green-100 p-1 rounded-full flex items-center text-green-700'>
+        {/* <a href='/user' className='absolute top-0 right-0 m-4 bg-green-100 p-1 rounded-full flex items-center text-green-700'>
           <div className="i-ri-account-circle-fill text-xl" />
           <div className='text-sm mx-1'>我的账户</div>
-        </a>
+        </a> */}
+        <div className='absolute top-0 right-0 m-4'>
+          <AccountButton />
+        </div>
       </div>
       <div text='sm' op50 mb-2>已完成</div>
       <div className='grid grid-cols-2 md:grid-cols-3 gap-3'>