mirror of
https://github.com/hex248/sprint.git
synced 2026-02-08 02:33:01 +00:00
CommitMono
This commit is contained in:
BIN
packages/frontend/public/fonts/CommitMono-Variable.woff2
Normal file
BIN
packages/frontend/public/fonts/CommitMono-Variable.woff2
Normal file
Binary file not shown.
@@ -133,7 +133,7 @@
|
||||
}
|
||||
|
||||
* {
|
||||
font-family: "IBM Plex Mono", monospace;
|
||||
font-family: "Commit Mono", monospace;
|
||||
font-optical-sizing: auto;
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
|
||||
@@ -1,4 +1,18 @@
|
||||
@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap");
|
||||
@font-face {
|
||||
font-family: "Commit Mono";
|
||||
src: url("/fonts/CommitMono-Variable.woff2") format("woff2");
|
||||
font-weight: 200 700;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Commit Mono";
|
||||
src: url("/fonts/CommitMono-Variable.woff2") format("woff2");
|
||||
font-weight: 200 700;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Basteleur";
|
||||
@@ -37,7 +51,7 @@
|
||||
}
|
||||
|
||||
.font-mono {
|
||||
font-family: "IBM Plex Mono", monospace;
|
||||
font-family: "Commit Mono", monospace;
|
||||
}
|
||||
|
||||
.font-basteleur {
|
||||
|
||||
@@ -5,6 +5,7 @@ import { BrowserRouter, Route, Routes } from "react-router-dom";
|
||||
import { RequireAuth, SessionProvider } from "@/components/session-provider";
|
||||
import { ThemeProvider } from "@/components/theme-provider";
|
||||
import App from "@/pages/App";
|
||||
import Font from "@/pages/Font";
|
||||
import Landing from "@/pages/Landing";
|
||||
import Login from "@/pages/Login";
|
||||
import NotFound from "@/pages/NotFound";
|
||||
@@ -18,6 +19,7 @@ ReactDOM.createRoot(document.getElementById("root") as HTMLElement).render(
|
||||
<Routes>
|
||||
{/* public routes */}
|
||||
<Route path="/" element={<Landing />} />
|
||||
<Route path="/font" element={<Font />} />
|
||||
<Route path="/login" element={<Login />} />
|
||||
|
||||
{/* authed routes */}
|
||||
|
||||
25
packages/frontend/src/pages/Font.tsx
Normal file
25
packages/frontend/src/pages/Font.tsx
Normal file
@@ -0,0 +1,25 @@
|
||||
const WEIGHTS = [
|
||||
200, 225, 250, 275, 300, 325, 350, 375, 400, 425, 450, 475, 500, 525, 550, 575, 600, 625, 650, 675, 700,
|
||||
];
|
||||
|
||||
const SAMPLE_TEXT = "The quick brown fox jumps over the lazy dog 0123456789.";
|
||||
|
||||
export default function Font() {
|
||||
return (
|
||||
<main className="min-h-screen font-mono">
|
||||
<div className="mx-auto w-fit px-8 py-10">
|
||||
<h1 className="text-2xl font-500">Commit Mono</h1>
|
||||
<div className="mt-6 flex flex-col divide-y divide-foreground/30">
|
||||
{WEIGHTS.map((weight) => (
|
||||
<div key={weight} className="grid grid-cols-[42px_1fr] items-center gap-3 px-3 py-3">
|
||||
<span className="text-sm" style={{ fontWeight: weight }}>
|
||||
{weight}
|
||||
</span>
|
||||
<span style={{ fontWeight: weight }}>{SAMPLE_TEXT}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user