Meta.astro

---
import { siteConfig } from "@site-config";
import "@csstools/normalize.css";
import Fonts from "./Fonts.astro";

const { title, description, ogImage, articleDate } = Astro.props;

const titleSeparator = "•";
const pageTitle = `${title} ${titleSeparator} ${siteConfig.title}`;
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
const socialImageURL = new URL(
  ogImage ? ogImage : "/social-card.png",
  Astro.url,
).href;
---

<!-- Global Metadata -->
<meta charset="utf-8" />
<meta
  name="viewport"
  content="width=device-width, initial-scale=1.0, shrink-to-fit=no"
/>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<link rel="canonical" href={canonicalURL} />

<!-- Icons / Favicon -->
<link rel="icon" href="/icon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="/icon.svg" />

<!-- Fonts -->
<!-- fonts are inlined so that there are discovered early -->
<Fonts />

<!-- Style sheet -->
<meta name="theme-color" content={siteConfig.themeColor} />
<link rel="stylesheet" type="text/css" href="/style.css" />
<link rel="stylesheet" type="text/css" href="/print.css" media="print" />

<!-- Primary Meta Tags -->
<title>{pageTitle}</title>
<meta name="title" content={pageTitle} />
<meta name="description" content={description} />
<meta name="author" content={siteConfig.author} />

<!-- Licence -->
<link
  rel="license"
  href="https://github.com/TheBigRoomXXL/lovergne.dev/blob/main/LICENCE.md"
/>

<!-- RSS auto-discovery -->
<link
  rel="alternate"
  type="application/rss+xml"
  title={siteConfig.title}
  href="/rss.xml"
/>

<!-- Open Graph / Facebook -->
<meta property="og:type" content={articleDate ? "article" : "website"} />
<meta property="og:title" content={title} />
<meta property="og:description" content={description} />
<meta property="og:url" content={canonicalURL} />
<meta property="og:site_name" content={siteConfig.title} />
<meta property="og:locale" content={siteConfig.ogLocale} />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image" content={socialImageURL} />
{
  articleDate && (
    <>
      <meta property="article:author" content={siteConfig.author} />
      <meta property="article:published_time" content={articleDate} />
    </>
  )
}

<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:url" content={canonicalURL} />
<meta property="twitter:title" content={title} />
<meta property="twitter:description" content={description} />