40 lines
1.2 KiB
JavaScript

import { useState } from 'react';
import { Link } from 'react-router-dom';
import logo from '../assets/logo.webp';
const Navbar = () => {
const [isOpen, setIsOpen] = useState(false);
const toggleMenu = () => {
setIsOpen(!isOpen);
};
return (
<nav className="navbar">
<div className="container navbar-container">
<Link to="/about" className="logo">
<img src={logo} alt="Sokuree Logo" className="logo-image" width="40" height="40" />
Sokuree Consultant
</Link>
<div className={`nav-links ${isOpen ? 'active' : ''}`}>
<Link to="/about" onClick={toggleMenu}>회사소개</Link>
<Link to="/services" onClick={toggleMenu}>서비스</Link>
<Link to="/cases" onClick={toggleMenu}>사례</Link>
<Link to="/news" onClick={toggleMenu}>소식</Link>
<Link to="/resources" onClick={toggleMenu}>자료실</Link>
</div>
<div className="hamburger" onClick={toggleMenu}>
<span className="bar"></span>
<span className="bar"></span>
<span className="bar"></span>
</div>
</div>
</nav>
);
};
export default Navbar;