feat: phase 3 website pages on v1 api

app/resources/views/site/emoji-detail.blade.php

@@ -0,0 +1,53 @@
+@extends('site.layout')
+
+@section('title', ($emoji['name'] ?? 'Emoji').' - Dewemoji')
+
+@section('content')
+    <article class="card" style="padding: 20px;">
+        <p style="margin-top:0;"><a href="{{ route('home') }}" style="color: var(--brand); text-decoration:none;">&larr; Back to emoji list</a></p>
+
+        <div style="display:grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: start;">
+            <div style="font-size: 82px; line-height: 1;">{{ $emoji['emoji'] ?? '' }}</div>
+            <div>
+                <h1 style="margin:0 0 8px 0;">{{ $emoji['name'] ?? '' }}</h1>
+                <p style="margin:0;color:var(--muted);">{{ $emoji['category'] ?? '' }} / {{ $emoji['subcategory'] ?? '' }}</p>
+                <p style="margin:12px 0 0 0; color:var(--muted);">{{ $emoji['description'] ?? '' }}</p>
+            </div>
+        </div>
+
+        <hr style="border:none;border-top:1px solid var(--border);margin:18px 0;">
+
+        <div style="display:flex;flex-wrap:wrap;gap:8px;align-items:center;">
+            <code>Slug: {{ $emoji['slug'] ?? '' }}</code>
+            @if(!empty($emoji['unified']))
+                <code>Unified: {{ $emoji['unified'] }}</code>
+            @endif
+            <button id="copy-btn" style="border:1px solid var(--border);background:white;border-radius:10px;padding:8px 12px;cursor:pointer;">
+                Copy Emoji
+            </button>
+        </div>
+
+        @if(!empty($emoji['keywords_en']) && is_array($emoji['keywords_en']))
+            <h3 style="margin-top: 20px;">Keywords (EN)</h3>
+            <div style="display:flex;flex-wrap:wrap;gap:6px;">
+                @foreach($emoji['keywords_en'] as $kw)
+                    <code>{{ $kw }}</code>
+                @endforeach
+            </div>
+        @endif
+    </article>
+@endsection
+
+@push('scripts')
+<script>
+document.getElementById('copy-btn')?.addEventListener('click', async () => {
+    const emoji = @json($emoji['emoji'] ?? '');
+    await navigator.clipboard.writeText(emoji);
+    const btn = document.getElementById('copy-btn');
+    const old = btn.textContent;
+    btn.textContent = 'Copied!';
+    setTimeout(() => btn.textContent = old, 1200);
+});
+</script>
+@endpush
+