feat: add element_access_denied.svelte; use in badge review page

- 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
This commit is contained in:
Scott Idem
2026-03-11 17:06:11 -04:00
parent 0c11cfb3e2
commit c73b5a09e4
3 changed files with 44 additions and 17 deletions

View File

@@ -0,0 +1,34 @@
<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>