KnowledgeBase_frontend/src/layouts/HeaderWithNav.jsx

import React from 'react';

export default function HeaderWithNav() {
    return (
        <header className=' navbar navbar-expand-lg'>
            <nav className='navbar navbar-expand-lg border-bottom p-3 mb-3 w-100'>
                <div className='container-fluid'>
                    <a className='navbar-brand' href='#'>
                        OOIN 智能知识库
                    </a>
                    <button
                        className='navbar-toggler'
                        type='button'
                        data-bs-toggle='collapse'
                        data-bs-target='#navbarText'
                        aria-controls='navbarText'
                        aria-expanded='false'
                        aria-label='Toggle navigation'
                    >
                        <span className='navbar-toggler-icon'></span>
                    </button>
                    <div className='collapse navbar-collapse' id='navbarText'>
                        <ul className='navbar-nav me-auto mb-lg-0'>
                            <li className='nav-item'>
                                <a className='nav-link active' aria-current='page' href='#'>
                                    知识库
                                </a>
                            </li>
                            <li className='nav-item'>
                                <a className='nav-link' href='#'>
                                    Chat
                                </a>
                            </li>
                        </ul>
                        <hr className='d-lg-none' />
                        <ul className='navbar-nav mb-2 mb-lg-0'>
                            <li className='nav-item'>
                                <a className='nav-link text-dark' href='#'>
                                    Log in
                                </a>
                            </li>
                            <li className='nav-item'>
                                <a className='nav-link text-dark' href='#'>
                                    Sign up
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </nav>
        </header>
    );
}