import React from 'react';
import { Link } from 'react-router-dom';
import './Header.css';

const Header: React.FC = () => {
  return (
    <header className="header">
      <div className="container">
        <div className="nav-brand">
          <Link to="/" className="brand-link">
            <h1>🍳 Rezepte Klaus</h1>
          </Link>
        </div>
        <nav className="nav-menu">
          <Link to="/" className="nav-link">Alle Rezepte</Link>
          <Link to="/recipes/new" className="nav-link">Neues Rezept</Link>
          <Link to="/ingredients" className="nav-link">Zutaten</Link>
        </nav>
      </div>
    </header>
  );
};

export default Header;