43 lines
803 B
Vue
43 lines
803 B
Vue
<template>
|
|
<div class="error-app">
|
|
<img class="error-app__image" src="/sad-pepe.png" alt="Oops!" draggable="false">
|
|
|
|
<p class="error-app__message">
|
|
{{ message }}
|
|
</p>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
defineProps<{
|
|
message: string
|
|
}>()
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.error-app {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 100%;
|
|
|
|
&__image {
|
|
width: 120px;
|
|
margin-bottom: var(--space-6);
|
|
user-select: none;
|
|
opacity: 0.9;
|
|
}
|
|
|
|
&__message {
|
|
@include font-body-bold;
|
|
|
|
padding: var(--space-2) var(--space-3);
|
|
background-color: var(--paper);
|
|
outline: var(--border-w) solid var(--ink);
|
|
outline-offset: calc(var(--border-w) * -1);
|
|
box-shadow: var(--shadow);
|
|
}
|
|
}
|
|
</style>
|