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

Design tweaks and color changes

Browse Source
This commit is contained in:
Moris Zen
2018-08-29 14:52:49 +02:00
parent 9e16924bfb
commit 90c05a76c2
6 changed files with 28 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
src/components/Footer.js
View File

@@ -2,7 +2,7 @@ import React from 'react'
import Link from 'gatsby-link'
import Button from './Button'
import LogoSaburly from '../images/Saburly-logo.svg'
import LogoSaburly from '../images/saburly-logo-white.svg'
import Facebook from '../images/facebook.svg'
import Instagram from '../images/instagram.svg'
@@ -14,10 +14,10 @@ let menuClasses =
const Footer = () => (
<footer className="saburly-main-bg">
<div className="text-center py-4 lg:px-4">
<div className="text-center py-4 lg:px-4 saburly-overlay-shadow">
<Link className="no-underline text-white" to="/contact">
<div
className="p-2 items-center text-indigo-lightest leading-none lg:rounded-full flex lg:inline-flex"
className="p-2 items-center text-white leading-none lg:rounded-full flex lg:inline-flex"
role="alert"
>
<span className="flex rounded-full bg-indigo uppercase px-2 py-1 text-xs font-bold mr-3">
@@ -36,7 +36,7 @@ const Footer = () => (
</div>
</Link>
</div>
<div className="container mx-auto lg:flex">
<div className="container mx-auto my-4 lg:flex">
<div className="lg:w-1/4 p-4">
<img
src={LogoSaburly}
@@ -81,26 +81,12 @@ const Footer = () => (
</a>
</div>
</div>
<div>
<a
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>
<a
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>
</div>
</div>
<div className="lg:w-3/4">
<div className="p-4 text-center lg:text-left sm:flex justify-around">
<nav>
<p className="font-thin text-white opacity-50">Sitemap</p>
<p className="font-thin text-white opacity-80">Sitemap</p>
<ul className="list-reset text-sm inline-block">
<Link className="block my-2 hover:opacity-70" to="/">
<li className={menuClasses}>Home</li>
@@ -117,14 +103,14 @@ const Footer = () => (
</ul>
</nav>
<div>
<p className="font-thin text-white opacity-50">Office - Sweden</p>
<p className="text-white my-2 opacity-80 leading-normal">
<p className="font-thin text-white opacity-80">Office - Sweden</p>
<p className="text-white my-2 leading-normal">
Saburly AB<br />Vretenvägen 13<br />171 54 Solna<br />Sweden
</p>
</div>
<div>
<p className="font-thin text-white opacity-50">Office - Bosnia</p>
<p className="text-white my-2 opacity-80 leading-normal">
<p className="font-thin text-white opacity-80">Office - Bosnia</p>
<p className="text-white my-2 leading-normal">
Saburly d.o.o<br />Hakije Turajlica 2<br />71 000 Sarajevo<br />Bosnia
& Herzegovina
</p>

2
src/components/Header.js
View File

@@ -13,7 +13,7 @@ class Header extends Component {
render() {
return (
<header className="saburly-main-bg saburly-bottom-shadow">
<nav className="container border-saburly-header mx-auto flex items-center justify-between lg:p-6 p-4">
<nav className="container mx-auto flex items-center justify-between lg:p-6 p-4">
<Link to="/">
<div className="max-w-xs mr-8">
<img

10
src/components/SideMenu.js
View File

@@ -51,7 +51,7 @@ class SideMenu extends Component {
X
</button>
<Link to="/" className="side-close menu-home no-underline">
<li className="hover:bg-indigo hover:opacity-100 text-right no-underline text-2xl uppercase p-4 text-white">
<li className="hover:bg-white hover:text-black text-right no-underline text-2xl uppercase p-4 text-white">
Home
</li>
</Link>
@@ -59,22 +59,22 @@ class SideMenu extends Component {
to="/services"
className="side-close menu-services no-underline"
>
<li className="hover:bg-indigo hover:opacity-100 text-right no-underline text-2xl uppercase p-4 text-white">
<li className="hover:bg-white hover:text-black text-right no-underline text-2xl uppercase p-4 text-white">
Services
</li>
</Link>
<Link to="/about" className="side-close menu-about no-underline">
<li className="hover:bg-indigo hover:opacity-100 text-right no-underline text-2xl uppercase p-4 text-white">
<li className="hover:bg-white hover:text-black text-right no-underline text-2xl uppercase p-4 text-white">
About Us
</li>
</Link>
<Link to="/blog" className="side-close menu-blog no-underline">
<li className="hover:bg-indigo hover:opacity-100 text-right no-underline text-2xl uppercase p-4 text-white">
<li className="hover:bg-white hover:text-black text-right no-underline text-2xl uppercase p-4 text-white">
Blog
</li>
</Link>
<Link to="/contact" className="side-close menu-contact no-underline">
<li className="hover:bg-indigo hover:opacity-100 text-right no-underline text-2xl uppercase p-4 text-white">
<li className="hover:bg-white hover:text-black text-right no-underline text-2xl uppercase p-4 text-white">
Contact
</li>
</Link>