178 lines
6.7 KiB
JavaScript
178 lines
6.7 KiB
JavaScript
import React from 'react'
|
|
|
|
import SectionIntro from '../components/SectionIntro'
|
|
import Button from '../components/Button'
|
|
import Card from '../components/Card'
|
|
import Service from '../components/Service'
|
|
import PageIntro from '../components/PageIntro'
|
|
import InfoBox from '../components/InfoBox'
|
|
import Technologies from '../components/Technologies'
|
|
|
|
import ImgIntro from '../images/web-development-agency.svg'
|
|
import ImgDesign from '../images/ux-ui-design.svg'
|
|
import ImgFullstack from '../images/fullstack-web-development.svg'
|
|
import ImgMobile from '../images/mobile-development.svg'
|
|
import ServicesBg from '../images/services-background.svg'
|
|
|
|
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'
|
|
|
|
const IndexPage = ({ ...props }) => (
|
|
<div>
|
|
<PageIntro
|
|
button
|
|
buttonText="Let's Connect"
|
|
url="/contact"
|
|
buttonClasses="text-white font-normal shadow hover:shadow-md rounded-full mt-4 font-light bg-teal hover:bg-teal-dark mb-20"
|
|
intro="Welcome To Saburly"
|
|
headline="We build the right software for you"
|
|
text="Saburly is a team of highly experienced, creative and passionate engineers. Our mission is clear: to make you stand out and gain competitive advantages with the help of modern technologies."
|
|
image={ImgIntro}
|
|
/>
|
|
|
|
<main>
|
|
<section className="container mx-auto max-w-lg text-center my-12 p-4">
|
|
<SectionIntro
|
|
intro="What We Offer"
|
|
headline="Because great code makes our heart pound"
|
|
text="We have a deep passion for cutting edge technologies and incredible user experiences. We create custom end-to-end solutions that will make you stand out. Our experienced tech leads can even help you with initial analysis, architecture design, testing and deployments"
|
|
/>
|
|
</section>
|
|
|
|
<section className="bg-saburly relative bg-saburly-fadeout">
|
|
<Service
|
|
img={ImgDesign}
|
|
title="User Experience (UX) Design"
|
|
text="Our approach is simple: focus on how users might use the product in the best way possible. We offer UX and interface design for all screens and devices. The solutions are usually shaped through iterative processes of research, prototyping and testing."
|
|
/>
|
|
|
|
<Service
|
|
reversed
|
|
img={ImgFullstack}
|
|
title="Full-Stack Web Development"
|
|
text="At Saburly, we are experts in modern web development using both client-side and server-side technologies. Our talented developers work with popular languages and are always up to speed on the cutting edge trends in web application development. We deliver high-quality, maintainable code on time and know how to balance between cost, time and quality."
|
|
/>
|
|
|
|
<Service
|
|
img={ImgMobile}
|
|
imgClasses="max-h-sm"
|
|
title="Mobile App Development"
|
|
text="We have what it takes to develop competitive iOS and Android applications using both native languages and hybrid solutions. Solutions for iOS are built with Swift & Objective-C and Android solutions are built with Java & Kotlin. We love using technologies like React Native to build cross-platform native apps."
|
|
/>
|
|
|
|
<div className="py-8 text-center lg:flex justify-center">
|
|
<Button
|
|
standard
|
|
text="More About What We Do"
|
|
url="/services"
|
|
classes="mb-8 lg:mb-24 rounded-full hover:shadow-md text-grey-darker hover:shadow"
|
|
/>
|
|
</div>
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1400.8 96.4">
|
|
<title>bg-saburly-white</title>
|
|
<path
|
|
d="M417.7,96.4C655.2,93.3,743.6,0,983.1,0h417.7V96.4H417.7Z"
|
|
transform="translate(0 0)"
|
|
style={{ fill: '#fff' }}
|
|
/>
|
|
</svg>
|
|
</section>
|
|
|
|
<section className="container mx-auto max-w-lg text-center p-4 my-12">
|
|
<SectionIntro
|
|
intro="Clients"
|
|
headline="With ambitious projects comes great responsibility"
|
|
text="We think big, design smart and develop fast. We have helped organizations of various sizes bring life to ideas and existing products. We're now really interested in hearing how we can help you"
|
|
/>
|
|
<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>
|
|
|
|
<Button
|
|
filled
|
|
text="Let's Get In Touch"
|
|
url="/contact"
|
|
classes="text-white font-normal shadow hover:shadow-md rounded-full mt-2 font-light bg-teal hover:bg-teal-dark"
|
|
/>
|
|
</section>
|
|
|
|
<section className="container mx-auto text-center p-4">
|
|
<SectionIntro
|
|
intro="Blog & Social Media"
|
|
headline="Occasionally we find the time to have fun and publish"
|
|
/>
|
|
<div className="container mx-auto p-4 w-full md:flex md:flex-wrap items-stretch w-full">
|
|
{props.data.allWordpressPost.edges.map(({ node }) => (
|
|
<div key={node.id} className="md:w-1/2 p-2">
|
|
<Card
|
|
url={`blog/${node.slug}`}
|
|
title={node.title}
|
|
date={node.date}
|
|
excerpt={node.excerpt}
|
|
image={
|
|
node.featured_media
|
|
? node.featured_media.localFile.childImageSharp.resolutions
|
|
: undefined
|
|
}
|
|
/>
|
|
</div>
|
|
))}
|
|
</div>
|
|
<Button
|
|
standard
|
|
text="More Posts"
|
|
url="/blog"
|
|
classes="mt-2 mb-8 hover:shadow-md rounded-full text-grey-darker"
|
|
/>
|
|
</section>
|
|
</main>
|
|
</div>
|
|
)
|
|
|
|
export const query = graphql`
|
|
query indexPostsQuery {
|
|
allWordpressPost(limit: 2) {
|
|
edges {
|
|
node {
|
|
id
|
|
title
|
|
excerpt
|
|
status
|
|
slug
|
|
date(formatString: "MMMM DD, YYYY")
|
|
featured_media {
|
|
localFile {
|
|
childImageSharp {
|
|
resolutions(width: 600, height: 300) {
|
|
src
|
|
width
|
|
height
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
`
|
|
|
|
export default IndexPage
|