Files
BRETT/app/components/effects/CardVignette.vue
T
2026-10-03 20:07:49 +02:00

17 lines
609 B
Vue

<script setup lang="ts">
// Optionale Vignette über Karten-Hintergrundeffekten: dunkelt die Ränder
// zur Surface-Farbe hin ab, damit darüberliegender Text lesbar bleibt.
// `surface` muss die CSS-Farbe der Kartenfläche sein (popover/card/background),
// damit die Kante optisch in die Karte übergeht.
withDefaults(defineProps<{ surface?: string }>(), {
surface: 'var(--color-popover)',
})
</script>
<template>
<div
class="pointer-events-none absolute inset-0 rounded-[inherit]"
:style="{ background: `radial-gradient(ellipse at center, transparent 25%, ${surface} 92%)` }"
/>
</template>