<template>
  <div class="login-error">
    <header class="info-header">
      <h1
        class="public-page__title"
        data-cy="login-error-title">{{ title }}</h1>
    </header>
    <main
      class="login-error__content content"
      data-cy="login-error-text">
      <p class="content__instructions">
        {{ errorMessage }}
      </p>
      <p>
        <router-link
          :to="{name: 'hello'}"
          class="hep-link">
          Startseite anzeigen
        </router-link>
      </p>

    </main>

  </div>

</template>

<script>
  export default {
    name: 'LoginErrorPage',
    props: ['title', 'errorMessage']
  };
</script>

<style scoped lang="scss">
@import "@/styles/_variables.scss";
  @import "@/styles/_mixins.scss";

.content__instructions {
  margin: $medium-spacing 0;
  @include regular-text;
}
</style>
