---
import Header from '../components/Header.astro';
import Footer from '../components/Footer.astro';
import '../styles/footer.css';
interface Props {
title: string;
description?: string;
activeNav?: 'home' | 'designing' | 'docs' | 'slop' | 'live';
canonicalPath?: string;
bodyClass?: string;
noIndex?: boolean;
mainId?: string;
mainClass?: string;
hideHeader?: boolean;
hideFooter?: boolean;
ogTitle?: string;
ogDescription?: string;
ogImage?: string;
twitterSite?: string;
twitterCreator?: string;
}
const {
title,
description = 'Design fluency for AI-assisted frontend development.',
activeNav,
canonicalPath,
bodyClass,
noIndex = false,
mainId = 'main',
mainClass,
hideHeader = false,
hideFooter = false,
ogTitle,
ogDescription,
ogImage,
twitterSite,
twitterCreator,
} = Astro.props;
const canonical = canonicalPath
? `https://impeccable.style${canonicalPath}`
: undefined;
---
{title}
{noIndex && }
{canonical && }
{ogTitle && (
<>
{ogImage && }
)}
{twitterSite && (
<>
{twitterCreator && }
{ogImage && }
)}
Skip to content
{!hideHeader && }
{!hideFooter && }