feat(theme): color scheme and fonts

This commit is contained in:
Pihkaal
2024-01-22 11:50:03 +01:00
parent 9e75d6b8bb
commit 070e198b43
8 changed files with 67 additions and 2 deletions

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@@ -1,3 +1,33 @@
@tailwind base; @tailwind base;
@tailwind components; @tailwind components;
@tailwind utilities; @tailwind utilities;
@font-face {
font-family: "JetBrainsMono";
src:
url("/fonts/JetBrainsMonoNFM-Bold.woff2") format("woff2"),
url("/fonts/JetBrainsMonoNFM-Bold.woff") format("woff");
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "JetBrainsMono";
src:
url("/fonts/JetBrainsMonoNFM-Regular.woff2") format("woff2"),
url("/fonts/JetBrainsMonoNFM-Regular.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "JetBrainsMono";
src:
url("/fonts/JetBrainsMonoNFM-Medium.woff2") format("woff2"),
url("/fonts/JetBrainsMonoNFM-Medium.woff") format("woff");
font-weight: 500;
font-style: normal;
font-display: swap;
}

View File

@@ -1,19 +1,54 @@
import { type Config } from "tailwindcss"; import { type Config } from "tailwindcss";
import { fontFamily } from "tailwindcss/defaultTheme"; import { fontFamily } from "tailwindcss/defaultTheme";
const config: Config = { const config = {
content: ["./src/**/*.tsx"], content: ["./src/**/*.tsx"],
theme: { theme: {
extend: { extend: {
fontSize: {
"sm": "0.8rem",
"base": "1rem",
"lg": "1.125rem",
"xl": "1.25rem",
"2xl": "1.563rem",
"3xl": "1.953rem",
"4xl": "2.441rem",
"5xl": "3.052rem",
},
fontFamily: { fontFamily: {
sans: ["var(--font-sans)", ...fontFamily.sans], sans: ["var(--font-sans)", ...fontFamily.sans],
body: ["JetBrainsMono", "mono"],
}, },
boxShadow: { boxShadow: {
window: "0 0 1px 1px #1a1a1a", window: "0 0 1px 1px #1a1a1a",
}, },
colors: {
foreground: "#cdd6f4",
background: "#1e1e2e",
borderInactive: "#595959",
borderActive: "#cdd6f4",
selectionForeground: "#1e1e2e",
selectionBackground: "#f5e0dc",
color0: "#45475a",
color1: "#f38ba8",
color2: "#a6e3a1",
color3: "#f9e2af",
color4: "#89bafa",
color5: "#f5c2e7",
color6: "#94e2d5",
color7: "#bac2de",
color8: "#585B70",
color9: "#f38ba8",
color10: "#a6e3a1",
color11: "#f9e2af",
color12: "#89bafa",
color13: "#f5c2e7",
color14: "#94e2d5",
color15: "#a6adc8",
},
}, },
}, },
plugins: [], plugins: [],
}; } as const satisfies Config;
export default config; export default config;