old-v2-frontend/src/pages/about.js

import React, { Component } from 'react'

import PageIntro from '../components/PageIntro'
import SectionIntro from '../components/SectionIntro'

import IntroImage from '../images/web-development-consultancy.jpg'
import MeaningSaburly from '../images/coding-practice.svg'

class AboutPage extends Component {
  componentDidMount() {
    let tiltjs = require('vanilla-tilt')
    tiltjs.init(document.querySelector('.postImgContainer'), {
      max: 25,
      speed: 400,
    })
  }

  render() {
    return (
      <div>
        <PageIntro
          headline="Founded by developers"
          text="...We know the challenges and pitfalls when creating modern software. ...Focused on creating solutions that make valuable impact"
          image={IntroImage}
          imgClasses="border-white border-8 rounded postImgContainer -mb-12"
        />

        <section className="container mx-auto my-12 p-4">
          <div className="md:flex justify-center items-center">
            <img
              src={MeaningSaburly}
              className="hidden lg:block max-h-xs"
              alt="User Experience Design Agency"
            />
            <SectionIntro
              headline="Meaning of Saburly"
              text="...Patience. ...Our goal is long-term engagement."
            />
          </div>
        </section>

        <section className="container mx-auto my-12 p-4">
          <SectionIntro
            headline="The Team"
            text="We are a small company with a personal touch that knows our stuff. Our team consists of handpicked expert software developers, designers and system architects - all highly motivated to help you succeed."
          />
        </section>
      </div>
    )
  }
}

export default AboutPage