<ion-header>
  <ion-toolbar color="primary">
    <ion-img src="/assets/jobhero_large.svg" style="max-width:8.25em; margin:auto"></ion-img>
  </ion-toolbar>
</ion-header>
<ion-content>
  <swiper-container pagination="true" slides-per-view="1" space-between="0" centered-slides="true" class="landing-swiper">
    <swiper-slide>
      <div class="slide-content">
        <img src="/assets/slides/ic_start.svg"/>
        <h1>{{'landing.slide_1.1' | translate}}<br>{{'landing.slide_1.2' | translate}}</h1>
      </div>
    </swiper-slide>
    <swiper-slide>
      <div class="slide-content">
        <img src="/assets/slides/ic_slide1.svg"/>
        <h1>{{'landing.slide_2.1' | translate}}<br>{{'landing.slide_2.2' | translate}}</h1>
      </div>
    </swiper-slide>
    <swiper-slide>
      <div class="slide-content">
        <img src="/assets/slides/ic_slide2.svg"/>
        <h1>{{'landing.slide_3.1' | translate}}<br>{{'landing.slide_3.2' | translate}}</h1>
      </div>
    </swiper-slide>
    <swiper-slide>
      <div class="slide-content">
        <img src="/assets/slides/ic_slide3.svg"/>
        <h1>{{'landing.slide_4' | translate}}</h1>
      </div>
    </swiper-slide>
    <swiper-slide>
      <div class="slide-content">
        <img src="/assets/slides/ic_slide4.svg"/>
        <h1>{{'landing.slide_5' | translate}}</h1>
      </div>
    </swiper-slide>
  </swiper-container>
</ion-content>
<ion-footer>
  <ion-toolbar>
    <ion-row>
      <ion-col>
        <ion-button color="primary" expand="full" (click)="login()">{{'auth.login' | translate}}</ion-button>
      </ion-col>
      <ion-col>
        <ion-button expand="full" color="secondary" (click)="register()">{{'auth.signup' | translate}}</ion-button>
      </ion-col>
    </ion-row>
  </ion-toolbar>
</ion-footer>
