{% extends "public.html" %} {% block page %}
<div class="row q-col-gutter-md justify-center">
  <div class="col-12 col-md-7 col-lg-6 q-gutter-y-md">
    <q-card class="q-pa-lg">
      <q-card-section class="q-pa-none">
        <center>
          <h3 class="q-my-none">Error</h3>
          <br />
          <q-icon
            name="warning"
            class="text-grey"
            style="font-size: 20rem"
          ></q-icon>

          <h5 class="q-my-none">{{ err }}</h5>

          <br />
          <div class="row">
            <div class="col">
              <q-btn
                @click="goBack"
                color="grey"
                outline
                label="Back"
                style="width: 100%"
              ></q-btn>
            </div>
            <div class="col">
              <q-btn
                @click="goHome"
                color="grey"
                outline
                label="Home"
                style="width: 100%"
              ></q-btn>
            </div>
          </div>
        </center>
      </q-card-section>
    </q-card>
  </div>
</div>

{% endblock %} {% block scripts %}
<script>
  window.app = Vue.createApp({
    el: '#vue',
    mixins: [window.windowMixin],
    methods: {
      goBack: function () {
        window.history.back()
      },
      goHome: function () {
        window.location.href = '/'
      }
    }
  })
</script>
{% endblock %}
