hongjli
2025-03-26 77f33c1addb4776d5cbf28e406f16f9281f54fa1
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
"use client";
 
import Link from 'next/link';
import Image from 'next/image';
import { useState } from 'react';
 
const Navbar = () => {
  const [isMenuOpen, setIsMenuOpen] = useState(false);
 
  return (
    <nav className="fixed top-0 left-0 w-full bg-[#2F3C7E] text-white z-50">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
        <div className="flex items-center justify-between h-16">
          {/* Logo */}
          <div className="flex-shrink-0">
            <Link href="/" className="flex items-center">
              <div className="w-8 h-8 bg-[#e1c7f1] rounded-lg flex items-center justify-center">
                <span className="text-[#2F3C7E] text-sm font-bold">帷</span>
              </div>
              <span className="ml-2 text-xl font-bold">帷幄君臣</span>
            </Link>
          </div>
 
          {/* Desktop Menu */}
          <div className="hidden md:flex items-center space-x-8">
            <Link href="/platform" className="hover:text-[#FBEAEB]">数字员工平台</Link>
            <Link href="/chat" className="hover:text-[#FBEAEB]">聊天室</Link>
            <Link href="/training" className="hover:text-[#FBEAEB]">训练场</Link>
          </div>
 
          {/* Login Button */}
          <div className="hidden md:flex items-center">
            <button className="bg-gradient-to-r from-[#FF416C] to-[#FF4B2B] px-6 py-2 rounded-full">
              登录
            </button>
          </div>
 
          {/* Mobile Menu Button */}
          <div className="md:hidden">
            <button
              onClick={() => setIsMenuOpen(!isMenuOpen)}
              className="inline-flex items-center justify-center p-2 rounded-md text-white hover:text-[#FBEAEB]"
            >
              <svg
                className="h-6 w-6"
                fill="none"
                viewBox="0 0 24 24"
                stroke="currentColor"
              >
                {isMenuOpen ? (
                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
                ) : (
                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
                )}
              </svg>
            </button>
          </div>
        </div>
      </div>
 
      {/* Mobile Menu */}
      {isMenuOpen && (
        <div className="md:hidden">
          <div className="px-2 pt-2 pb-3 space-y-1 sm:px-3">
            <Link href="/platform" className="block px-3 py-2 hover:bg-[#FBEAEB] hover:text-[#2F3C7E]">数字员工平台</Link>
            <Link href="/chat" className="block px-3 py-2 hover:bg-[#FBEAEB] hover:text-[#2F3C7E]">聊天室</Link>
            <Link href="/training" className="block px-3 py-2 hover:bg-[#FBEAEB] hover:text-[#2F3C7E]">训练场</Link>
            <button className="w-full mt-4 bg-gradient-to-r from-[#FF416C] to-[#FF4B2B] px-6 py-2 rounded-full">
              登录
            </button>
          </div>
        </div>
      )}
    </nav>
  );
};
 
export default Navbar;