marsultor/public-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add 13 code block @theme tokens

Browse Source 
Light: --color-code-block through --color-code-dot-green, --radius-code
Dark: code-block, code-block-hover, code-gutter, code-gutter-border,
      code-title-bg, code-title-text, code-line-highlight,
      code-line-highlight-border, code-mark-bg, code-copy, code-copy-hover
This commit is contained in:
Krishna Ayyalasomayajula
2026-06-01 22:36:52 -05:00
parent 52b955de86
commit d0f600ed66
1 changed files with 31 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
app/globals.css
View File

@@ -13,6 +13,23 @@
--color-border: oklch(0.92 0 0);
--color-accent: oklch(0.45 0.18 250);
/* Code blocks — Light mode */
--color-code-block: oklch(0.97 0 0);
--color-code-block-hover: oklch(0.95 0 0);
--color-code-gutter: oklch(0.50 0 0);
--color-code-gutter-border: oklch(0.90 0 0);
--color-code-title-bg: oklch(0.95 0 0);
--color-code-title-text: oklch(0.40 0 0);
--color-code-line-highlight: oklch(0.92 0.02 250 / 0.3);
--color-code-line-highlight-border: oklch(0.45 0.20 250);
--color-code-mark-bg: oklch(0.90 0.03 250 / 0.4);
--color-code-copy: oklch(0.40 0 0);
--color-code-copy-hover: oklch(0.25 0 0);
--color-code-dot-red: oklch(0.60 0.22 15);
--color-code-dot-yellow: oklch(0.75 0.18 65);
--color-code-dot-green: oklch(0.65 0.18 140);
--radius-code: 0.75rem;
/* Fonts — override defaults */
--font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
--font-serif: 'Inter', -apple-system, system-ui, sans-serif;
@@ -89,6 +106,20 @@
--color-ink-soft: oklch(0.72 0 0);
--color-border: oklch(0.17 0 0);
--color-accent: oklch(0.68 0.20 250);
/* Code blocks — Dark mode */
--color-code-block: oklch(0.04 0 0);
--color-code-block-hover: oklch(0.06 0 0);
--color-code-gutter: oklch(0.30 0 0);
--color-code-gutter-border: oklch(0.14 0 0);
--color-code-title-bg: oklch(0.03 0 0);
--color-code-title-text: oklch(0.55 0 0);
--color-code-line-highlight: oklch(0.12 0.02 250 / 0.3);
--color-code-line-highlight-border: oklch(0.68 0.20 250);
--color-code-mark-bg: oklch(0.10 0.03 250 / 0.4);
--color-code-copy: oklch(0.60 0 0);
--color-code-copy-hover: oklch(0.85 0 0);
--shadow-card: 0 1px 4px oklch(1 0 0 / 0.06);
}