17423fb3b9
- Rename Grimaired -> Grimoired everywhere (title, nav, descriptions, token keys) - Update domain from skills.here.run.place to grimoi.red - Add Grimoired logo with description on homepage - Add accordion behavior for Quick install / Quick push sections - Add generic resource system (skills, agents, output-styles, rules) - Add resource registry, editor, search, and file manager components
86 lines
4.1 KiB
Plaintext
86 lines
4.1 KiB
Plaintext
---
|
|
import '../styles/global.css';
|
|
|
|
interface Props {
|
|
title?: string;
|
|
}
|
|
|
|
const { title = 'Grimoired' } = Astro.props;
|
|
---
|
|
|
|
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<title>{title}</title>
|
|
</head>
|
|
<body class="min-h-screen font-sans text-gray-300 antialiased">
|
|
<!-- Subtle gradient glow -->
|
|
<div class="pointer-events-none fixed inset-0 overflow-hidden">
|
|
<div class="absolute -top-40 left-1/2 -translate-x-1/2 h-80 w-[600px] rounded-full bg-accent-500/[0.07] blur-[120px]"></div>
|
|
</div>
|
|
|
|
<nav class="relative z-50 border-b border-white/[0.06] bg-surface-50/80 backdrop-blur-xl">
|
|
<div class="mx-auto max-w-6xl flex items-center justify-between px-6 py-4">
|
|
<a href="/" class="group flex items-center gap-2.5">
|
|
<img src="/favicon.svg" alt="Grimoired" class="h-8 w-8" />
|
|
<span class="text-lg font-bold tracking-tight text-white group-hover:text-accent-400 transition-colors">Grimoired</span>
|
|
</a>
|
|
<!-- New dropdown -->
|
|
<div class="relative" id="new-dropdown">
|
|
<button
|
|
id="new-btn"
|
|
class="inline-flex items-center gap-1.5 rounded-lg bg-accent-500 px-4 py-2 text-sm font-semibold text-white shadow-lg shadow-accent-500/20 hover:bg-accent-600 hover:shadow-accent-500/30 active:scale-[0.97] transition-all"
|
|
>
|
|
<svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
|
|
</svg>
|
|
New
|
|
<svg class="h-3 w-3 ml-0.5" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
|
|
</svg>
|
|
</button>
|
|
<div id="new-menu" class="hidden absolute right-0 mt-2 w-48 rounded-xl border border-white/[0.08] bg-[var(--color-surface-200)] shadow-2xl overflow-hidden z-50">
|
|
<a href="/skills/new" class="flex items-center gap-2.5 px-4 py-2.5 text-sm text-gray-300 hover:bg-white/[0.06] hover:text-white transition-colors">
|
|
<span class="h-2 w-2 rounded-full" style="background: #fb923c;"></span>
|
|
New Skill
|
|
</a>
|
|
<a href="/agents/new" class="flex items-center gap-2.5 px-4 py-2.5 text-sm text-gray-300 hover:bg-white/[0.06] hover:text-white transition-colors">
|
|
<span class="h-2 w-2 rounded-full" style="background: #818cf8;"></span>
|
|
New Agent
|
|
</a>
|
|
<a href="/output-styles/new" class="flex items-center gap-2.5 px-4 py-2.5 text-sm text-gray-300 hover:bg-white/[0.06] hover:text-white transition-colors">
|
|
<span class="h-2 w-2 rounded-full" style="background: #34d399;"></span>
|
|
New Output Style
|
|
</a>
|
|
<a href="/rules/new" class="flex items-center gap-2.5 px-4 py-2.5 text-sm text-gray-300 hover:bg-white/[0.06] hover:text-white transition-colors">
|
|
<span class="h-2 w-2 rounded-full" style="background: #f472b6;"></span>
|
|
New Rule
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="relative mx-auto max-w-6xl px-6 py-10">
|
|
<slot />
|
|
</main>
|
|
|
|
<script>
|
|
// Dropdown toggle
|
|
const btn = document.getElementById('new-btn')!;
|
|
const menu = document.getElementById('new-menu')!;
|
|
btn.addEventListener('click', (e) => {
|
|
e.stopPropagation();
|
|
menu.classList.toggle('hidden');
|
|
});
|
|
document.addEventListener('click', () => menu.classList.add('hidden'));
|
|
</script>
|
|
</body>
|
|
</html>
|