BaseLayout component

Shell HTML completo con Geist font, CSS variables del sistema de diseño, estilos globales y animaciones. Úsalo como base para cualquier página.

IMPORTAR

import { BaseLayout } from 'jp-astro-components';

Qué incluye

✦ <!doctype html> + meta charset y viewport
✦ Geist font cargada desde Google Fonts
✦ CSS variables: --jp-color-bg, --jp-color-accent, --jp-text-muted…
✦ Reset de box-sizing y scroll suave (respeta prefers-reduced-motion)
✦ Body: fondo oscuro, Geist, antialiasing
✦ Keyframes: fade-in, fade-up, slide-from-top, slide-from-bottom
✦ Utilidad .sr-only
✦ <slot /> para el contenido de la página

Uso

EJEMPLO

---
import { BaseLayout } from 'jp-astro-components';
---

<BaseLayout title="Mi página" description="Descripción opcional" lang="es">
  <!-- Todo el contenido va aquí -->
  <main>
    <h1>Hola mundo</h1>
  </main>
</BaseLayout>

Props

Prop	Tipo	Default
title	string	— (requerido)
description	string	—
lang	string	"es"

← Volver al inicio