321

src/components/DtailScrollView.tsx

@@ -41,12 +41,11 @@ export const DetailScrollView = (props: ScrollViewType) => {
   BScroll.use(MouseWheel);
   BScroll.use(ScrollBar)
   BScroll.use(ObserveDOM);
-  const { wrapHeight, children } = props;
+  const { children } = props;
   const wrapRef = useRef<HTMLDivElement>(null);
   const [scrollObj, setScrollObj] = useState<BScrollConstructor<{}>>();
-  const [currentPage,setCurrentPage] = useState(0)
   useEffect(()=>{
-    const scrollEl =  initBScroll(wrapRef.current as HTMLDivElement)
+    const scrollEl = initBScroll(wrapRef.current as HTMLDivElement)
     setScrollObj(scrollEl)
     return () => {
       scrollObj?.destroy();

src/components/Navbar/index.tsx

@@ -2,6 +2,7 @@ import { IProps } from "@/common/Iprops.interface";
 import * as React from 'react';
 import { useState } from 'react';
 import Logo from '@/assets/img/logo.png';
+import LogoWhite from '@/assets/img/logo_white.png'
 import { Link, useLocation } from 'react-router-dom';
 import { AppContext } from "@/store/AppProvider";
 export interface IAppProps extends IProps {
@@ -12,29 +13,28 @@ const HoverLink = () =>{
   const slgurl = import.meta.env.VITE_SLG
   const slcurl = import.meta.env.VITE_SLC
   const lzburl = import.meta.env.VITE_LZB
-  const value = React.useContext(AppContext)
+
   const goLink = (name:string)=>{
     switch(name){
       case 'slc':
-        window.open(slcurl,'_blank')
+          window.open(slcurl,'_blank')
         break;
       case 'slg':
-        window.open(slgurl,'_blank')
+          window.open(slgurl,'_blank')
         break;
         case 'lzb':
           window.open(lzburl,'_blank')
-          break; 
+        break; 
     }
   }
-
+  
   return (
     <div
-     className='relative content-1-cn text-slate-400'
-    onPointerEnter={()=>setOnHover(true)}
+     className='relative content-1-cn text-[#061E3B] font-normal'
+      onPointerEnter={()=>setOnHover(true)}
     onPointerLeave={()=>setOnHover(false)}
     >
      <div className='cursor-pointer'
-
      >合作生态</div>
      {
        onHover?
@@ -45,8 +45,8 @@ const HoverLink = () =>{
               animate-fadeIn
               animate-alternate
               animate-fill-both
-               bg-opacity-25
-              -translate-x-[18%] text-black rounded-lg flex-col
+              bg-opacity-25
+              -translate-x-[18%]  text-theme-dark rounded-lg flex-col
                 items-center justify-center text-center py-3 px-2 bg-[#EAF0F4]'>
                 <div className='my-[8px] cursor-pointer  hover:text-theme-blue' onClick={()=>goLink('slc')}>上链查</div>
                 <div className='my-[8px] cursor-pointer  hover:text-theme-blue' onClick={()=>goLink('slg')}>
@@ -55,7 +55,7 @@ const HoverLink = () =>{
                 <div className='my-[8px] cursor-pointer  hover:text-theme-blue' onClick={()=>goLink('lzb')}>
                 链证宝
                 </div>
-
+                
               </div>
             </div>
          :''
@@ -67,20 +67,23 @@ const HoverLink = () =>{
 
 export default function Navbar (props: IAppProps) {
   const {pathname} = useLocation()
-
+  const {data} = React.useContext(AppContext)
+  React.useEffect(()=>{
+    console.log(22222);
+      
+  },[data.theme])
   return (
-      <nav className='flex min-w-[1440px]  justify-between absolute px-[120px] w-full top-0 z-[99999] py-6 text-sm text-slate-400 '>
+      <nav className='flex min-w-[1440px]  justify-between absolute px-[120px] w-full top-0 z-[99999] py-6 text-sm text-[#061E3B] font-normal '>
         <div className='left '>
            <img src={Logo} />
         </div>
-        <div className='right content-1-cn flex gap-x-12'>
-        <Link to='/' className={`hover:text-black ${pathname ==='/'?'text-black':'text-slate-400'}`}>Baas33</Link>
-        <Link to='chain33' className={`hover:text-black ${pathname ==='/chain33'?'text-black':'text-slate-400'}`}>Chain33</Link>
+        <div className='right content-1-cn items-start flex gap-x-12'>
+        <Link to='/' className={`hover:text-theme-blue ${pathname ==='/'?' text-theme-dark content-sub2-title-cn py-0' :'text-[#061E3B] font-normal'}`}>Baas33</Link>
+        <Link to='chain33' className={`hover:text-theme-blue ${pathname ==='/chain33'?' text-theme-dark content-sub2-title-cn py-0' :'text-[#061E3B] font-normal'}`}>Chain33</Link>
         <HoverLink />
-       <Link to='news' className={`hover:text-black ${pathname ==='/news'?'text-black':'text-slate-400'}`}>新闻动态</Link>
-        {/* <Link to='classes' className={`hover:text-black ${pathname ==='/classes'?'text-black':'text-slate-400'}`}>公开课</Link> */}
-        <Link to='about' className={`hover:text-black ${pathname ==='/about'?'text-black':'text-slate-400'}`}>关于我们</Link>
-
+       <Link to='news' className={`hover:text-theme-blue ${pathname ==='/news'?' text-theme-dark content-sub2-title-cn py-0' :'text-[#061E3B] font-normal'}`}>新闻动态</Link>
+        {/* <Link to='classes' className={`hover: text-theme-dark ${pathname ==='/classes'?' text-theme-dark':'text-[#061E3B] font-normal'}`}>公开课</Link> */}
+        <Link to='about' className={`hover:text-theme-blue ${pathname ==='/about'?' text-theme-dark content-sub2-title-cn py-0' :'text-[#061E3B] font-normal'}`}>关于我们</Link>
         </div>
         {/* <div className='right flex-grow-0'>
             toolbar

src/main.tsx

@@ -8,9 +8,11 @@ import { BrowserRouter } from "react-router-dom";
 
 const Root = ReactDOM.createRoot(document.getElementById("root")!);
 Root.render(
+
   <BrowserRouter>
     <AppProvider>
       <App />
     </AppProvider>
   </BrowserRouter>
+
 );

src/store/AppProvider.tsx

@@ -3,13 +3,9 @@ import {useLocation} from 'react-router-dom'
 
 const data ={
     device:'',
-    layouts:{
-        currentPage:'',
-        pageIndex:1
-    },
-    theme:{
-        color:'light'
-    }
+    currentPage:'',
+    pageIndex:0,
+    theme:'light'
 }
 export const AppContext = createContext<{data:typeof data,dispatch:any}>({
     data:data,
@@ -22,9 +18,21 @@ interface Actions {
 }
 const AppReducer = (state:typeof data,action:Actions)=>{
     const {type,payload} = action
-    // switch(type){
-    //     case
-    // }
+     switch(type){
+        case 'slideOnChange':
+            state.pageIndex = payload.pageIndex
+            if(state.currentPage==='/chain33'&&state.pageIndex===1&&state.theme==='light'){
+                state.theme = 'dark'
+            }else{
+                state.theme = 'light'
+            }            
+        break;
+        case 'routerOnChange':
+            state.currentPage = payload.currentPage
+        break;
+    }
+    console.log(state);
+    
     return state
 }
 
@@ -32,8 +40,7 @@ export const AppProvider = (props: any)=>{
     const [state,dispatch] = useReducer(AppReducer,data)
     const location = useLocation()
     useEffect(()=>{
-        console.log('changed,1111');
-        
+        dispatch({type:'routerOnChange',payload:{currentPage:location.pathname}})
     },[location])
     return(
         <AppContext.Provider value={{data:state,dispatch}}>