import Head from 'next/head' ;
import styles from '../styles/Showcase.module.css' ;
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faTractor } from '@fortawesome/free-solid-svg-icons'
import { faBatteryFull } from '@fortawesome/free-solid-svg-icons'
import { faHandshake } from '@fortawesome/free-solid-svg-icons'
import { faMoneyBillWave } from '@fortawesome/free-solid-svg-icons'
import { faForward } from '@fortawesome/free-solid-svg-icons'
import { faStream } from '@fortawesome/free-solid-svg-icons'
import { faQuoteLeft } from '@fortawesome/free-solid-svg-icons'
import { faQuoteRight } from '@fortawesome/free-solid-svg-icons'
export default function Showcase() {
return (
< div className = { "page " + styles . showcase } >
< Head >
< title > { process . env . NEXT_PUBLIC_NAME } | Showcase < / title >
< / Head >
< section className = "container" >
< article className = "content" >
< section >
< h2 className = { "mt-reset" } > ⭐ Highlighted clients < / h2 >
< h5 >
{ `
Take a look at some of our happy past clients and the websites we built for them .
` }
< / h5 >
< / section >
< section className = { styles . showcaseClient } >
< div >
< h3 > 🏘 ️ Larum Nidis < / h3 >
< p > { `
This site was built with Wordpress in 2019 for a Dutch client .
It is designed to mostly be a one - pager design , but can be extended to have more pages with ease .
` }</p>
< p > 🌍 Visit < a href = "https://larumnidis.nl/" target = "_blank" rel = "noreferrer" > laurmnidis . nl < / a > < / p >
< / div >
< div >
< img src = "/img/larumnidis.png" / >
< / div >
< / section >
< section className = { styles . showcaseClient } >
< div >
< h3 > 😎 Invesvpo < / h3 >
< p >
< FontAwesomeIcon icon = { faQuoteLeft } size = "1x" style = { { color : "darkgray" } } / >
{ " Even though I had no idea of how I wanted my website to look, I think it turned out looking good. All I gave them to work with was a moodboard, but they kept in touch with me to make sure it was perfect. " }
< FontAwesomeIcon icon = { faQuoteRight } size = "1x" style = { { color : "darkgray" } } / >
< / p >
< p > 🌍 Visit < a href = "https://invesvpo.com/" target = "_blank" rel = "noreferrer" > invesvpo . com < / a > < / p >
< / div >
< div >
< img src = "/img/invesvpo.png" / >
< / div >
< / section >
< section className = { styles . showcaseClient } >
< div >
< h3 > ⛪ Life Centre Livingston < / h3 >
< p > { `
This site was made in 2018 with Wordpress for a local church and has many features like galleries , calendar ,
blogging and file uploads .
` }</p>
< p > 🌍 Visit < a href = "https://lifecentrelivingston.com/" target = "_blank" rel = "noreferrer" > lifecentrelivingston . com < / a > < / p >
< / div >
< div >
< img src = "/img/lifecentrelivingston.png" / >
< / div >
< / section >
< section className = { styles . showcaseClient } >
< div >
< h3 > 🦊 Trick The Fox < / h3 >
< p >
< FontAwesomeIcon icon = { faQuoteLeft } size = "1x" style = { { color : "darkgray" } } / >
{ " The site is amazing, the work that went into it is incredible. " }
{ " The look and small details make it so amazing. " }
{ " They were always there to answer any questions I had and were happy to change the things I wanted. " }
< FontAwesomeIcon icon = { faQuoteRight } size = "1x" style = { { color : "darkgray" } } / >
< / p >
< p > 🌍 Visit < a href = "https://trickthefox.com/" target = "_blank" rel = "noreferrer" > trickthefox . com < / a > < / p >
< / div >
< div >
< img src = "/img/trickthefox.png" / >
< / div >
< / section >
{ /* <hr/ >
< section >
< h2 > 🏗 ️ Other experiences and projects < / h2 >
< h5 > { `
In our every day lives we come across shortcomings or needs in technology , and sometimes we create our own solutions for them .
Sometimes we believe that these solutions could help more people and decide to release them publicly so that anyone can use them .
These applications also help us further showcase our quality and abilities to potential clients .
They are not ready for use yet , but you can still read more about them below .
` }</h5>
{ ` Maker, Picto Designer, Flame, The Moonlit Den, UNIVERSE ` }
< / section > * / }
< / article >
< / section >
< / div >
)
}