jake/jarv.is
jake/jarv.is
1
Fork 0
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-04-26 15:28:28 -04:00
Code Issues

switch monospace font to Source Code Pro

Browse Source
This commit is contained in:
Jake Jarvis 2022-11-12 13:09:32 -05:00
parent d297a26628
commit 279688b89f
Signed by: jake
GPG Key ID: 2B0C9CF251E69A39
6 changed files with 10 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components/Code/Code.tsx
View File

@ -1,7 +1,6 @@
import { styled, theme } from "../../lib/styles/stitches.config"; import { styled, theme } from "../../lib/styles/stitches.config";
const Code = styled("code", { const Code = styled("code", {
fontSize: "0.925em",
backgroundColor: theme.colors.codeBackground, backgroundColor: theme.colors.codeBackground,
border: `1px solid ${theme.colors.kindaLight}`, border: `1px solid ${theme.colors.kindaLight}`,
borderRadius: theme.radii.corner, borderRadius: theme.radii.corner,

1
components/CodeBlock/CodeBlock.tsx
View File

@ -13,6 +13,7 @@ const Block = styled("div", {
display: "block", display: "block",
overflowX: "auto", overflowX: "auto",
padding: "1em", padding: "1em",
fontSize: "0.925em",
tabSize: 2, tabSize: 2,
// optional line numbers added at time of prism compilation // optional line numbers added at time of prism compilation

3
components/CodeInline/CodeInline.tsx
View File

@ -2,7 +2,8 @@ import Code from "../Code";
import { styled } from "../../lib/styles/stitches.config"; import { styled } from "../../lib/styles/stitches.config";
const CodeInline = styled(Code, { const CodeInline = styled(Code, {
padding: "0.2em 0.3em", padding: "0.175em 0.3em",
fontSize: "0.975em",
pageBreakInside: "avoid", pageBreakInside: "avoid",
}); });

4
lib/styles/stitches.config.ts
View File

@ -6,7 +6,7 @@ import hexToRgba from "./utils/hex-to-rgba";
import normalizeStyles from "./utils/normalize"; import normalizeStyles from "./utils/normalize";
// web fonts // web fonts
import { Inter, RobotoMono } from "./utils/fonts"; import { Inter, SourceCodePro } from "./utils/fonts";
// https://stitches.dev/docs/typescript#type-a-css-object // https://stitches.dev/docs/typescript#type-a-css-object
export type CSS = Stitches.CSS<typeof stitchesConfig>; export type CSS = Stitches.CSS<typeof stitchesConfig>;
@ -24,7 +24,7 @@ export const {
theme: { theme: {
fonts: { fonts: {
sans: `${Inter.style.fontFamily}, sans-serif`, sans: `${Inter.style.fontFamily}, sans-serif`,
mono: `${RobotoMono.style.fontFamily}, monospace`, mono: `${SourceCodePro.style.fontFamily}, monospace`,
}, },
colors: { colors: {

4
lib/styles/utils/fonts.ts
View File

@ -1,6 +1,6 @@
import { import {
Inter as InterLoader, Inter as InterLoader,
Roboto_Mono as RobotoMonoLoader, Source_Code_Pro as SourceCodeProLoader,
Comic_Neue as ComicNeueLoader, Comic_Neue as ComicNeueLoader,
} from "@next/font/google"; } from "@next/font/google";
@ -13,7 +13,7 @@ export const Inter = InterLoader({
preload: true, preload: true,
}); });
export const RobotoMono = RobotoMonoLoader({ export const SourceCodePro = SourceCodeProLoader({
weight: "variable", weight: "variable",
display: "fallback", display: "fallback",
preload: true, preload: true,

4
pages/index.tsx
View File

@ -91,11 +91,13 @@ const Wave = styled("span", {
const Sup = styled("sup", { const Sup = styled("sup", {
margin: "0 0.15em", margin: "0 0.15em",
fontSize: "0.65em", fontSize: "0.6em",
}); });
const PGPKey = styled("code", { const PGPKey = styled("code", {
marginLeft: "0.15em", marginLeft: "0.15em",
fontSize: "1.1em",
fontWeight: 500,
wordSpacing: "-0.4em", wordSpacing: "-0.4em",
}); });