From 03a0ff8f1f933649f2227afe2df8389c910482a5 Mon Sep 17 00:00:00 2001 From: Josh Black Date: Thu, 1 Feb 2024 13:04:30 -0600 Subject: [PATCH 1/3] fix(theme): add font stack as fallback to custom property --- src/theme.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/theme.ts b/src/theme.ts index f3a386005ea..721202b44e0 100644 --- a/src/theme.ts +++ b/src/theme.ts @@ -20,15 +20,14 @@ const fonts = { 'Apple Color Emoji', 'Segoe UI Emoji', ]), - mono: fontStack([ - 'var(--fontStack-monospace)', + mono: `var(--fontStack-monospace, ${fontStack([ 'SFMono-Regular', 'Consolas', 'Liberation Mono', 'Menlo', 'Courier', 'monospace', - ]), + ])})`, } const lineHeights = { From d62ef4b0ce3d6ca1b31eda8fb3a973aee6a62896 Mon Sep 17 00:00:00 2001 From: Josh Black Date: Thu, 1 Feb 2024 13:05:18 -0600 Subject: [PATCH 2/3] chore: add changeset --- .changeset/selfish-guests-stare.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/selfish-guests-stare.md diff --git a/.changeset/selfish-guests-stare.md b/.changeset/selfish-guests-stare.md new file mode 100644 index 00000000000..7d65f66d225 --- /dev/null +++ b/.changeset/selfish-guests-stare.md @@ -0,0 +1,5 @@ +--- +'@primer/react': patch +--- + +Update mono font in theme to use font stack as fallback to custom property From a95cec4f8e86ccb890b82b11299ddcfb4a805995 Mon Sep 17 00:00:00 2001 From: Josh Black Date: Thu, 1 Feb 2024 13:15:19 -0600 Subject: [PATCH 3/3] test: update snapshots --- src/__tests__/__snapshots__/TextInput.test.tsx.snap | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/__tests__/__snapshots__/TextInput.test.tsx.snap b/src/__tests__/__snapshots__/TextInput.test.tsx.snap index 87bdf2dc0ba..7916cf5aa94 100644 --- a/src/__tests__/__snapshots__/TextInput.test.tsx.snap +++ b/src/__tests__/__snapshots__/TextInput.test.tsx.snap @@ -1212,7 +1212,7 @@ exports[`TextInput renders monospace 1`] = ` align-items: stretch; min-height: 32px; overflow: hidden; - font-family: var(--fontStack-monospace),SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace; + font-family: var(--fontStack-monospace,SFMono-Regular,Consolas,"Liberation Mono",Menlo,Courier,monospace); } .c0 input,