98.css icon indicating copy to clipboard operation
98.css copied to clipboard

Text is illegible on a 5k screen

Open jackmcdade opened this issue 5 years ago • 12 comments

It's so razor thin I can't really read it anymore. image

jackmcdade avatar Apr 24 '20 21:04 jackmcdade

Maybe you can try setting a scaled resolution of 640x480 ;-)

brantwedel avatar Apr 26 '20 22:04 brantwedel

1st world problems

alete89 avatar Apr 26 '20 22:04 alete89

@alete89 Just saying, it was fine before and now it's not. I don't need to use it, just was being helpful.

jackmcdade avatar Apr 26 '20 22:04 jackmcdade

@jackmcdade wanna give me a full-size screenshot? Unsure what a fix might look like but def wanna look into it

jdan avatar Apr 27 '20 14:04 jdan

Sure thing! I don't know if there's much to be done, or if it will even be obvious how hard it is to read if you're not on a 5k monitor, but here you go. FYI, I'm using the LG 5k for Macs.

jdan github io_98 css_

jackmcdade avatar Apr 27 '20 15:04 jackmcdade

Unfortunately the screenshot doesn't do it justice. Will wait to see if any onlookers have this monitor and may know of a fix.

jdan avatar Apr 27 '20 15:04 jdan

You may just need to set your monitor to 800x600 :rofl:

bergamin avatar Apr 27 '20 22:04 bergamin

Isn't this just the difference between the width of a pixel on a 15" 640x480 Packard Bell (52PPI) vs a 27" 5120x2880 iMac (217PPI)

Possible fixes:

  • marvel at how far we've come
  • transform scale at top level if over a certain screen width (think I done this with one thing, everything else needs to be aware of it though)
  • maybe just double the size of everything if the window width is in excess of 2K

padraigfl avatar Apr 28 '20 10:04 padraigfl

Probably there's a way to get and use actual pixel density, similar to how 2x images are being downloaded but for all the page content? And if so, does we want anti-alised text, or razor edges?

piranna avatar Apr 28 '20 21:04 piranna

Even on a MacBook Pro in pixelRatio *2, some texts are very difficult to read (Especially the labels of the dropdown menus and the <details bold texts). Don't know if related.

Zlitus avatar May 14 '20 08:05 Zlitus

HiDPI scaling is a persistent Windows platform issue that remains unresolved for older programs to this day.

Today, many existing programs have been updated with APIs that allow them to properly scale their interface designs to maintain usability on high-DPI displays. Microsoft didn’t implement anything like that on Windows. That means if the app or program doesn’t know how to scale for high-DPI displays, then you’re out of luck and it will display pixel for pixel. With a 300 dpi pixel density, those UI designs made for 72 pixel per inch displays would shrink so that every normal inch of that interface would now fit into about a quarter of an inch on your screen.

Source

nszceta avatar May 23 '20 06:05 nszceta

@nszceta : Yes I understand very well this, but it is completely unrelated. What you quote is a text explaining than apps have to take care of HighDPI to adapt their interface on Windows; And what we say is than there is a readability problem with the font in some case with 98.css.

Zlitus avatar May 24 '20 23:05 Zlitus