c73b5a09e4
- New reusable element_access_denied.svelte with title, message, action props - Badge review page: swap inline 'Access Denied' card with the component - Project doc: all 6 steps complete, status → Complete
35 lines
897 B
Svelte
35 lines
897 B
Svelte
<script lang="ts">
|
|
import { ShieldX } from '@lucide/svelte';
|
|
|
|
interface Props {
|
|
title?: string;
|
|
message?: string;
|
|
action_label?: string;
|
|
on_action?: () => void;
|
|
}
|
|
|
|
let {
|
|
title = 'Access Denied',
|
|
message = 'You do not have permission to view this content.',
|
|
action_label = '',
|
|
on_action = undefined
|
|
}: Props = $props();
|
|
</script>
|
|
|
|
<div class="card p-6 space-y-4 max-w-sm">
|
|
<div class="flex items-center gap-2 text-error-500">
|
|
<ShieldX size="1.2em" />
|
|
<h3 class="text-lg font-semibold">{title}</h3>
|
|
</div>
|
|
<p class="text-sm text-gray-700">{message}</p>
|
|
{#if action_label && on_action}
|
|
<button
|
|
type="button"
|
|
class="btn preset-tonal-surface w-full"
|
|
onclick={on_action}
|
|
>
|
|
{action_label}
|
|
</button>
|
|
{/if}
|
|
</div>
|