Styling of footer nad header component

This commit is contained in:
Moris Zen
2018-07-05 14:43:17 +02:00
parent b5334fb4ff
commit 7388d27fe9
3 changed files with 14 additions and 14 deletions

View File

@@ -22,28 +22,28 @@ const Footer = () => (
<img
src={Facebook}
alt="Facebook Social Media"
className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
className="max-w-2.5 opacity-50 hover:opacity-100 w-full"
/>
</div>
<div>
<img
src={Instagram}
alt="Instagram Social Media"
className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
className="max-w-2.5 opacity-50 hover:opacity-100 w-full"
/>
</div>
<div>
<img
src={Twitter}
alt="Twitter Social Media"
className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
className="max-w-2.5 opacity-50 hover:opacity-100 w-full"
/>
</div>
<div>
<img
src={LinkedIn}
alt="LinkedIn Social Media"
className="max-w-2.5 opacity-50 hover:opacity-100 hover:shadow-lg w-full"
className="max-w-2.5 opacity-50 hover:opacity-100 w-full"
/>
</div>
</div>
@@ -63,21 +63,21 @@ const Footer = () => (
</div>
</div>
<div className="lg:w-3/4 ml-10 p-4">
<div className="lg:w-3/4 ml-10">
<div className="p-4 text-center lg:text-left sm:flex justify-between">
<nav>
<p className="font-thin text-white opacity-50">Sitemap</p>
<ul className="list-reset text-sm inline-block">
<Link className="block my-2" to="/">
<Link className="block my-2 hover:opacity-70" to="/">
<li className={menuClasses}>Home</li>
</Link>
<Link className="block my-2" to="/services">
<Link className="block my-2 hover:opacity-70" to="/services">
<li className={menuClasses}>What We Do</li>
</Link>
<Link className="block my-2" to="/about">
<Link className="block my-2 hover:opacity-70" to="/about">
<li className={menuClasses}>TEAM</li>
</Link>
<Link className="block my-2" to="/blog">
<Link className="block my-2 hover:opacity-70" to="/blog">
<li className={menuClasses}>BLOG</li>
</Link>
</ul>

View File

@@ -27,10 +27,10 @@ const Header = () => (
<li className={menuClasses}>What We Do</li>
</Link>
<Link to="/about">
<li className={menuClasses}>TEAM</li>
<li className={menuClasses}>Team</li>
</Link>
<Link to="/blog">
<li className={menuClasses}>BLOG</li>
<li className={menuClasses}>Blog</li>
</Link>
<Button

View File

@@ -93,13 +93,13 @@ const IndexPage = () => (
standard
text="More About What We Do"
url="/services"
classes="m-1 rounded-full text-grey-darker hover:shadow"
classes="m-1 rounded-full hover:shadow-md text-grey-darker hover:shadow"
/>
<Button
standard
text="How We Work"
url="/how-we-work"
classes="m-1 rounded-full text-grey-darker hover:shadow"
classes="m-1 rounded-full hover:shadow-md text-grey-darker hover:shadow"
/>
</div>
</section>
@@ -143,7 +143,7 @@ const IndexPage = () => (
standard
text="More Posts"
url="/blog"
classes="mt-2 mb-8 rounded-full text-grey-darker hover:shadow"
classes="mt-2 mb-8 hover:shadow-md rounded-full text-grey-darker"
/>
</section>
</main>