Main Intro component structure and quickfixes

This commit is contained in:
Moris Zen
2018-06-27 17:29:39 +02:00
parent ea7f4bdd21
commit 087408e1c9
6 changed files with 708 additions and 29 deletions

View File

@@ -2,7 +2,7 @@ import React from 'react'
import Link from 'gatsby-link'
import SaburlyLogo from "../images/Saburly-Logo.svg"
const Header = ({ siteTitle }) => (
const Header = () => (
<header>
<nav className="flex items-center justify-between flex-wrap p-6">
<div class="flex items-center flex-no-shrink text-white mr-6">
@@ -12,26 +12,25 @@ const Header = ({ siteTitle }) => (
</div>
<div className="sm:invisible lg:visible w-full block flex-grow lg:flex lg:items-center lg:w-auto">
<ul className="flex text-sm justify-center lg:flex-grow">
<Link to="/services">
<li className="no-underline block mt-4 lg:inline-block lg:mt-0 text-grey-darkest hover:text-teal uppercase mr-4">What We Do
<ul className="flex text-sm justify-center lg:flex-grow">
<Link to="/services">
<li className="no-underline block mt-4 lg:inline-block lg:mt-0 text-grey-darkest hover:text-teal uppercase mr-4">What We Do
</li>
</Link>
<Link to="/about">
<li className="no-underline block mt-4 lg:inline-block lg:mt-0 text-grey-darkest hover:text-teal uppercase mr-4">TEAM
</Link>
<Link to="/about">
<li className="no-underline block mt-4 lg:inline-block lg:mt-0 text-grey-darkest hover:text-teal uppercase mr-4">TEAM
</li>
</Link>
<Link to="/blog">
<li className="no-underline block mt-4 lg:inline-block lg:mt-0 text-grey-darkest hover:text-teal uppercase mr-4">BLOG
</Link>
<Link to="/blog">
<li className="no-underline block mt-4 lg:inline-block lg:mt-0 text-grey-darkest hover:text-teal uppercase mr-4">BLOG
</li>
</Link>
</ul>
</Link>
</ul>
<Link to="/contact" className="no-underline inline-block text-sm px-4 py-2 leading-none border rounded text-grey-darkest border-teal-darkest hover:border-teal hover:text-white hover:bg-teal mt-4 lg:mt-0 uppercase mr-3 rounded-full">Contact</Link>
<Link to="/proposal" className="no-underline inline-block text-sm px-4 py-2 leading-none border rounded text-grey-lightest border-grey-darkest hover:border-transparent hover:text-white hover:bg-white mt-4 lg:mt-0 uppercase bg-grey-darkest hover:bg-teal rounded-full ">Get a free proposal</Link>
</div>
</nav>
{siteTitle}
</header>
)