Blurry Font in H1 in Chrome about nes.css HOT 10 OPEN

This is related to #40, #72, #75. It has to do with the font-smoothing property and how it's handled on different systems/browsers. @robotrono what OS are you on?

from nes.css.

Thanks 🙇

It seems to be no problem to me. 🤔
please let me know about your environment. 🙏

my environment

• macOS High Sierra
• Chrome 70
• Firefox 63

from nes.css.

@jjspace @BcRikko

I'm using Windows 10, Chrome 71 and Firefox 63 64 bits.

from nes.css.

Right so as I mentioned in my PR pertaining to this, according to caniuse the font-smoothing property only applies on OSX platforms so won't change anything on other platforms. In my quick testing on my windows machine it doesn't seem like the font smoothing works. However I also dont have a super high res/retina monitor so I might not even be able to see it.

from nes.css.

@robotrono I can't reproduce this issue on:
Ubuntu FF 63 64bit
OSX FF 63 64bit
OSX Chrome 70 64bit

from nes.css.

Win10 FF 63

from nes.css.

@robotrono can you please try to reproduce the bug on the latest develop branch?

from nes.css.

@evexoio I need npm right?

from nes.css.

Yes, Here's a step by step to get your css

git clone https://github.com/nostalgic-css/NES.css.git
cd NES.css
npm install
npm run build

then you'll find your css in css/nes.min.css

from nes.css.

Setting font-weight: normal; makes the font a lot less blurry (Windows 10, Chrome 71). Apparently the font has no bold style. Perhaps we can use both properties, font-weight and font-smoothing.

from nes.css.