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

Partner logos, styling

Browse Source
This commit is contained in:
Moris Zen
2018-08-30 12:17:36 +02:00
parent 37b7466cad
commit c615c03318
8 changed files with 88 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/Button.js
View File

@@ -9,7 +9,9 @@ let standardBtn = 'border hover:bg-teal hover:text-white hover:border-teal'
const Button = ({ ...props }) => (
<Link
to={props.url}
className={`${props.standard ? standardBtn : ''} ${defaultClasses} ${props.classes}`}
className={`${props.standard ? standardBtn : ''} ${defaultClasses} ${
props.classes
}`}
>
{props.text}
</Link>

21
src/components/Card.js
View File

@@ -5,22 +5,23 @@ import ImgSprint from '../images/wow-we-did-design-sprint-remotely.png'
const Card = ({ ...props }) => (
<article className="h-full w-full rounded overflow-hidden shadow bg-white border-bottom-saburly hover:shadow-md">
<Link to={props.url}>
<Link
to={props.url}
className="no-underline saburly-transition hover:opacity-50"
>
{props.image ? (
<img className="w-full" src={props.image.src} />
) : (
<img className="w-full" src={ImgSprint} alt="Sprint Work" />
)}
</Link>
<div className="px-6 py-4">
<Link className="no-underline" to={props.url}>
<div className="px-6 py-4">
<h3 className="text-black font-bold text-xl mb-2">{props.title}</h3>
</Link>
<p
className="text-grey-darker text-base"
dangerouslySetInnerHTML={{ __html: props.excerpt }}
/>
</div>
<p
className="text-grey-darker text-base"
dangerouslySetInnerHTML={{ __html: props.excerpt }}
/>
</div>
</Link>
</article>
)

12
src/components/Footer.js
View File

@@ -20,10 +20,10 @@ const Footer = () => (
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">
<span className="flex bg-teal hover:bg-teal-dark saburly-transition rounded-full uppercase px-3 py-1 text-xs font-bold mr-3">
Let's Connect
</span>
<span className="font-normal mr-2 text-left flex-auto">
<span className="font-normal mr-2 hover:opacity-80 saburly-transition text-left flex-auto">
Tell us about your project and get a free proposal
</span>
<svg
@@ -49,7 +49,7 @@ const Footer = () => (
<img
src={Facebook}
alt="Facebook Social Media"
className="max-w-2.5 opacity-80 hover:opacity-100 w-full"
className="max-w-2.5 saburly-transition opacity-80 hover:opacity-100 w-full"
/>
</a>
</div>
@@ -58,7 +58,7 @@ const Footer = () => (
<img
src={Instagram}
alt="Instagram Social Media"
className="max-w-2.5 opacity-80 hover:opacity-100 w-full"
className="max-w-2.5 saburly-transition opacity-80 hover:opacity-100 w-full"
/>
</a>
</div>
@@ -67,7 +67,7 @@ const Footer = () => (
<img
src={Twitter}
alt="Twitter Social Media"
className="max-w-2.5 opacity-80 hover:opacity-100 w-full"
className="max-w-2.5 saburly-transition opacity-80 hover:opacity-100 w-full"
/>
</a>
</div>
@@ -76,7 +76,7 @@ const Footer = () => (
<img
src={LinkedIn}
alt="LinkedIn Social Media"
className="max-w-2.5 opacity-80 hover:opacity-100 w-full"
className="max-w-2.5 saburly-transition opacity-80 hover:opacity-100 w-full"
/>
</a>
</div>

1
src/images/logo-colounge.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 370.5 91.8"><title>Asset 2</title><path d="M99.4,39.6h17c1.6,0,.9-2.3-.4-2.3H99c-1.6,0-1,2.3.4,2.3Z" style="fill:#1d1d1b"/><path d="M368.5,36.2a9.7,9.7,0,0,1-.7,3.9,9.4,9.4,0,0,1-5,4.9,8.4,8.4,0,0,1-3.5.7,9.2,9.2,0,0,1-3.8-.7,10,10,0,0,1-2.9-2,9.8,9.8,0,0,1-2-3,11.7,11.7,0,0,1-.7-3.8,9.9,9.9,0,0,1,2.8-6.8,9.5,9.5,0,0,1,3-1.9,8.6,8.6,0,0,1,3.6-.7,8.4,8.4,0,0,1,3.5.7,9.4,9.4,0,0,1,5,4.9A9.2,9.2,0,0,1,368.5,36.2Zm-2,0a7.8,7.8,0,0,0-.6-3.1,7,7,0,0,0-1.5-2.5,7.3,7.3,0,0,0-2.3-1.6,6.7,6.7,0,0,0-2.8-.6,6.8,6.8,0,0,0-2.9.6,6.3,6.3,0,0,0-2.3,1.6,7.2,7.2,0,0,0-1.6,2.5,10.1,10.1,0,0,0-.5,3.1,8.1,8.1,0,0,0,.5,3.1,7.2,7.2,0,0,0,1.4,2.4,6.3,6.3,0,0,0,2.3,1.7,7.5,7.5,0,0,0,3.1.6,6.6,6.6,0,0,0,2.8-.5,7.3,7.3,0,0,0,2.3-1.6,7,7,0,0,0,1.5-2.5A7.9,7.9,0,0,0,366.5,36.2Zm-9.1,5.4h-1.7V31.2h3.9a4.8,4.8,0,0,1,2.9.7,2.7,2.7,0,0,1,.9,2.3,2.8,2.8,0,0,1-.7,2.1,3.5,3.5,0,0,1-2,.7l3,4.6h-2L359,37.2h-1.6Zm1.9-5.9h.9l.8-.2.5-.5a1.5,1.5,0,0,0,.2-.9c0-.4,0-.6-.2-.8a1,1,0,0,0-.5-.4l-.8-.2h-2.8v3.1Z" style="fill:#1d1d1b"/><path d="M20.2,63.1C1.9,63.1.6,52.9.2,49.6-1.5,36.9,10.6,18.1,36.3,8.4A39.2,39.2,0,0,1,61.8,7.2,28.7,28.7,0,0,1,71.6,12a1,1,0,1,1-1.3,1.5c-.1-.1-13.6-10.7-33.3-3.2C12.3,19.6.6,37.4,2.1,49.3c1.1,8.2,6.7,11.8,18.1,11.8,9.6,0,31.7-10.7,49.2-23.9a.9.9,0,0,1,1.3.1,1,1,0,0,1,.1,1.3A13.7,13.7,0,0,0,69.4,41c3.1-.7,7.8-1,11.4,1a9.2,9.2,0,0,1,5,8.8A10.3,10.3,0,0,1,80,59.6a8.5,8.5,0,0,1-7.3-.3c-3.7-1.9-6.3-6.2-7-9.5a12,12,0,0,1,.4-6,1,1,0,0,1-.8-.6.6.6,0,0,1,0-.6C48.5,54.2,29.2,63.1,20.2,63.1ZM68.4,43.2a10.9,10.9,0,0,0-.7,6.2c.6,2.7,2.8,6.5,5.9,8.1a6.2,6.2,0,0,0,5.6.2,8.2,8.2,0,0,0,4.6-7,7.2,7.2,0,0,0-3.9-6.9C76.2,41.7,71,42.6,68.4,43.2Zm-1.5-1.7h0Z" style="fill:#1d1d1b"/><path d="M297.3,91.8a5,5,0,0,1-3.8-2.2c-4.4-5.7,3.7-20,19-33.5.7-2.8,1.2-5.5,1.8-8.2a11.1,11.1,0,0,1-2.9,1.4,7.1,7.1,0,0,1-7.8-2.5c-1.7-2.1-1.2-4.6-.2-6.5l-1.5,1c-2.8,1.7-4.8,4.2-6.9,6.7s-2,2.5-3.1,3.6a4,4,0,0,1-2.5,1.4c-2.4.3-4.5-1.7-5-3.8a13.8,13.8,0,0,1,.2-5,2.8,2.8,0,0,1,.1-.9,4.2,4.2,0,0,0-1.4-3.8,8.7,8.7,0,0,0-7.1-2c-5.5,1-7.7,5.7-10,10.7L265,50.9a1,1,0,0,1-1.9-.7c.5-2.6,1-4.8,1.6-7.3a26.1,26.1,0,0,1,.6-2.7c0-.2.1-.5.1-.7l-1.6,2.9a33.1,33.1,0,0,1-4.5,7.1c-2.8,3.2-5.1,2.6-6.3,2a7.7,7.7,0,0,1-3.1-5.1c-.9,2.4-2.3,4.8-4.4,5.7a4.6,4.6,0,0,1-4.2-.5,7.6,7.6,0,0,1-3.8-6.7,15.3,15.3,0,0,1,1.1-4.8c.8-2.2,1.5-4.2.2-6.3s-5.2-4.7-9.5-5.3h-1.5c-.5.6-.9,1.3-1.4,2l2.5,2.7c3.2,3.4,6.9,7.4,6,12.8-1.4,8.3-6.2,8.7-8.2,8.6-4.7-.5-9.3-5.5-9.3-10.3a5.7,5.7,0,0,0,.1-1.3c-4.1,4.7-9.1,8.4-15.3,8.1s-11.2-3.3-16.3-6.2a56.6,56.6,0,0,0-7.7-4H178c-6.7,8.1-14.5,14.1-22.3,17.1s-21.4,4.1-28.2-2.6a6.1,6.1,0,0,1-2.1-4.2c-.1-5.1,6-8.6,11.3-11.1a54.1,54.1,0,0,1,40.7-1.6C192.1,19.8,196.5,1,196.5.8a1,1,0,0,1,1.2-.8,1.1,1.1,0,0,1,.8,1.2A105.9,105.9,0,0,1,179.3,39c2.6,1.2,5.2,2.6,7.6,4,4.9,2.8,10,5.7,15.4,6,7,.3,12.5-5.2,17-11.5a38.1,38.1,0,0,1,2.3-4l.4-.6a18.1,18.1,0,0,1,1.8-2.7l-.9-1.3a1.4,1.4,0,0,1,0-.9c.5-1.4,2.2-1.7,4.1-1.7.2-.1.4,0,.7,0l1.8.3c2.4.3,8.1,1.6,11,6.1s.8,5.7,0,8.1a12.3,12.3,0,0,0-1,4.1,5.9,5.9,0,0,0,2.8,5,2.8,2.8,0,0,0,2.5.3c1.6-.6,3-3.2,4.1-7.1,2.2-8.4,5.3-9.1,6-9.2a.9.9,0,0,1,.9.6.9.9,0,0,1-.1,1.1,22.4,22.4,0,0,0-3.8,7.6c-.5,2,.4,5.5,2.1,6.5s2.3.1,3.8-1.5a38.1,38.1,0,0,0,4.3-6.8c.9-1.7,1.9-3.6,3.2-5.7.3-.4.9-1.4,1.9-1s1.1,1.2,0,6a11.7,11.7,0,0,1-.5,2c2-3.5,4.6-6.4,9.1-7.2a11.2,11.2,0,0,1,8.9,2.5,6.5,6.5,0,0,1,2,5.6c-.1.3-.1.6-.2.9a12.4,12.4,0,0,0-.1,4.3,3,3,0,0,0,2.7,2.3,3.1,3.1,0,0,0,1.3-.8l3-3.5c2.1-2.6,4.3-5.3,7.4-7.2,10.5-6.6,14.3-2.2,14.5-2a1.1,1.1,0,0,1,.1,1.2,1,1,0,0,1-1.1.4c-1.6-.4-6.2-1-7.9.5s-3,3.6-1.2,5.9a5.3,5.3,0,0,0,5.6,1.8,6.3,6.3,0,0,0,4.5-4.3c0-.2.1-.4.1-.7a1.1,1.1,0,0,1,1.2-.7.9.9,0,0,1,.8,1.1,2.4,2.4,0,0,1-.2.8l-.6,2.9-1.5,7.4c3.5-2.8,8-6,12.1-8.7a7.2,7.2,0,0,1,.6-7.7,8.1,8.1,0,0,1,3-2.6,6.2,6.2,0,0,1,5-.3c.1,0,4.3,2.3,4.5,3.8a1.1,1.1,0,0,1-.7,1.1c0,.1-4.3,2.7-9.6,6.2,3.2,3.3,10.7,5.3,39.6,7.9a1,1,0,0,1,.9,1.1,1.1,1.1,0,0,1-1.1.9c-31.4-2.8-37.8-5-41.1-8.8-4.8,3.3-10.2,7.1-13.8,10.2l-.2.2C311.9,67.5,308.8,77.8,303,87c-1.6,2.4-3.3,4.7-5.6,4.8Zm14.4-32.3c-13.6,12.8-19.7,25-16.6,28.8.8,1,1.5,1.6,2.2,1.5s2.9-2.1,4-3.9C306.4,77.8,309.4,68.8,311.7,59.5ZM159.2,37.1a51.9,51.9,0,0,0-21.7,4.6c-2.8,1.3-10.2,4.8-10.1,9.3a4.6,4.6,0,0,0,1.5,2.8c5.9,5.8,17.6,5.5,26,2.2s14.7-8.5,21.1-16.1A49.8,49.8,0,0,0,159.2,37.1Zm61.9,1.3a15.9,15.9,0,0,0-1.7,5.9c0,3.7,3.7,7.8,7.5,8.2s5.2-2.2,6-7-2.3-7.6-5.5-11.1l-2.1-2.3Q223.4,35.3,221.1,38.4Zm112.5-2.2a3.8,3.8,0,0,0-1.9.5,4.6,4.6,0,0,0-2.2,2,5.2,5.2,0,0,0-.7,5.4l9-5.8a17.8,17.8,0,0,0-2.7-1.8A4,4,0,0,0,333.6,36.2Zm5.1,1.6h0ZM225.1,28.5Z" style="fill:#1d1d1b"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
src/images/logo-imcg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

54
src/pages/index.js
View File

@@ -19,6 +19,8 @@ import LogoIBM from '../images/logo-ibm-color.svg'
import LogoRicoh from '../images/logo-ricoh-color.svg'
import LogoKinnarps from '../images/logo-kinnarps-color.svg'
import LogoCoor from '../images/logo-coor-color.svg'
import LogoIMCG from '../images/logo-imcg.png'
import LogoColounge from '../images/logo-colounge.svg'
import PageTransition from 'gatsby-plugin-page-transitions'
@@ -87,22 +89,42 @@ const IndexPage = ({ ...props }) => (
headline="Ambitious projects bring great responsibility"
text="By thinking big, designing smart and developing fast, we have helped organizations of various sizes bring life to ideas and existing products. We're now eager to hear what challenges you have for us"
/>
<div className="p-4 md:flex items-center max-w-full justify-center">
<img
src={LogoRicoh}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Ricoh Logo"
/>
<img
src={LogoCoor}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Coor Logo"
/>
<img
src={LogoKinnarps}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Kinnarps Logo"
/>
<div className="p-4 sm:flex flex-wrap items-center max-w-full justify-around">
<div className="sm:w-1/2 md:w-1/5 p-2">
<img
src={LogoColounge}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Colounge Logo"
/>
</div>
<div className="sm:w-1/2 md:w-1/5 p-2">
<img
src={LogoRicoh}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Ricoh Logo"
/>
</div>
<div className="sm:w-1/3 md:w-1/5 p-2">
<img
src={LogoCoor}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Coor Logo"
/>
</div>
<div className="sm:w-1/3 md:w-1/5 p-2">
<img
src={LogoKinnarps}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="Kinnarps Logo"
/>
</div>
<div className="sm:w-1/3 md:w-1/5 p-2">
<img
src={LogoIMCG}
className="opacity-50 hover:opacity-100 client-logo p-1"
alt="IMCG Logo"
/>
</div>
</div>
<Button

30
src/styles/general.css
View File

@@ -92,6 +92,20 @@ body {
.client-logo {
max-height: 3rem;
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-o-filter: grayscale(100%);
-ms-filter: grayscale(100%);
filter: grayscale(100%);
transition: all 0.3s ease;
}
.client-logo:hover {
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-o-filter: grayscale(0%);
-ms-filter: grayscale(0%);
filter: grayscale(0%);
}
.border-bottom-saburly {
@@ -99,6 +113,12 @@ body {
0 2px 3px 0 rgba(51, 6, 13, 0.12);
}
.saburly-bottom-shadow {
-webkit-box-shadow: 0 7px 6px 6px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 7px 6px -6px rgba(0, 0, 0, 0.3);
box-shadow: 0 7px 6px -6px rgba(0, 0, 0, 0.3);
}
.border-contact {
border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
@@ -115,10 +135,6 @@ body {
margin-bottom: -0.4rem;
}
.border-saburly-header {
box-shadow: 0 4px 2px -2px #000000;
}
.saburly-overlay-shadow {
background-color: RGBA(0, 0, 0, 0.1);
}
@@ -130,3 +146,9 @@ body {
h2 span {
color: #5763ab;
}
.saburly-transition,
a li,
a {
transition: all 0.25s ease;
}

6
yarn.lock
View File

@@ -3838,9 +3838,9 @@ gatsby-cli@^1.1.58:
yargs "^11.1.0"
yurnalist "^0.2.1"
gatsby-image@^1.0.54:
version "1.0.54"
resolved "https://registry.yarnpkg.com/gatsby-image/-/gatsby-image-1.0.54.tgz#84ab7d723e48a031eb698d8552ad331943d369fd"
gatsby-image@^1.0.55:
version "1.0.55"
resolved "https://registry.yarnpkg.com/gatsby-image/-/gatsby-image-1.0.55.tgz#716c7f44d9949864c55331bd3316b751c94ca0c8"
dependencies:
babel-runtime "^6.26.0"
prop-types "^15.6.0"