All this time our editor has used monospace. Use a real code font#8076
All this time our editor has used monospace. Use a real code font#8076
monospace. Use a real code font#8076Conversation
Better late then never I guess! We use Source Code Pro elsewhere, so all this PR does is apply it to the CodeMirror instance. Source Code Pro is much more suitable for small font sizes, so I actually felt the need to scale down the base font for the editor after changing it. It was a little debatable but I went with `text-xs` for higher density. This has made me realize that we really should make settings for the following when we have time: - [ ] setting for app font-size - [ ] setting for editor font-size - [ ] setting for editor font-family (maybe could take a URL?)
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Good catch! I hope the fonts in the variables pane look fine. |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'); | ||
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations'); |
There was a problem hiding this comment.
There's a syntax error in the font-face declaration. The semicolon after format('truetype-variations') terminates the declaration prematurely, which would prevent the subsequent format from being recognized. Replace the semicolon with a comma:
url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'),
url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations');The same issue appears in the italic font-face declaration below.
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'); | |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations'); | |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'), | |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations'); |
Spotted by Diamond
Is this helpful? React 👍 or 👎 to let us know.
There was a problem hiding this comment.
I think you're probably correct here! I might rather open an upstream issue with that repo though
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'); | ||
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations'); |
There was a problem hiding this comment.
There's a syntax error in the font-face declaration. The line ending with format('truetype-variations'); should end with a comma instead of a semicolon since it's followed by another source URL. This would make the CSS declaration properly parseable by all browsers:
url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'),
url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations');The same issue appears in the italic font-face declaration below.
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'); | |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations'); | |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype-variations'), | |
| url('./VF/SourceCodeVF-Upright.ttf') format('truetype supports variations'); |
Spotted by Diamond
Is this helpful? React 👍 or 👎 to let us know.
And deleting in another spot after the font size changed happened to not cause the error this test expected to occur
|
Gonna wait until after we get #7542 in, don't want to derail anything |
monospace....wowmonospace. Use a real code font
|
Just tested again locally, looks great! |
Better late then never I guess! We use Source Code Pro elsewhere, so all this PR does is apply it to the CodeMirror instance. Source Code Pro is much more suitable for small font sizes, so I actually felt the need to scale down the base font for the editor after changing it. It was a little debatable but I went with
text-xsfor higher density. This has made me realize that we really should make settings for the following when we have time:Before
After
Edit: the initial screenshots in this PR description showed that I had changed nothing. I corrected the nothingness, then merged this, and then updated the "After" image with a shot from Staging after merging.