add lunchtype fonts

src/app/fonts.css

@@ -0,0 +1,53 @@
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  src: url("/fonts/lunchtype22-regular.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  font-style: italic;
+  src: url("/fonts/lunchtype22-regular-italic.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  src: url("/fonts/lunchtype22-medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  font-style: italic;
+  src: url("/fonts/lunchtype22-medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  font-stretch: condensed;
+  src: url("/fonts/lunchtype25-regular-condensed.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  font-stretch: condensed;
+  src: url("/fonts/lunchtype25-medium-condensed.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 400;
+  font-stretch: expanded;
+  src: url("/fonts/lunchtype24-regular-expanded.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: lunchtype;
+  font-weight: 500;
+  font-stretch: expanded;
+  src: url("/fonts/lunchtype24-medium-expanded.woff2") format("woff2");
+}

src/app/globals.css

@@ -62,8 +62,9 @@ body {
   overflow-x: hidden;
   color: var(--fg);
   background-color: var(--bg);
-  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+  font-family: lunchtype, system-ui, -apple-system, BlinkMacSystemFont,
-    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
+    "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
+    sans-serif;
 }
 
 html,
@@ -74,7 +75,8 @@ label {
     color var(--theme-transition);
 }
 
-input:disabled, button:disabled {
+input:disabled,
+button:disabled {
   opacity: 0.5;
   cursor: not-allowed !important;
 }

src/app/layout.tsx

@@ -1,5 +1,6 @@
 import ColorChanger from "@/components/ColorChanger";
 import "./globals.css";
+import "./fonts.css";
 
 export const metadata = {
   title: "gluestick",