25 lines
1.0 KiB
Vue
25 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
title?: string;
|
|
initialValue?: string;
|
|
}>();
|
|
|
|
const emit = defineEmits(['confirm', 'cancel']);
|
|
const text = ref(props.initialValue || '');
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex flex-col h-[70vh] h-[70dvh] w-[85vw]">
|
|
<h3 class="m-4" v-if="title">{{ title }}</h3>
|
|
<textarea v-model="text" class="bg-[var(--bg-surface)] resize-none h-full w-full p-2 rounded" />
|
|
<div class="flex justify-end gap-2 m-2">
|
|
<button
|
|
class="px-2 py-1 rounded-lg border border-[var(--color-border)] hover:bg-[var(--color-hover)] transition-[background-color] duration-200"
|
|
@click="emit('cancel')">Cancel</button>
|
|
<button
|
|
class="px-2 py-1 rounded-lg bg-[var(--color-accent)] text-[var(--color-accent-text)] hover:bg-[var(--color-accent-hover)] transition-[background-color] duration-200"
|
|
@click="emit('confirm', text)">Confirm</button>
|
|
</div>
|
|
</div>
|
|
</template>
|