Hacker News Reader

Comment by grepular | Hacker News Reader

The existing HN CSP policy allows inline styles. A bookmarklet which just does the following would work:

document.querySelectorAll('*').forEach(d => d.style.fontSize='20px')

I find it odd that mobile browsers don't allow you to set the font size like desktop browsers do.

Awesome! I was creating a style element and added it to the head. The CSP do not allow that.

Now that I know I can alter the elements directly, I will do that instead.

Hacker News - I'm back!

Using a style element should have worked too. The HN CSP policy has unsafe-inline which covers both of these things.

Perhaps your problem wasn't with CSP at all, but something else. Maybe a CSS specificity issue?

[edit] - Yeah, I just created this bookmarklet and it worked fine:

javascript:(function(){s=document.createElement('style');s.textContent='*{font-size:20px}';document.head.appendChild(s)})()

Even better!

My solution was a link element with a data: URI. Yours is much more elegant. And works!

Thank you very much!

That would be the problem. The HN policy for styles is:

style-src 'self' 'unsafe-inline'

This means they can include CSS from the same origin, or inline. It would need "data:" adding to the list to allow data URI's as an accepted source.

Firefox on Android allows scaling according to system font, under Settings > Accessibility.

I suppose though that OP is happy with system fonts and not HN fonts.

The font is still quite small on HN even with the system font set to the largest size.