senaduka/old-v2-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Restructuring and styling of footer

Browse Source
This commit is contained in:
Moris Zen
2018-07-05 13:32:53 +02:00
parent edaecfffca
commit b5334fb4ff
1 changed files with 25 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
src/components/Footer.js
View File

@@ -14,9 +14,9 @@ let menuClasses =
const Footer = () => ( const Footer = () => (
<footer className="bg-indigo-darker"> <footer className="bg-indigo-darker">
<div className="container mx-auto pt-10 pb-10 lg:flex"> <div className="container mx-auto pt-10 lg:flex">
<div className="lg:w-1/4 p-4"> <div className="lg:w-1/4 p-4">
<img src={LogoSaburly} alt="Saburly Logo" className="max-w-full" /> <img src={LogoSaburly} alt="Saburly Logo" className="w-full" />
<div className="flex justify-between social-icons py-2"> <div className="flex justify-between social-icons py-2">
<div> <div>
<img <img
@@ -47,34 +47,24 @@ const Footer = () => (
/> />
</div> </div>
</div> </div>
<a <div>
className="opacity-70 hover:opacity-100 pb-1 no-underline text-white block" <a
href="mailto:info@saburly.com" className="text-center lg:text-left opacity-70 hover:opacity-100 py-4 lg:py-1 text-xl lg:text-sm no-underline text-white block"
> href="mailto:info@saburly.com"
E-mail: info@saburly.com >
</a> E-mail: info@saburly.com
<a </a>
className="opacity-70 hover:opacity-100 pt-1 no-underline text-white block" <a
href="tel:+46760477717" className="text-center text-xl lg:text-sm lg:text-left opacity-70 hover:opacity-100 no-underline text-white block"
> href="tel:+46760477717"
Phone: +46760477717 >
</a> Phone: +46760477717
</a>
</div>
</div> </div>
<div className="lg:w-3/4 ml-10 p-4"> <div className="lg:w-3/4 ml-10 p-4">
<div className="lg:flex items-center justify-around"> <div className="p-4 text-center lg:text-left sm:flex justify-between">
<h3 className="text-white font-light">
Let's start a new project together
</h3>
<Button
text="Contact Us"
standard
classes="rounded-full text-white hover:shadow"
url="/contact"
/>
</div>
<div className="mt-4 lg:flex justify-between">
<nav> <nav>
<p className="font-thin text-white opacity-50">Sitemap</p> <p className="font-thin text-white opacity-50">Sitemap</p>
<ul className="list-reset text-sm inline-block"> <ul className="list-reset text-sm inline-block">
@@ -108,6 +98,14 @@ const Footer = () => (
</div> </div>
</div> </div>
</div> </div>
<div className="sm:flex items-center text-center justify-center pb-8">
<Button
text="Say Hello"
standard
classes="rounded-full text-white hover:shadow mx-2"
url="/contact"
/>
</div>
</footer> </footer>
) )