edd-themedd
edd-themedd copied to clipboard
Default font improvements
I made some revisions to the font CSS which looks a lot better on the theme:
body, button, input, select, textarea {
color: #696969;
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 1.1rem;
line-height: 1.5rem;
text-rendering: optimizeLegibility;
}
This obviously looks better for OS X users but has the fallbacks in place as like before for compatibility.
I also applied to the headers as well!
Currently Themedd uses text-rendering: geometricPrecision;. Gecko actually ignores this and uses optimizeLegibility anyway. We may however remove text-rendering altogether since there are some performance issues on mobile devices and the difference IMO is very, very minor. I think it affects kerning at certain font-sizes for certain fonts?
Themedd is obviously BYOF (Bring Your Own Font) but I agree that "Helvetica Neue",Helvetica,Arial,sans-serif; is a better default font stack than Arial, Verdana, sans-serif; 👍
Implemented new font stack above, tagging for future release so we can revisit the text-rendering.
What do you think of this font stack @amdrew?
font-family: system, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Lucida Grande', 'Arial', 'Verdana', "Sans-Serif"
@davidsherlock I like the idea of using native fonts, definitely looks a lot nicer, at least on my mac. Will need to do some testing to see how this looks on PCs etc.
Small issue with the stack above, "Sans-Serif" shouldn't have quotes since it's not a specific font.
Will revisit this after 1.0.
Just found another good looking font stack (posting here for reference):
-apple-system,BlinkMacSystemFont,San Francisco,Helvetica Neue,Helvetica,Ubuntu,Roboto,Noto,Segoe UI,Arial,sans-serif