Article theme readability tweaks

[N-Upchurch]

Brief description of the feature request

I didn't necessarily want to open a PR as I'm sure there are good reasons for the theme being as it is (and I just kind of threw this together), but I wanted to share some tweaks I made to the theme to enhance readability.

The text in my version has a more comfortable margin on either side, which also serves to bring the article text column closer to an ideal character count per line for readability.

Before

After

Here's the output of diff nudus-dark/html_style.css nudus-dark-readable/html_style.css:

21c21,23
<   min-height: 100vh; }
---
>   margin: 1rem 15vw;
>   min-height: 100vh;
>   }
115c117
<   max-width: 100%; }
---
>   max-width: 70vw; }
118a121,124
>   
> img {
>   width: 70vw;
> }
202c208,210
< 
---
> p {
>   line-height: 1.5; }
>   
256,258d263
<   @media only screen and (max-width: 800px) {
<     .rssguard-mwrapper img, .rssguard-mwrapper video {
<       max-width: 100% !important; } }

[martinrotter]

Converted to discussion.

Well. Yes.

As you probably noted, I am hardly capable at designing actually good skins/themes. The default nudus- themes were designed by @akinokonomi if I remember correctly and they seem to do just fine job - there are basically no bugs filed complaining about those.

I have huge todo-list if things to do for RSS Guard and I plan to program new default light/dark skin with simplicity and readability in mind, but if anyone steps in and does that, I am willing to assist.

Your tweaks are probably good, but I personally do not really like that wide left/right margins primarily because many many many users do not maximize RSS Guard window and therefore the article reading area is usually quite small, thus every square cm counts.

[N-Upchurch]

Yes, I agree with you that the existing themes are mostly fine also. I don't use RSS Guard maximized, and I find that the theme with my tweaks works well when the viewport is >= 800 px on my 2560x1440p screen, but below that things do become squished.

I used the viewport width to very coarsely give the text column a bit of breathing room, but I think that the proper modern solution would be to use a fluid grid and fluid spacing. This should better accommodate for smaller viewport widths; you can see this in action on my personal website which works well on mobile even though the CSS contains no breakpoints.

It might also be a good idea to package a webfont or two and allow the theme to specify a default typeface and size so that a consistent experience can be delivered out of the box.

I hear you about wanting to stick to your areas of expertise; if I have the time I may have a crack at a fluid theme and send it your way so that you can have a look.