<template>
  <div class="error-page">
    <div class="error-page--backarrow" @click="goToStart">
      <div class="error-page--backarrow--icon" />
    </div>
    <div class="error-page--ilustration">
      <img src="https://diwe-pdc.s3.sa-east-1.amazonaws.com/foundation/404.svg" />
    </div>
    <div class="error-page--title">Ops... Ocorreu um erro!</div>
    <div class="error-page--text">
      A página que você esta tentando acessar não existe ou não foi encontrada.
    </div>
    <div class="error-page--btn">
      <button @click="goToStart">
        Voltar ao início
      </button>
    </div>
  </div>
</template>
<script>

export default {
  name: 'NotFoundPage',
  methods: {
    goToStart() {
      window.location.href = '/';
    },
  },
};
</script>

<style lang="scss">
@import './styles.scss';
</style>
