Adds /generators/dice/ with configurable count (1–20) and standard RPG sides (d4/d6/d8/d10/d12/d20/d100). Shows individual rolls with colour-coded min/max, running total, and clipboard copy in NdS=total format. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
64 lines
1.9 KiB
Plaintext
64 lines
1.9 KiB
Plaintext
---
|
|
import BaseLayout from '../../layouts/BaseLayout.astro';
|
|
import DiceGenerator from '../../components/generators/DiceGenerator.astro';
|
|
import AdBanner from '../../components/AdBanner.astro';
|
|
import { generators } from '../../data/generators';
|
|
|
|
const generator = generators.find((g) => g.slug === 'dice')!;
|
|
---
|
|
|
|
<BaseLayout
|
|
title={`${generator.title} Generator — Randify`}
|
|
description={generator.description}
|
|
>
|
|
<div class="max-w-2xl mx-auto px-4 py-12 sm:py-20">
|
|
<nav aria-label="Breadcrumb" class="mb-10">
|
|
<a
|
|
href="/"
|
|
class="inline-flex items-center gap-1.5 text-sm text-zinc-500 hover:text-zinc-200 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[#534AB7] rounded"
|
|
aria-label="Back to all generators"
|
|
>
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
width="14"
|
|
height="14"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
stroke-width="2.5"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
aria-hidden="true"
|
|
>
|
|
<path d="m15 18-6-6 6-6"/>
|
|
</svg>
|
|
All generators
|
|
</a>
|
|
</nav>
|
|
|
|
<header class="mb-2">
|
|
<div class="flex items-center gap-2 mb-4">
|
|
<span
|
|
class="inline-block w-2.5 h-2.5 rounded-full bg-[#534AB7]"
|
|
aria-hidden="true"
|
|
></span>
|
|
<span class="text-sm font-medium text-zinc-400 uppercase tracking-widest">randify</span>
|
|
</div>
|
|
<h1 class="text-3xl sm:text-4xl font-bold text-zinc-100">
|
|
{generator.title} Generator
|
|
</h1>
|
|
<p class="mt-2 text-base text-zinc-400">{generator.description}</p>
|
|
</header>
|
|
|
|
<main>
|
|
<DiceGenerator />
|
|
</main>
|
|
|
|
<div class="mt-12 grid grid-cols-3 gap-3">
|
|
<AdBanner size="tile" />
|
|
<AdBanner size="tile" />
|
|
<AdBanner size="tile" />
|
|
</div>
|
|
</div>
|
|
</BaseLayout>
|