import type { Metadata } from "next";
import Script from "next/script";
import TemplateInteractions from "./TemplateInteractions";
import "./globals.css";

export const metadata: Metadata = {
  title: "12 Apostles Cathedral",
  description: "12 Apostles Cathedral landing page"
};

const stylesheets = [
  "/assets/css/bootstrap.min.css",
  "/assets/css/fontawesome.min.css",
  "/assets/css/magnific-popup.min.css",
  "/assets/css/swiper-bundle.min.css",
  "/assets/css/app.min.css",
  "/assets/css/style.css"
];

export default function RootLayout({
  children
}: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <html className="no-js" lang="en">
      <head>
        {stylesheets.map((href) => (
          <link key={href} rel="stylesheet" href={href} />
        ))}
        <link rel="icon" href="/assets/img/favicons/favicon.png" />
      </head>
      <body className="theme-lima2">
        {children}
        <TemplateInteractions />
        <Script src="/assets/js/swiper-bundle.min.js" strategy="beforeInteractive" />
      </body>
    </html>
  );
}
