search

git / git-scm.com

The git-scm.com website. Note that this repository is only for the website; issues with git itself should go to https://git-scm.com/community.
https://git-scm.com/
MIT License
2.16k stars 1.21k forks source link

css: disable ligatures in monospace fonts #1851

Closed rybak closed 3 days ago

rybak commented 3 months ago

A fix for the readability issue reported in #1817. The commit message basically repeats the bug report.

I am fairly familiar with CSS, but I don't know how exactly .scss works, similar to how I didn't know Ruby in #838 (still don't). However, the things required for this PR were relatively intuitive and I did get the fix working locally simply by guessing. Here are comparisons to the screenshots from the bug report:

what before/after screenshots
"mentions of reflog in monospace" image
"mention of git config" image
"mention of color.diff.new" image
rybak commented 1 week ago

there are people who want ligatures to be used to render their code, see e.g. https://blog.jetbrains.com/idea/2016/06/intellij-idea-2016-2-eap-case-only-renames-in-git-ligatures-background-images-and-more/

The difference being, that ligatures in JetBrains' font don't change the width of the text. In the blog post it's noticeable on the ligature for != which stretches the not equals sign "≠" to the width of two monospace characters:

image

In case of git docs, the width changes:

image

When a monospace font is monospace for each character equally – it is easier to visually compare the docs with a text editor or a shell/terminal, where the names of these commands and config variables will be read by users.

dscho commented 1 week ago

That explanation makes sense to me, that the width changes with those ligatures. So yeah, I am in favor of this PR. @pedrorijo91 what's your opinion?

pedrorijo91 commented 1 week ago

i have no strong opinion on fonts tbh 😄