SEO performance, remove fading effect and messenger
This commit is contained in:
@@ -25,9 +25,7 @@
|
|||||||
"prismjs": "^1.15.0",
|
"prismjs": "^1.15.0",
|
||||||
"react-headroom": "^2.2.2",
|
"react-headroom": "^2.2.2",
|
||||||
"react-helmet": "^5.2.0",
|
"react-helmet": "^5.2.0",
|
||||||
"react-messenger-customer-chat": "^0.6.2",
|
|
||||||
"react-responsive-mixin": "^0.4.0",
|
"react-responsive-mixin": "^0.4.0",
|
||||||
"react-reveal": "^1.2.2",
|
|
||||||
"react-typed": "^1.0.9",
|
"react-typed": "^1.0.9",
|
||||||
"serve": "^10.0.0",
|
"serve": "^10.0.0",
|
||||||
"slideout": "^1.0.1",
|
"slideout": "^1.0.1",
|
||||||
|
|||||||
@@ -5,7 +5,6 @@ import Helmet from 'react-helmet'
|
|||||||
import Header from '../components/Header'
|
import Header from '../components/Header'
|
||||||
import Footer from '../components/Footer'
|
import Footer from '../components/Footer'
|
||||||
import SideMenu from '../components/SideMenu'
|
import SideMenu from '../components/SideMenu'
|
||||||
import MessengerCustomerChat from 'react-messenger-customer-chat'
|
|
||||||
|
|
||||||
require('typeface-montserrat')
|
require('typeface-montserrat')
|
||||||
require('typeface-pt-serif')
|
require('typeface-pt-serif')
|
||||||
@@ -20,11 +19,6 @@ const Layout = ({ children, data }) => (
|
|||||||
<Helmet
|
<Helmet
|
||||||
link={[{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` }]}
|
link={[{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` }]}
|
||||||
/>
|
/>
|
||||||
<MessengerCustomerChat
|
|
||||||
pageId="715686642152482"
|
|
||||||
appId="1896398823783343"
|
|
||||||
htmlRef="layout"
|
|
||||||
/>
|
|
||||||
<main className="side-panel panel">
|
<main className="side-panel panel">
|
||||||
<Header />
|
<Header />
|
||||||
{children()}
|
{children()}
|
||||||
|
|||||||
@@ -2,7 +2,6 @@ import React from 'react'
|
|||||||
|
|
||||||
import SectionIntro from '../components/SectionIntro'
|
import SectionIntro from '../components/SectionIntro'
|
||||||
import PageIntro from '../components/PageIntro'
|
import PageIntro from '../components/PageIntro'
|
||||||
import Fade from 'react-reveal/Fade'
|
|
||||||
import Card from '../components/Card'
|
import Card from '../components/Card'
|
||||||
import SEO from '../components/SEO'
|
import SEO from '../components/SEO'
|
||||||
|
|
||||||
@@ -15,7 +14,12 @@ import PageTransition from 'gatsby-plugin-page-transitions'
|
|||||||
|
|
||||||
const ContactPage = () => (
|
const ContactPage = () => (
|
||||||
<PageTransition>
|
<PageTransition>
|
||||||
<SEO siteTitle="Saburly - Contact Us" siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions" siteImage={ContactImage} siteUrl="https://saburly.com/contact" />
|
<SEO
|
||||||
|
siteTitle="Saburly - Contact Us"
|
||||||
|
siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions"
|
||||||
|
siteImage={ContactImage}
|
||||||
|
siteUrl="https://saburly.com/contact"
|
||||||
|
/>
|
||||||
<PageIntro
|
<PageIntro
|
||||||
tiltImage
|
tiltImage
|
||||||
headline="Let's connect"
|
headline="Let's connect"
|
||||||
@@ -27,136 +31,130 @@ const ContactPage = () => (
|
|||||||
|
|
||||||
<section className="my-20 container mx-auto w-full md:flex w-full">
|
<section className="my-20 container mx-auto w-full md:flex w-full">
|
||||||
<div className="p-2">
|
<div className="p-2">
|
||||||
<Fade left>
|
<Card team teamMember={Stockholm} title="OFFICE IN STOCKHOLM">
|
||||||
<Card team teamMember={Stockholm} title="OFFICE IN STOCKHOLM">
|
<div className="xsm:flex text-left justify-around text-black text-base p-4">
|
||||||
<div className="xsm:flex text-left justify-around text-black text-base p-4">
|
<div className="py-2">
|
||||||
<div className="py-2">
|
<h4 className="text-black">Adress</h4>
|
||||||
<h4 className="text-black">Adress</h4>
|
<p className="text-black-light font-serif">
|
||||||
<p className="text-black-light font-serif">
|
Saburly AB <br />
|
||||||
Saburly AB <br />
|
Vretenvägen 13 <br />
|
||||||
Vretenvägen 13 <br />
|
171 54 Solna <br />
|
||||||
171 54 Solna <br />
|
Sweden <br />
|
||||||
Sweden <br />
|
</p>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="py-2">
|
|
||||||
<h4 className="text-black">Contact</h4>
|
|
||||||
<p className="font-serif text-black-light">
|
|
||||||
Phone:{' '}
|
|
||||||
<a
|
|
||||||
className="saburly-color hover:text-purple-light no-underline"
|
|
||||||
href="tel:+46760477717"
|
|
||||||
>
|
|
||||||
+46760477717
|
|
||||||
</a>
|
|
||||||
<br />
|
|
||||||
E-mail:{' '}
|
|
||||||
<a
|
|
||||||
className="saburly-color hover:text-purple-light no-underline"
|
|
||||||
href="mailto:sweden@saburly.com"
|
|
||||||
>
|
|
||||||
sweden@saburly.com
|
|
||||||
</a>{' '}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
<div className="py-2">
|
||||||
</Fade>
|
<h4 className="text-black">Contact</h4>
|
||||||
|
<p className="font-serif text-black-light">
|
||||||
|
Phone:{' '}
|
||||||
|
<a
|
||||||
|
className="saburly-color hover:text-purple-light no-underline"
|
||||||
|
href="tel:+46760477717"
|
||||||
|
>
|
||||||
|
+46760477717
|
||||||
|
</a>
|
||||||
|
<br />
|
||||||
|
E-mail:{' '}
|
||||||
|
<a
|
||||||
|
className="saburly-color hover:text-purple-light no-underline"
|
||||||
|
href="mailto:sweden@saburly.com"
|
||||||
|
>
|
||||||
|
sweden@saburly.com
|
||||||
|
</a>{' '}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
<div className="p-2">
|
<div className="p-2">
|
||||||
<Fade right>
|
<Card team teamMember={Sarajevo} title="OFFICE IN SARAJEVO">
|
||||||
<Card team teamMember={Sarajevo} title="OFFICE IN SARAJEVO">
|
<div className="xsm:flex text-left justify-around text-base p-4">
|
||||||
<div className="xsm:flex text-left justify-around text-base p-4">
|
<div className="py-2">
|
||||||
<div className="py-2">
|
<h4 className="text-black">Adress</h4>
|
||||||
<h4 className="text-black">Adress</h4>
|
<p className="font-serif text-black-light">
|
||||||
<p className="font-serif text-black-light">
|
Saburly d.o.o <br />
|
||||||
Saburly d.o.o <br />
|
Hakije Turajlica 2 <br />
|
||||||
Hakije Turajlica 2 <br />
|
71 000 Sarajevo <br />
|
||||||
71 000 Sarajevo <br />
|
Bosnia & Herzegovina <br />
|
||||||
Bosnia & Herzegovina <br />
|
</p>
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="py-2">
|
|
||||||
<h4 className="text-black">Contact</h4>
|
|
||||||
<p className="font-serif text-black-light">
|
|
||||||
Phone:{' '}
|
|
||||||
<a
|
|
||||||
className="saburly-color hover:text-purple-light no-underline"
|
|
||||||
href="tel:+38761909238"
|
|
||||||
>
|
|
||||||
+38761909238
|
|
||||||
</a>{' '}
|
|
||||||
<br />
|
|
||||||
E-mail:{' '}
|
|
||||||
<a
|
|
||||||
className="saburly-color hover:text-purple-light no-underline"
|
|
||||||
href="mailto:bosnia@saburly.com"
|
|
||||||
>
|
|
||||||
bosnia@saburly.com
|
|
||||||
</a>{' '}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
<div className="py-2">
|
||||||
</Fade>
|
<h4 className="text-black">Contact</h4>
|
||||||
|
<p className="font-serif text-black-light">
|
||||||
|
Phone:{' '}
|
||||||
|
<a
|
||||||
|
className="saburly-color hover:text-purple-light no-underline"
|
||||||
|
href="tel:+38761909238"
|
||||||
|
>
|
||||||
|
+38761909238
|
||||||
|
</a>{' '}
|
||||||
|
<br />
|
||||||
|
E-mail:{' '}
|
||||||
|
<a
|
||||||
|
className="saburly-color hover:text-purple-light no-underline"
|
||||||
|
href="mailto:bosnia@saburly.com"
|
||||||
|
>
|
||||||
|
bosnia@saburly.com
|
||||||
|
</a>{' '}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Card>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<div className="bg-saburly-lighter p-8">
|
<div className="bg-saburly-lighter p-8">
|
||||||
<Fade>
|
<section className="container lg:flex justify-between mx-auto">
|
||||||
<section className="container lg:flex justify-between mx-auto">
|
<form
|
||||||
<form
|
action="https://formspree.io/info@saburly.com"
|
||||||
action="https://formspree.io/info@saburly.com"
|
className="w-full max-w-sm mx-auto pt-16 p-6"
|
||||||
className="w-full max-w-sm mx-auto pt-16 p-6"
|
method="POST"
|
||||||
method="POST"
|
>
|
||||||
>
|
<SectionIntro headline="We'd love to hear from you" />
|
||||||
<SectionIntro headline="We'd love to hear from you" />
|
<div className="md:flex flex-wrap">
|
||||||
<div className="md:flex flex-wrap">
|
<input
|
||||||
<input
|
className="appearance-none bg-transparent border-contact block w-full typed-cursor py-2"
|
||||||
className="appearance-none bg-transparent border-contact block w-full typed-cursor py-2"
|
id="grid-first-name"
|
||||||
id="grid-first-name"
|
type="text"
|
||||||
type="text"
|
placeholder="Name"
|
||||||
placeholder="Name"
|
name="name"
|
||||||
name="name"
|
required
|
||||||
required
|
/>
|
||||||
/>
|
|
||||||
|
|
||||||
<input
|
<input
|
||||||
className="appearance-none bg-transparent border-contact block w-full typed-cursor py-2"
|
className="appearance-none bg-transparent border-contact block w-full typed-cursor py-2"
|
||||||
id="grid-first-name"
|
id="grid-first-name"
|
||||||
type="text"
|
type="text"
|
||||||
placeholder="Email"
|
placeholder="Email"
|
||||||
name="_replyto"
|
name="_replyto"
|
||||||
required
|
required
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<textarea
|
<textarea
|
||||||
className="appearance-none bg-transparent border-contact block w-full typed-cursor py-2 border-grey-light"
|
className="appearance-none bg-transparent border-contact block w-full typed-cursor py-2 border-grey-light"
|
||||||
id="grid-last-name"
|
id="grid-last-name"
|
||||||
type="text"
|
type="text"
|
||||||
name="message"
|
name="message"
|
||||||
placeholder="Message"
|
placeholder="Message"
|
||||||
required
|
required
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button
|
|
||||||
className="mt-4 w-full shadow bg-teal hover:bg-teal-light text-white py-2 px-4 rounded"
|
|
||||||
value="Send"
|
|
||||||
type="submit"
|
|
||||||
>
|
|
||||||
SEND
|
|
||||||
</button>
|
|
||||||
</form>
|
|
||||||
<div>
|
|
||||||
<img
|
|
||||||
src={FormImage}
|
|
||||||
alt="Contact Form Image"
|
|
||||||
className="p-10 w-full text-center block md:max-w-lg mx-auto"
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
|
||||||
</Fade>
|
<button
|
||||||
|
className="mt-4 w-full shadow bg-teal hover:bg-teal-light text-white py-2 px-4 rounded"
|
||||||
|
value="Send"
|
||||||
|
type="submit"
|
||||||
|
>
|
||||||
|
SEND
|
||||||
|
</button>
|
||||||
|
</form>
|
||||||
|
<div>
|
||||||
|
<img
|
||||||
|
src={FormImage}
|
||||||
|
alt="Contact Form Image"
|
||||||
|
className="p-10 w-full text-center block md:max-w-lg mx-auto"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
</div>
|
</div>
|
||||||
</PageTransition>
|
</PageTransition>
|
||||||
)
|
)
|
||||||
|
|||||||
@@ -9,7 +9,6 @@ import PageIntro from '../components/PageIntro'
|
|||||||
import InfoBox from '../components/InfoBox'
|
import InfoBox from '../components/InfoBox'
|
||||||
import Technologies from '../components/Technologies'
|
import Technologies from '../components/Technologies'
|
||||||
import Typed from 'react-typed'
|
import Typed from 'react-typed'
|
||||||
import Fade from 'react-reveal/Fade'
|
|
||||||
import SEO from '../components/SEO'
|
import SEO from '../components/SEO'
|
||||||
|
|
||||||
import ImgIntro from '../images/web-development-company.svg'
|
import ImgIntro from '../images/web-development-company.svg'
|
||||||
@@ -30,7 +29,12 @@ import PageTransition from 'gatsby-plugin-page-transitions'
|
|||||||
|
|
||||||
const IndexPage = ({ ...props }) => (
|
const IndexPage = ({ ...props }) => (
|
||||||
<PageTransition>
|
<PageTransition>
|
||||||
<SEO siteTitle="Saburly - App Development & Mobile Design agency that makes you stand out" siteDescription="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out with the help of modern technologies" siteImage={ImgIntro} siteUrl="https://saburly.com" />
|
<SEO
|
||||||
|
siteTitle="Saburly - App Development & Mobile Design agency that makes you stand out"
|
||||||
|
siteDescription="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out with the help of modern technologies"
|
||||||
|
siteImage={ImgIntro}
|
||||||
|
siteUrl="https://saburly.com"
|
||||||
|
/>
|
||||||
<PageIntro
|
<PageIntro
|
||||||
text="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out and gain competitive advantages with the help of modern technologies."
|
text="We're in the business of solving real-world problems with digital solutions. Our mission is to make you stand out and gain competitive advantages with the help of modern technologies."
|
||||||
image={ImgIntro}
|
image={ImgIntro}
|
||||||
@@ -51,164 +55,146 @@ const IndexPage = ({ ...props }) => (
|
|||||||
|
|
||||||
<main>
|
<main>
|
||||||
<section className="container mx-auto max-w-lg text-center mt-16 p-4">
|
<section className="container mx-auto max-w-lg text-center mt-16 p-4">
|
||||||
<Fade>
|
<SectionIntro
|
||||||
<SectionIntro
|
classes="my-10"
|
||||||
classes="my-10"
|
h2Classes="text-2xl sm:text-5xl"
|
||||||
h2Classes="text-2xl sm:text-5xl"
|
headline="Because beautiful code makes our heart pound"
|
||||||
headline="Because beautiful code makes our heart pound"
|
text="What gets us going is our passion for cutting edge technologies and incredible user experiences. We transform frustrations into features and headaches into highlights. And we do it all through our UX design and development process, by coupling form and function to develop world-class websites and apps for businesses of all sizes and sectors."
|
||||||
text="What gets us going is our passion for cutting edge technologies and incredible user experiences. We transform frustrations into features and headaches into highlights. And we do it all through our UX design and development process, by coupling form and function to develop world-class websites and apps for businesses of all sizes and sectors."
|
/>
|
||||||
/>
|
|
||||||
</Fade>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="relative">
|
<section className="relative">
|
||||||
<Fade>
|
<Service
|
||||||
<Service
|
classes="py-8"
|
||||||
classes="py-8"
|
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
|
||||||
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
|
img={ImgDesign}
|
||||||
img={ImgDesign}
|
title="User Experience Design"
|
||||||
title="User Experience Design"
|
text="Our approach is simple: focus on how users might use the product in the best ways possible. We offer UX and UI design services for all screens and devices. The solutions are usually shaped through iterative processes of research, prototyping and testing."
|
||||||
text="Our approach is simple: focus on how users might use the product in the best ways possible. We offer UX and UI design services for all screens and devices. The solutions are usually shaped through iterative processes of research, prototyping and testing."
|
/>
|
||||||
/>
|
|
||||||
</Fade>
|
|
||||||
|
|
||||||
<Fade>
|
<Service
|
||||||
<Service
|
reversed
|
||||||
reversed
|
classes="py-8"
|
||||||
classes="py-8"
|
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
|
||||||
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
|
img={ImgFullstack}
|
||||||
img={ImgFullstack}
|
title="Full-Stack Development"
|
||||||
title="Full-Stack Development"
|
text="We love modern web development. Our talented developers work with both client-side and server-side technologies are always up to speed with cutting edge trends. We deliver high-quality, maintainable code on time and know how to balance between cost, time and quality."
|
||||||
text="We love modern web development. Our talented developers work with both client-side and server-side technologies are always up to speed with cutting edge trends. We deliver high-quality, maintainable code on time and know how to balance between cost, time and quality."
|
imgClasses=""
|
||||||
imgClasses=""
|
/>
|
||||||
/>
|
|
||||||
</Fade>
|
|
||||||
|
|
||||||
<Fade>
|
<Service
|
||||||
<Service
|
img={ImgMobile}
|
||||||
img={ImgMobile}
|
classes="py-8"
|
||||||
classes="py-8"
|
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
|
||||||
h2Classes="text-2xl xsm:text-3xl font-medium saburly-color"
|
imgClasses="max-h-sm"
|
||||||
imgClasses="max-h-sm"
|
title="Mobile App Development"
|
||||||
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."
|
||||||
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."
|
/>
|
||||||
/>
|
|
||||||
</Fade>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="bg-saburly-lighter text-center p-4 my-12">
|
<section className="bg-saburly-lighter text-center p-4 my-12">
|
||||||
<div className="my-8 py-8 container mx-auto max-w-lg">
|
<div className="my-8 py-8 container mx-auto max-w-lg">
|
||||||
<Fade>
|
<SectionIntro
|
||||||
<SectionIntro
|
h2Classes="text-2xl md:text-5xl"
|
||||||
h2Classes="text-2xl md:text-5xl"
|
headline="You'll be in great company"
|
||||||
headline="You'll be in great company"
|
text="By thinking big, designing smart and developing fast, we're helping organizations of various sizes bring life to ideas. We're now eager to hear what challenges you have for us."
|
||||||
text="By thinking big, designing smart and developing fast, we're helping organizations of various sizes bring life to ideas. We're now eager to hear what challenges you have for us."
|
/>
|
||||||
/>
|
<div className="p-4 sm:flex flex-wrap items-center max-w-full justify-around">
|
||||||
<div className="p-4 sm:flex flex-wrap items-center max-w-full justify-around">
|
<div className="sm:w-1/2 md:w-1/6 p-2">
|
||||||
<div className="sm:w-1/2 md:w-1/6 p-2">
|
<img
|
||||||
<img
|
src={LogoColounge}
|
||||||
src={LogoColounge}
|
className="opacity-50 hover:opacity-100 client-logo p-2"
|
||||||
className="opacity-50 hover:opacity-100 client-logo p-2"
|
alt="Colounge Logo"
|
||||||
alt="Colounge Logo"
|
/>
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="sm:w-1/2 md:w-1/6 p-2">
|
|
||||||
<img
|
|
||||||
src={LogoRicoh}
|
|
||||||
className="opacity-50 hover:opacity-100 client-logo p-2"
|
|
||||||
alt="Ricoh Logo"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="sm:w-1/3 md:w-1/6 p-2">
|
|
||||||
<img
|
|
||||||
src={LogoCoor}
|
|
||||||
className="opacity-50 hover:opacity-100 client-logo p-2"
|
|
||||||
alt="Coor Logo"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="sm:w-1/3 md:w-1/6 p-2">
|
|
||||||
<img
|
|
||||||
src={LogoKinnarps}
|
|
||||||
className="opacity-50 hover:opacity-100 client-logo p-2"
|
|
||||||
alt="Kinnarps Logo"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="sm:w-1/3 md:w-1/6 p-2">
|
|
||||||
<img
|
|
||||||
src={LogoIMCG}
|
|
||||||
className="opacity-50 hover:opacity-100 client-logo p-2"
|
|
||||||
alt="IMCG Logo"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div className="sm:w-1/3 md:w-1/6 p-2">
|
|
||||||
<img
|
|
||||||
src={LogoHyrma}
|
|
||||||
className="opacity-50 hover:opacity-100 client-logo p-2"
|
|
||||||
alt="Hyrma Logo"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</Fade>
|
<div className="sm:w-1/2 md:w-1/6 p-2">
|
||||||
|
<img
|
||||||
|
src={LogoRicoh}
|
||||||
|
className="opacity-50 hover:opacity-100 client-logo p-2"
|
||||||
|
alt="Ricoh Logo"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="sm:w-1/3 md:w-1/6 p-2">
|
||||||
|
<img
|
||||||
|
src={LogoCoor}
|
||||||
|
className="opacity-50 hover:opacity-100 client-logo p-2"
|
||||||
|
alt="Coor Logo"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="sm:w-1/3 md:w-1/6 p-2">
|
||||||
|
<img
|
||||||
|
src={LogoKinnarps}
|
||||||
|
className="opacity-50 hover:opacity-100 client-logo p-2"
|
||||||
|
alt="Kinnarps Logo"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="sm:w-1/3 md:w-1/6 p-2">
|
||||||
|
<img
|
||||||
|
src={LogoIMCG}
|
||||||
|
className="opacity-50 hover:opacity-100 client-logo p-2"
|
||||||
|
alt="IMCG Logo"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className="sm:w-1/3 md:w-1/6 p-2">
|
||||||
|
<img
|
||||||
|
src={LogoHyrma}
|
||||||
|
className="opacity-50 hover:opacity-100 client-logo p-2"
|
||||||
|
alt="Hyrma Logo"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<Fade>
|
<div className="text-center lg:flex justify-center">
|
||||||
<div className="text-center lg:flex justify-center">
|
<Button
|
||||||
<Button
|
standard
|
||||||
standard
|
text="More About What We Do"
|
||||||
text="More About What We Do"
|
url="/services"
|
||||||
url="/services"
|
classes="rounded-full m-2 hover:shadow-md text-grey-darker hover:shadow"
|
||||||
classes="rounded-full m-2 hover:shadow-md text-grey-darker hover:shadow"
|
/>
|
||||||
/>
|
<Button
|
||||||
<Button
|
filled
|
||||||
filled
|
text="Let's Get In Touch"
|
||||||
text="Let's Get In Touch"
|
url="/contact"
|
||||||
url="/contact"
|
classes="text-white shadow hover:shadow-md rounded-full m-2 font-light bg-teal hover:bg-teal-dark"
|
||||||
classes="text-white shadow hover:shadow-md rounded-full m-2 font-light bg-teal hover:bg-teal-dark"
|
/>
|
||||||
/>
|
</div>
|
||||||
</div>
|
|
||||||
</Fade>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="text-center p-4 relative">
|
<section className="text-center p-4 relative">
|
||||||
<Fade>
|
<SectionIntro
|
||||||
<SectionIntro
|
h2Classes="py-8 text-2xl md:text-5xl"
|
||||||
h2Classes="py-8 text-2xl md:text-5xl"
|
headline="Sometimes we have fun & publish"
|
||||||
headline="Sometimes we have fun & publish"
|
/>
|
||||||
/>
|
<div className="container mx-auto w-full md:flex md:flex-wrap items-stretch w-full">
|
||||||
</Fade>
|
{props.data.allWordpressPost.edges.map(({ node }) => (
|
||||||
<Fade>
|
<div key={node.id} className="md:w-1/2 p-2">
|
||||||
<div className="container mx-auto w-full md:flex md:flex-wrap items-stretch w-full">
|
<Link
|
||||||
{props.data.allWordpressPost.edges.map(({ node }) => (
|
to={`blog/${node.slug}`}
|
||||||
<div key={node.id} className="md:w-1/2 p-2">
|
className="pointer no-underline saburly-transition hover:opacity-50"
|
||||||
<Link
|
>
|
||||||
to={`blog/${node.slug}`}
|
<Card
|
||||||
className="pointer no-underline saburly-transition hover:opacity-50"
|
url={`blog/${node.slug}`}
|
||||||
>
|
title={node.title}
|
||||||
<Card
|
date={node.date}
|
||||||
url={`blog/${node.slug}`}
|
excerpt={node.excerpt}
|
||||||
title={node.title}
|
image={
|
||||||
date={node.date}
|
node.featured_media
|
||||||
excerpt={node.excerpt}
|
? node.featured_media.localFile.childImageSharp
|
||||||
image={
|
.resolutions
|
||||||
node.featured_media
|
: undefined
|
||||||
? node.featured_media.localFile.childImageSharp
|
}
|
||||||
.resolutions
|
/>
|
||||||
: undefined
|
</Link>
|
||||||
}
|
</div>
|
||||||
/>
|
))}
|
||||||
</Link>
|
</div>
|
||||||
</div>
|
<Button
|
||||||
))}
|
standard
|
||||||
</div>
|
text="More Posts"
|
||||||
</Fade>
|
url="/blog"
|
||||||
<Fade>
|
classes="mt-2 mb-8 hover:shadow-md rounded-full text-grey-darker"
|
||||||
<Button
|
/>
|
||||||
standard
|
|
||||||
text="More Posts"
|
|
||||||
url="/blog"
|
|
||||||
classes="mt-2 mb-8 hover:shadow-md rounded-full text-grey-darker"
|
|
||||||
/>
|
|
||||||
</Fade>
|
|
||||||
</section>
|
</section>
|
||||||
</main>
|
</main>
|
||||||
</PageTransition>
|
</PageTransition>
|
||||||
|
|||||||
@@ -5,7 +5,6 @@ import PageIntro from '../components/PageIntro'
|
|||||||
import SectionIntro from '../components/SectionIntro'
|
import SectionIntro from '../components/SectionIntro'
|
||||||
import WorkStyle from '../components/WorkStyle'
|
import WorkStyle from '../components/WorkStyle'
|
||||||
import Technologies from '../components/Technologies'
|
import Technologies from '../components/Technologies'
|
||||||
import Fade from 'react-reveal/Fade'
|
|
||||||
import SEO from '../components/SEO'
|
import SEO from '../components/SEO'
|
||||||
|
|
||||||
import IntroImage from '../images/agile-practitioners.jpg'
|
import IntroImage from '../images/agile-practitioners.jpg'
|
||||||
@@ -31,7 +30,6 @@ const ServicesPage = () => (
|
|||||||
imgClasses="-mb-12 border-white rounded-lg"
|
imgClasses="-mb-12 border-white rounded-lg"
|
||||||
/>
|
/>
|
||||||
<section className="px-4 py-16">
|
<section className="px-4 py-16">
|
||||||
<Fade>
|
|
||||||
<div className="container mx-auto">
|
<div className="container mx-auto">
|
||||||
<div className="lg:flex">
|
<div className="lg:flex">
|
||||||
<img
|
<img
|
||||||
@@ -85,12 +83,10 @@ const ServicesPage = () => (
|
|||||||
</SectionIntro>
|
</SectionIntro>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Fade>
|
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<section className="bg-saburly relative bg-saburly-lighter px-4 p-16 ">
|
<section className="bg-saburly relative bg-saburly-lighter px-4 p-16 ">
|
||||||
<div className="container mx-auto">
|
<div className="container mx-auto">
|
||||||
<Fade>
|
|
||||||
<div className="lg:flex">
|
<div className="lg:flex">
|
||||||
<div>
|
<div>
|
||||||
<SectionIntro
|
<SectionIntro
|
||||||
@@ -143,8 +139,6 @@ const ServicesPage = () => (
|
|||||||
alt="Fullstack Web Development Agency"
|
alt="Fullstack Web Development Agency"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</Fade>
|
|
||||||
<Fade>
|
|
||||||
<div className="p-8 my-4 bg-white border-bottom-saburly">
|
<div className="p-8 my-4 bg-white border-bottom-saburly">
|
||||||
<h3 className={headerClasses}>Emerging Technologies</h3>
|
<h3 className={headerClasses}>Emerging Technologies</h3>
|
||||||
<p className={textClasses}>
|
<p className={textClasses}>
|
||||||
@@ -161,11 +155,9 @@ const ServicesPage = () => (
|
|||||||
</p>
|
</p>
|
||||||
<Technologies />
|
<Technologies />
|
||||||
</div>
|
</div>
|
||||||
</Fade>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<Fade>
|
|
||||||
<div className="px-4 py-16 bg-saburly-fadeout">
|
<div className="px-4 py-16 bg-saburly-fadeout">
|
||||||
<div className="container mx-auto xl:flex justify-center items-center">
|
<div className="container mx-auto xl:flex justify-center items-center">
|
||||||
<SectionIntro
|
<SectionIntro
|
||||||
@@ -179,7 +171,6 @@ const ServicesPage = () => (
|
|||||||
</div>
|
</div>
|
||||||
<WorkStyle />
|
<WorkStyle />
|
||||||
</div>
|
</div>
|
||||||
</Fade>
|
|
||||||
</PageTransition>
|
</PageTransition>
|
||||||
)
|
)
|
||||||
|
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ import SEO from '../components/SEO'
|
|||||||
require('prismjs/themes/prism-tomorrow.css')
|
require('prismjs/themes/prism-tomorrow.css')
|
||||||
|
|
||||||
import PageTransition from 'gatsby-plugin-page-transitions'
|
import PageTransition from 'gatsby-plugin-page-transitions'
|
||||||
import MessengerCustomerChat from 'react-messenger-customer-chat'
|
|
||||||
import favicon32 from '../images/favicon32.png'
|
import favicon32 from '../images/favicon32.png'
|
||||||
|
|
||||||
class PostDefault extends Component {
|
class PostDefault extends Component {
|
||||||
@@ -20,7 +19,13 @@ class PostDefault extends Component {
|
|||||||
const { data } = this.props
|
const { data } = this.props
|
||||||
return (
|
return (
|
||||||
<PageTransition>
|
<PageTransition>
|
||||||
<SEO postSEO siteTitle={data.wordpressPost.title} siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions" siteImage={data.wordpressPost.featured_media.source_url} siteUrl={`https://www.saburly.com/blog/${data.wordpressPost.slug}`} />
|
<SEO
|
||||||
|
postSEO
|
||||||
|
siteTitle={data.wordpressPost.title}
|
||||||
|
siteDescription="We are always on a lookout for exciting challenges. Feel free to contact us if you want to start something great or just have any questions"
|
||||||
|
siteImage={data.wordpressPost.featured_media.source_url}
|
||||||
|
siteUrl={`https://www.saburly.com/blog/${data.wordpressPost.slug}`}
|
||||||
|
/>
|
||||||
<Helmet
|
<Helmet
|
||||||
link={[
|
link={[
|
||||||
{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` },
|
{ rel: 'shortcut icon', type: 'image/png', href: `${favicon32}` },
|
||||||
@@ -42,11 +47,6 @@ class PostDefault extends Component {
|
|||||||
__html: data.wordpressPost.content,
|
__html: data.wordpressPost.content,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<MessengerCustomerChat
|
|
||||||
pageId="715686642152482"
|
|
||||||
appId="1896398823783343"
|
|
||||||
htmlRef="blogpost"
|
|
||||||
/>
|
|
||||||
</main>
|
</main>
|
||||||
</PageTransition>
|
</PageTransition>
|
||||||
)
|
)
|
||||||
|
|||||||
12
yarn.lock
12
yarn.lock
@@ -8327,12 +8327,6 @@ react-lifecycles-compat@^3.0.4:
|
|||||||
version "3.0.4"
|
version "3.0.4"
|
||||||
resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
|
resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"
|
||||||
|
|
||||||
react-messenger-customer-chat@^0.6.2:
|
|
||||||
version "0.6.2"
|
|
||||||
resolved "https://registry.yarnpkg.com/react-messenger-customer-chat/-/react-messenger-customer-chat-0.6.2.tgz#39462c90a951b06fa01d33e37547c47ca715aa63"
|
|
||||||
dependencies:
|
|
||||||
prop-types "^15.6.0"
|
|
||||||
|
|
||||||
react-proxy@^3.0.0-alpha.0:
|
react-proxy@^3.0.0-alpha.0:
|
||||||
version "3.0.0-alpha.1"
|
version "3.0.0-alpha.1"
|
||||||
resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-3.0.0-alpha.1.tgz#4400426bcfa80caa6724c7755695315209fa4b07"
|
resolved "https://registry.yarnpkg.com/react-proxy/-/react-proxy-3.0.0-alpha.1.tgz#4400426bcfa80caa6724c7755695315209fa4b07"
|
||||||
@@ -8347,12 +8341,6 @@ react-responsive-mixin@^0.4.0:
|
|||||||
enquire.js "^2.1.1"
|
enquire.js "^2.1.1"
|
||||||
json2mq "^0.2.0"
|
json2mq "^0.2.0"
|
||||||
|
|
||||||
react-reveal@^1.2.2:
|
|
||||||
version "1.2.2"
|
|
||||||
resolved "https://registry.yarnpkg.com/react-reveal/-/react-reveal-1.2.2.tgz#f47fbc44debc4c185ae2163a215a9e822c7adfef"
|
|
||||||
dependencies:
|
|
||||||
prop-types "^15.5.10"
|
|
||||||
|
|
||||||
react-router-dom@^4.1.1:
|
react-router-dom@^4.1.1:
|
||||||
version "4.3.1"
|
version "4.3.1"
|
||||||
resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.3.1.tgz#4c2619fc24c4fa87c9fd18f4fb4a43fe63fbd5c6"
|
resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-4.3.1.tgz#4c2619fc24c4fa87c9fd18f4fb4a43fe63fbd5c6"
|
||||||
|
|||||||
Reference in New Issue
Block a user