import React from "react";
import {
  Hero, HeroPrimarySection, HeroAside, HeroAsideItem,
} from "@components/Hero";

const MembershipPageHero: React.FC = () => (
  <Hero>
    <HeroPrimarySection
      header="Liity killan jäseneksi!"
      // eslint-disable-next-line max-len
      text="
          Kuka tahansa Sähköinsinöörikillan toiminnasta kiinnostunut voi liittyä killan jäseneksi.
          Jäseneksi haluavien tulee täyttää jäsenhakemus ja maksaa jäsenmaksu.
          Linkin jäsenhakemukseen löydät vierestä ja maksutiedot alempaa tältä sivulta."
    />

    <HeroAside bgColor="lightTurquoise">
      <HeroAsideItem
        header="Täytä jäsenhakemus"
        link="https://api.sahkoinsinoorikilta.fi/members/application"
        linkText="Hakemuslomake&nbsp; ›"
      />
      <HeroAsideItem
        header="Maksa jäsenmaksu"
        link="#jasenmaksu"
        linkText="Maksutiedot&nbsp; ›"
      />
    </HeroAside>
  </Hero>
);

export default MembershipPageHero;
