import { AppProps } from "$fresh/server.ts";

import { Head } from "$fresh/runtime.ts";
export default function App({ Component }: AppProps) {
  return (
    <>
      <Head>
        <link href="/global.css" rel="stylesheet" />
        <link href="/prism-material-dark.css" rel="stylesheet" />

        <link
          rel="apple-touch-icon"
          sizes="180x180"
          href="/apple-touch-icon.png"
        />
        <link
          rel="icon"
          type="image/png"
          sizes="32x32"
          href="/favicon-32x32.png"
        />
        <link
          rel="icon"
          type="image/png"
          sizes="16x16"
          href="/favicon-16x16.png"
        />
        <link rel="manifest" href="/site.webmanifest" />
        <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
        <link rel="stylesheet" href="/styles.css" />
        <meta name="msapplication-TileColor" content="#da532c" />
        <meta name="theme-color" content="#141218" />
        <script src="/thumbnails.js" type="module"></script>

        <style>
          {`
          :root {
            --background: rgb(43, 41, 48);
            --foreground: rgb(129, 129, 129);
            --light: #2B2930;
          }
          .custom-grid {
            grid-template-columns: repeat(auto-fit, minmax(37vw, 1fr)) ;
          }

          @media(min-width: 640px){
            .custom-grid {
              grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) ;
            }
          }
          /* work-sans-regular - latin */
          @font-face {
            font-family: 'Work Sans';
            font-style: normal;
            font-weight: 400;
            src: url('/fonts/work-sans-v18-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
          }

          /* work-sans-700 - latin */
          @font-face {
            font-family: 'Work Sans';
            font-style: normal;
            font-weight: 700;
            src: url('/fonts/work-sans-v18-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
          }

          body {
            background: #141218;
            padding: 0px 20px;
          }
          pre {
            font-family:Work Sans;
          }

          a {
            color: cadetblue;
            font-family: Work Sans;
          }

          `}
        </style>
      </Head>
      <Component />
    </>
  );
}
