import React from 'react';
import { Paragraph } from 'app/shared/components/text/text';
import { TopNavigation } from 'app/modules/navigation/components/topNavigation';


const UnderMaintenancePage = () => {
  return (
    <div className="o-page-layout o-page-layout--sticky-header o-page-layout--aside">
      <header className="o-page-layout__header">
        <TopNavigation withoutNavItems />
      </header>
      <main className="o-page-layout__content">
        <div className="o-layout o-layout--vertical o-layout--aligned u-margin-top--jumbo">
          <div>
            <img alt="maintenance icon" src="/assets/images/maintenance-icon.svg" className="u-margin-bottom--enormous u-margin-top--big" />
          </div>
          <Paragraph extraClass="o-gutter o-gutter-top--small u-align--center">
            This page is under maintenance, please try again at a later time.
          </Paragraph>
        </div>
      </main>
    </div>
  );
};

export default UnderMaintenancePage;