frontend/components/ui/prompt/UiPrompt.vue

37 lines
666 B
Vue

<template>
<div class="spaced-center padding-m prompt" v-if="prompt" :class="prompt.type">
<p>{{ prompt.text }}</p>
<UiIcon class="pointer" @click="() => emit('close')">close</UiIcon>
</div>
</template>
<script setup lang="ts">
import type { Prompt } from './Prompt';
defineProps<{
prompt?: Prompt
}>();
const emit = defineEmits<{
(e: 'close'): void
}>();
</script>
<style scoped>
.prompt {
border-radius: 0.25rem;
min-height: 2.5rem;
}
.error {
background-color: rgb(255, 74, 74);
}
.success {
background-color: rgb(43, 161, 49);
}
.info {
background-color: rgb(22, 79, 163);
}
.prompt * {
color: rgb(255, 255, 255);
}
</style>