diff --git a/app/globals.css b/app/globals.css index b5c61c95..4171668d 100644 --- a/app/globals.css +++ b/app/globals.css @@ -1,3 +1,56 @@ @tailwind base; @tailwind components; @tailwind utilities; + +html, +body { + @apply bg-bg-page; + @apply h-full; + @apply p-0; + @apply text-grey-15; + @apply overscroll-y-none; + min-height: -webkit-fill-available; + @apply font-sans; +} + +#__next { + height: 100%; +} + +/* START FONT STYLING */ +h1 { + @apply text-2xl; + @apply font-bold; +} + +h2 { + @apply text-xl; + @apply font-bold; +} + +h3 { + @apply text-lg; + @apply font-bold; +} + +h4 { + @apply text-base; + @apply font-bold; +} + +p { + @apply text-base; +} + +small { + @apply text-sm; +} + +a { + color: inherit; + text-decoration: none; +} + +pre { + font-family: "Quattro" !important; +} diff --git a/app/layout.tsx b/app/layout.tsx index b47ac7a0..2611247d 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,16 +1,24 @@ import "./globals.css"; +import localFont from "next/font/local"; + export const metadata = { title: "Minilink", description: "tiny interconnected social documents", }; +const quattro = localFont({ + src: "../public/fonts/iAWriterQuattroV.ttf", + display: "swap", + variable: "--font-quattro", +}); + export default function RootLayout({ children, }: { children: React.ReactNode; }) { return ( - +
{children} ); diff --git a/app/test/page.tsx b/app/test/page.tsx new file mode 100644 index 00000000..218e1060 --- /dev/null +++ b/app/test/page.tsx @@ -0,0 +1,74 @@ +"use client"; + +import { Home } from "../../components/Icons"; +import { ButtonPrimary } from "../../components/Buttons"; +import { useState } from "react"; + +export default function Index() { + let [cardTwo, setCardTwo] = useState(false); + let [cardMany, setCardMany] = useState(false); + + return ( +