import React from 'react';

import { Masthead, MastheadBody, MastheadLogo } from '@digigov/ui/app/Masthead';
import { CallToAction } from '@digigov/ui/form/Button/CallToAction';
import logo3 from '@digigov/ui/govgr/images/minedu-logo-base64';
import { Container } from '@digigov/ui/layouts/Basic/Container';
import { Main } from '@digigov/ui/layouts/Basic/Main';
import { Heading } from '@digigov/ui/typography/Heading';

export const WithLogo = (_: any) => (
  <Masthead>
    <Container>
      <Main>
        <MastheadLogo src={logo3} alt="minedu logo" />
        <Heading>Σχεδιάστε την υπηρεσία σας, με το στυλ του GOV.GR</Heading>
        <MastheadBody>
          Χρησιμοποιείστε αυτόν τον οδηγό ώστε να φτιάξετε μια υπηρεσία συνεπή
          στα πρότυπα του GOV.GR. Αποκτήστε γνώση από την έρευνα και την
          εμπειρία άλλων ομάδων και αποφύγετε την επανάληψη εργασιών που έχουν
          ήδη γίνει.
        </MastheadBody>
        <CallToAction href="#">Ξεκινήστε εδώ</CallToAction>
      </Main>
    </Container>
  </Masthead>
);

export default WithLogo;