mirror of
https://github.com/jakejarvis/jarv.is.git
synced 2025-07-19 18:45:30 -04:00
reorganize style and font configs
This commit is contained in:
@@ -1,25 +0,0 @@
|
||||
// Legacy
|
||||
import comicNeueLatin400NormalWoff from "@fontsource/comic-neue/files/comic-neue-latin-400-normal.woff";
|
||||
import comicNeueLatin400NormalWoff2 from "@fontsource/comic-neue/files/comic-neue-latin-400-normal.woff2";
|
||||
import comicNeueLatin700NormalWoff from "@fontsource/comic-neue/files/comic-neue-latin-700-normal.woff";
|
||||
import comicNeueLatin700NormalWoff2 from "@fontsource/comic-neue/files/comic-neue-latin-700-normal.woff2";
|
||||
|
||||
export const name = {
|
||||
regular: "Comic Neue",
|
||||
};
|
||||
export const family = [
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 400,
|
||||
src: `url(${comicNeueLatin400NormalWoff2}) format("woff2"), url(${comicNeueLatin400NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 700,
|
||||
src: `url(${comicNeueLatin700NormalWoff2}) format("woff2"), url(${comicNeueLatin700NormalWoff}) format("woff")`,
|
||||
},
|
||||
];
|
||||
@@ -1,47 +0,0 @@
|
||||
// Legacy
|
||||
import interLatin400NormalWoff from "@fontsource/inter/files/inter-latin-400-normal.woff";
|
||||
import interLatin400NormalWoff2 from "@fontsource/inter/files/inter-latin-400-normal.woff2";
|
||||
import interLatin500NormalWoff from "@fontsource/inter/files/inter-latin-500-normal.woff";
|
||||
import interLatin500NormalWoff2 from "@fontsource/inter/files/inter-latin-500-normal.woff2";
|
||||
import interLatin700NormalWoff from "@fontsource/inter/files/inter-latin-700-normal.woff";
|
||||
import interLatin700NormalWoff2 from "@fontsource/inter/files/inter-latin-700-normal.woff2";
|
||||
|
||||
// Variable
|
||||
import interLatinVarFullNormalWoff2 from "@fontsource/inter/files/inter-latin-variable-full-normal.woff2";
|
||||
|
||||
export const name = {
|
||||
regular: "Inter",
|
||||
variable: "Inter var",
|
||||
};
|
||||
// re-export hashed URL(s) of the most prominent file so we can preload it in head:
|
||||
export const preloadUrls = [interLatinVarFullNormalWoff2];
|
||||
export const family = [
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 400,
|
||||
src: `url(${interLatin400NormalWoff2}) format("woff2"), url(${interLatin400NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 500,
|
||||
src: `url(${interLatin500NormalWoff2}) format("woff2"), url(${interLatin500NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 700,
|
||||
src: `url(${interLatin700NormalWoff2}) format("woff2"), url(${interLatin700NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.variable,
|
||||
fontStyle: "oblique 0deg 10deg",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: "100 900",
|
||||
src: `url(${interLatinVarFullNormalWoff2}) format("woff2")`,
|
||||
},
|
||||
];
|
||||
@@ -1,82 +0,0 @@
|
||||
// Legacy
|
||||
import robotoMonoLatin400NormalWoff from "@fontsource/roboto-mono/files/roboto-mono-latin-400-normal.woff";
|
||||
import robotoMonoLatin400NormalWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-400-normal.woff2";
|
||||
import robotoMonoLatin500NormalWoff from "@fontsource/roboto-mono/files/roboto-mono-latin-500-normal.woff";
|
||||
import robotoMonoLatin500NormalWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-500-normal.woff2";
|
||||
import robotoMonoLatin700NormalWoff from "@fontsource/roboto-mono/files/roboto-mono-latin-700-normal.woff";
|
||||
import robotoMonoLatin700NormalWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-700-normal.woff2";
|
||||
import robotoMonoLatin400ItalicWoff from "@fontsource/roboto-mono/files/roboto-mono-latin-400-italic.woff";
|
||||
import robotoMonoLatin400ItalicWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-400-italic.woff2";
|
||||
import robotoMonoLatin500ItalicWoff from "@fontsource/roboto-mono/files/roboto-mono-latin-500-italic.woff";
|
||||
import robotoMonoLatin500ItalicWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-500-italic.woff2";
|
||||
import robotoMonoLatin700ItalicWoff from "@fontsource/roboto-mono/files/roboto-mono-latin-700-italic.woff";
|
||||
import robotoMonoLatin700ItalicWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-700-italic.woff2";
|
||||
|
||||
// Variable
|
||||
import robotoMonoLatinVarWghtOnlyNormalWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-variable-wghtOnly-normal.woff2";
|
||||
import robotoMonoLatinVarWghtOnlyItalicWoff2 from "@fontsource/roboto-mono/files/roboto-mono-latin-variable-wghtOnly-italic.woff2";
|
||||
|
||||
export const name = {
|
||||
regular: "Roboto Mono",
|
||||
variable: "Roboto Mono var",
|
||||
};
|
||||
// re-export hashed URL(s) of the most prominent file so we can preload it in head:
|
||||
export const preloadUrls = [robotoMonoLatinVarWghtOnlyNormalWoff2];
|
||||
export const family = [
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 400,
|
||||
src: `url(${robotoMonoLatin400NormalWoff2}) format("woff2"), url(${robotoMonoLatin400NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 500,
|
||||
src: `url(${robotoMonoLatin500NormalWoff2}) format("woff2"), url(${robotoMonoLatin500NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 700,
|
||||
src: `url(${robotoMonoLatin700NormalWoff2}) format("woff2"), url(${robotoMonoLatin700NormalWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "italic",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 400,
|
||||
src: `url(${robotoMonoLatin400ItalicWoff2}) format("woff2"), url(${robotoMonoLatin400ItalicWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "italic",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 500,
|
||||
src: `url(${robotoMonoLatin500ItalicWoff2}) format("woff2"), url(${robotoMonoLatin500ItalicWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.regular,
|
||||
fontStyle: "italic",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: 700,
|
||||
src: `url(${robotoMonoLatin700ItalicWoff2}) format("woff2"), url(${robotoMonoLatin700ItalicWoff}) format("woff")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.variable,
|
||||
fontStyle: "normal",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: "100 700",
|
||||
src: `url(${robotoMonoLatinVarWghtOnlyNormalWoff2}) format("woff2")`,
|
||||
},
|
||||
{
|
||||
fontFamily: name.variable,
|
||||
fontStyle: "italic",
|
||||
fontDisplay: "swap",
|
||||
fontWeight: "100 700",
|
||||
src: `url(${robotoMonoLatinVarWghtOnlyItalicWoff2}) format("woff2")`,
|
||||
},
|
||||
];
|
||||
@@ -1,11 +0,0 @@
|
||||
// hex -> rgba, pulled from https://github.com/sindresorhus/hex-rgb/blob/main/index.js#L29
|
||||
const hex2rgba = (hex: string, alpha: number) => {
|
||||
const number = Number.parseInt(hex.replace(/^#/, ""), 16);
|
||||
const red = number >> 16;
|
||||
const green = (number >> 8) & 255;
|
||||
const blue = number & 255;
|
||||
|
||||
return `rgba(${red}, ${green}, ${blue}, ${alpha})`;
|
||||
};
|
||||
|
||||
export default hex2rgba;
|
||||
@@ -1,19 +0,0 @@
|
||||
import { theme, darkTheme } from "../stitches.config";
|
||||
|
||||
// theme classnames are generated dynamically by stitches, so have ThemeProvider pull them from there
|
||||
export const themeClassNames = {
|
||||
light: theme.className,
|
||||
dark: darkTheme.className,
|
||||
};
|
||||
|
||||
// colors used for `<meta name="theme-color" .../>` (see components/Layout/Layout.tsx)
|
||||
export const themeColors = {
|
||||
light: theme.colors.backgroundOuter?.value,
|
||||
dark: darkTheme.colors.backgroundOuter?.value,
|
||||
};
|
||||
|
||||
// https://web.dev/prefers-color-scheme/#the-prefers-color-scheme-media-query
|
||||
export const darkModeQuery = "(prefers-color-scheme: dark)";
|
||||
|
||||
// local storage key
|
||||
export const themeStorageKey = "preferred-theme";
|
||||
@@ -1,9 +0,0 @@
|
||||
import * as Inter from "./fonts/inter";
|
||||
import * as RobotoMono from "./fonts/roboto-mono";
|
||||
import * as ComicNeue from "./fonts/comic-neue";
|
||||
|
||||
// re-export hashed URLs of the most important variable fonts so we can preload them in pages/_document.tsx
|
||||
export const preloadUrls = [...Inter.preloadUrls, ...RobotoMono.preloadUrls];
|
||||
|
||||
// re-export everything for use in ../stitches.config.ts
|
||||
export { Inter, RobotoMono, ComicNeue };
|
||||
Reference in New Issue
Block a user