susieshi/KnowledgeBase_frontend
1
0
Fork 0
mirror of https://github.com/Funkoala14/KnowledgeBase_OOIN.git synced 2025-06-08 05:49:44 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

[dev]change responsive header

Browse Source
This commit is contained in:
susie-laptop 2025-02-28 17:05:36 -05:00
parent 26c81c1fd8
commit 445c30ba0b
1 changed files with 39 additions and 70 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

109
src/layouts/HeaderWithNav.jsx
View File

@ -2,83 +2,52 @@ import React from 'react';
export default function HeaderWithNav() {
return (
<header className='p-3 mb-3 border-bottom'>
<div className='container'>
<div className='d-flex flex-wrap align-items-center justify-content-center justify-content-lg-start'>
<a
href='/'
className='d-flex align-items-center mb-3 mb-md-0 me-md-auto text-dark text-decoration-none'
>
{/* <svg className='bi me-2' width='40' height='32'>
<use xlink:href='#bootstrap' />
</svg> */}
<span className='fs-4'>OOIN 智能知识库</span>
<header className=' navbar navbar-expand-lg'>
<nav class='navbar navbar-expand-lg border-bottom p-3 mb-3 w-100'>
<div class='container-fluid'>
<a class='navbar-brand' href='#'>
OOIN 智能知识库
</a>
<ul className='nav col-12 col-lg-auto col-md-auto me-lg-auto mb-2 justify-content-center mb-md-0'>
<li>
<a href='#' className='nav-link px-2 link-dark'>
知识库
</a>
</li>
<li>
<a href='#' className='nav-link px-2 link-secondary'>
Chat
</a>
</li>
</ul>
<ul className='nav'>
<li className='nav-item'>
<a href='#' className='nav-link link-dark px-2'>
Login
</a>
</li>
<li className='nav-item'>
<a href='#' className='nav-link link-dark px-2'>
Sign up
</a>
</li>
</ul>
{/* <div className='dropdown text-end'>
<a
href='#'
className='d-block link-dark text-decoration-none dropdown-toggle'
data-bs-toggle='dropdown'
aria-expanded='false'
>
<img
src='https://github.com/mdo.png'
alt='mdo'
width='32'
height='32'
className='rounded-circle'
/>
</a>
<ul className='dropdown-menu text-small'>
<li>
<a className='dropdown-item' href='#'>
Settings
<button
class='navbar-toggler'
type='button'
data-bs-toggle='collapse'
data-bs-target='#navbarText'
aria-controls='navbarText'
aria-expanded='false'
aria-label='Toggle navigation'
>
<span class='navbar-toggler-icon'></span>
</button>
<div class='collapse navbar-collapse' id='navbarText'>
<ul class='navbar-nav me-auto mb-lg-0'>
<li class='nav-item'>
<a class='nav-link active' aria-current='page' href='#'>
知识库
</a>
</li>
<li>
<a className='dropdown-item' href='#'>
Profile
</a>
</li>
<li>
<hr className='dropdown-divider' />
</li>
<li>
<a className='dropdown-item' href='#'>
Sign out
<li class='nav-item'>
<a class='nav-link' href='#'>
Chat
</a>
</li>
</ul>
</div> */}
<hr className='d-lg-none'/>
<ul class='navbar-nav mb-2 mb-lg-0'>
<li class='nav-item'>
<a class='nav-link text-dark' href='#'>
Log in
</a>
</li>
<li class='nav-item'>
<a class='nav-link text-dark' href='#'>
Sign up
</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</header>
);
}