tweag/nickel
1
1
Fork 0
mirror of https://github.com/tweag/nickel.git synced 2024-10-06 08:07:37 +03:00
Code Issues Projects Releases Wiki Activity

Fix menu centering

Browse Source
This commit is contained in:
Yann Hamdaoui 2021-07-01 09:25:24 +02:00
parent d1c4c80deb
commit 7356d3ff37
2 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
website/src/components/header.js
View File

@ -3,11 +3,11 @@ import { Link } from "gatsby"
import PropTypes from "prop-types"
import {StaticImage} from "gatsby-plugin-image";
const Header = ({ siteTitle, menuLinks }) => (
const Header = ({ menuLinks }) => (
<header>
<nav className="navbar navbar-expand-lg navbar-light bg-primary">
<div className="container-fluid">
<Link className="navbar-brand" to="/">
<div className="container-fluid justify-content-center">
<Link className="navbar-brand flex-fill w-100" to="/">
<StaticImage className={"logo-navbar"} src="../images/nickel-logo-2.svg" alt="logo"/><span className="nickel">Nickel</span>
</Link>
<button className="navbar-toggler" type="button" data-bs-toggle="collapse"
@ -15,13 +15,14 @@ const Header = ({ siteTitle, menuLinks }) => (
aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span className="navbar-toggler-icon"/>
</button>
<div className="collapse navbar-collapse" id="navbarNavAltMarkup">
<div className="navbar-nav mx-auto">
<div className="collapse navbar-collapse justify-content-center flex-fill w-100" id="navbarNavAltMarkup">
<div className="navbar-nav">
{menuLinks.map(link => (
<Link key={link.name} className="nav-link" activeClassName="active" to={link.link}>{link.name}</Link>
))}
</div>
</div>
<ul className={'nav navbar-nav w-100 justify-contend-end'}/>
</div>
</nav>
</header>

2
website/src/components/layout.js
View File

@ -30,7 +30,7 @@ export default function Layout({children}) {
]}
>
</Helmet>
<Header siteTitle={data.site.siteMetadata.title} menuLinks={data.site.siteMetadata.menuLinks}/>
<Header menuLinks={data.site.siteMetadata.menuLinks}/>
<div>
{children}
</div>