Files
Randify.pro/src/pages/generators/cards.astro
T
2026-05-09 15:04:44 +03:00

78 lines
2.4 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
---
import BaseLayout from '../../layouts/BaseLayout.astro';
import CardGenerator from '../../components/generators/CardGenerator.astro';
import AdBanner from '../../components/AdBanner.astro';
import { generators } from '../../data/generators';
import SeoBlock from '../../components/SeoBlock.astro';
const generator = generators.find((g) => g.slug === 'cards')!;
---
<BaseLayout
title={generator.seoTitle}
description={generator.seoDescription}
>
<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>
<CardGenerator />
</main>
<div class="mt-12 flex justify-center">
<AdBanner size="tile" />
</div>
<SeoBlock
howTo={[
'Set how many cards to draw (1–52).',
'Toggle Allow duplicates if you want cards to repeat.',
'Click Draw — cards are shown as mini card tiles.',
'Click Copy to copy the result (e.g. A♠, K♥) to your clipboard.',
]}
whenTo={[
'Drawing a random hand for card games.',
'Practising card probability and statistics.',
'Simulating a random card pull for magic tricks or puzzles.',
'Running fair draws without a physical deck.',
]}
/>
</div>
</BaseLayout>