// @ts-nocheck

import { Link } from "react-router"
const Header = () => {
  return (
    <header>
      <nav className="">
        <h1 className="site-title">
          <Link
            className="plain-link"
            to="/">Systems Obscure</Link>
        </h1>
        <ul className="header-links">
          <li>
            <Link to="/">Home</Link>
          </li>
 
          <li>
            <Link to="/posts">Posts</Link>
          </li>
          <li>
            <Link to="/about">About</Link>
          </li>
          <li className="flex flex-col items-center justify-center">
            <a
              className=""
              href="https://forgejo.systemsobscure.net/thomasabishop"
              target="blank"
            >
              Forgejo (ext.)
            </a>
          </li>

        </ul>
      </nav>
    </header>
  )
}

const Footer = () => {
  return (
    <footer className="mx-auto">
      <nav>
        <ul className="">
          <li className="flex flex-col items-center justify-center">
            <a
              className=""
              href="https://forgejo.systemsobscure.net/thomasabishop"
              target="blank"
            >
              Forgejo
            </a>
          </li>
        </ul>
      </nav>
    </footer>
  )
}

const MainTemplate = ({ children }) => {
  return (
    <div className="">
      <main className="">
        <Header />
        <div>{children}</div>
      </main>
    </div>
  )
}
export default MainTemplate
//antialiased max-w-3xl mt-3 mx-auto bg-[#282828] no-scanlines wrapper
//main: flex-auto min-w-0 mt-0 flex flex-col px-2 md:px-0