Add card to display errors that scrolls into view.

frontend/src/components/ErrorCard.vue

@@ -0,0 +1,37 @@
+<script setup lang="ts">
+import {onMounted, ref} from "vue";
+
+const element = ref<HTMLElement>();
+
+function scrollIntoView() {
+    element.value?.scrollIntoView({
+        behavior: "smooth",
+        block: "nearest"
+    });
+}
+
+onMounted(scrollIntoView);
+</script>
+
+<template>
+    <div ref="element" class="error-card">
+        <slot></slot>
+    </div>
+</template>
+
+<style lang="scss">
+@import "../scss/variables";
+
+.error-card {
+    margin: $error-card-margin;
+    padding: $error-card-padding;
+
+    border: $error-card-border;
+    border-radius: $error-card-border-radius;
+
+    font-weight: $error-card-font-weight;
+
+    background-color: $error-card-background-color;
+    color: $error-card-color;
+}
+</style>