1365755 - Update RSS-Feed Viewer style

Status: RESOLVED WONTFIX

(Firefox Graveyard :: RSS Discovery and Preview, enhancement, P3)

Description

[mosscap]

The built-in RSS-Viewer is a really nice feature to have
but it looks still the same as in Netscape Navigator ! - not bad, but outdated.

It should fit in to the new Firefox Design (Photon)
(match the design from addons-, debugging-, preferences-, ... page)

Things TODO:
- use the same colors and structure like the other about-pages
- do not forget some media-queries for small screens or use in sidebar
- set for images a max-width to 100% to avoid oversized images and unnecessary scrolling

Further more:
- add a INFO-link (What is a RSS-Feed ? / How do i use them ?)
- change the chrome://browser/skin/feeds/feedIcon.png to a SVG-file
- relocate the subscribe-button back into the URL-bar (awesomebar) similar to the readmode-button

Comment 1

[mosscap]

Attachment: feedIcon.svg a replacement for feedIcon.png and feedIcon16.png

This File is about 1070 bytes, which is smaller than feedIcon.png (~1.79kB), but larger than feedIcon16.png (~0.76kB).

http://mosscap.bplaced.net/svg/tryit.html?file=../data/feedIcon.txt

At this page you can see the difference between the files:
feedIcon16.png, feedIcon.png and feedIcon.svg

You need to open it with Firefox, and it won't work anymore when it(the BUG) got fixed !

Comment 2

[Tim Nguyen :ntim]

Attachment: old-feed-reader.png

I used this page: https://blogs.windows.com/feed/

Comment 3

[Tim Nguyen :ntim]

Attachment: Possible new style

Comment 4

[mosscap]

It does look realy nice, I especially like that the blue looks like the blue used in eg. about:profiles.
Are you reusing the Feed-icon from the chrome://browser/skin/menuPanel.svg image ?

A Feed which contains a Feed description and images in the feed-items would be nice to have as an example.
https://www.mozilla.org/en-US/firefox/nightly/notes/feed/ or https://blog.nightly.mozilla.org/feed/ have at least a description.


There are a lot about pages (about:about), which look similar to the current RSS-Preview Page,
could we use the same Style, some of it, maybe for these pages ?
so that Firefox has not even more different Designs for them or will that be too much work ?
Many of them use this Stylesheet: chrome://global/skin/about.css 
or for Directories: chrome://global/skin/dirListing/dirListing.css

And yes I even dislike that the about:preferences,-debugging,-addons,-networking have all a different sidebar-width
and that the about:networking Warning message looks broken or not like in about:config, not to mention the Design of some about-pages ...

Anyway - if I open a Feed in the Sidebar than for some unknown reason there is no text around the checkbox, select-input and Subscribe-button,
but if I resize the window or use the Responsive Design Mode there is the text displayed.
Is this a CSS-Error(i don't think so), a Parser-Error or can't the DTD's be loaded ?


Is there a Place(Github/CHAT) were we can discuss this further ?
(maybe something were not every change will be listed because I change a lot when the day is long - sorry for my english)


PS: @ntim I like VivaldiFox and hope there is a way that it works after Version 57.
And why does your Feed-icon look blue ? (Are you using Mac ?)

Comment 5

[Tim Nguyen :ntim]

(In reply to mosscap from comment #4)
> It does look realy nice, I especially like that the blue looks like the blue
> used in eg. about:profiles.
Thanks!

> Are you reusing the Feed-icon from the chrome://browser/skin/menuPanel.svg
> image ?
http://firefoxux.github.io/firefox-icons/viewer/#subscribe

> A Feed which contains a Feed description and images in the feed-items would
> be nice to have as an example.
> https://www.mozilla.org/en-US/firefox/nightly/notes/feed/ or
> https://blog.nightly.mozilla.org/feed/ have at least a description.
Thanks!

> There are a lot about pages (about:about), which look similar to the current
> RSS-Preview Page,
> could we use the same Style, some of it, maybe for these pages ?
> so that Firefox has not even more different Designs for them or will that be
> too much work ?
> Many of them use this Stylesheet: chrome://global/skin/about.css
Bug 1367326
 
> or for Directories: chrome://global/skin/dirListing/dirListing.css
I don't know if there's a bug for this one. Feel free to file a bug.
 
> And yes I even dislike that the
> about:preferences,-debugging,-addons,-networking have all a different
> sidebar-width
I don't think there's a bug filed for this, can you file one?

> and that the about:networking Warning message looks broken or not like in
> about:config, not to mention the Design of some about-pages ...
Bug 1324792

> Anyway - if I open a Feed in the Sidebar than for some unknown reason there
> is no text around the checkbox, select-input and Subscribe-button,
> but if I resize the window or use the Responsive Design Mode there is the
> text displayed.
> Is this a CSS-Error(i don't think so), a Parser-Error or can't the DTD's be
> loaded ?
Not sure about this.

> Is there a Place(Github/CHAT) were we can discuss this further ?
> (maybe something were not every change will be listed because I change a lot
> when the day is long - sorry for my english)
I'm sometimes on IRC (irc.mozilla.org) as ntim

> PS: @ntim I like VivaldiFox and hope there is a way that it works after
> Version 57.
Yes, I plan to port it to 57 (Firefox provides enough WE APIs for VivaldiFox).

> And why does your Feed-icon look blue ? (Are you using Mac ?)
Yes, I think it's mac's icon

Comment 6

[Robin Whittleton]

An alternative new style: Firefox already has a Reader View that presumably has been tested for readability. Would it be possible to co-opt the styling from that for reading RSS feeds?

Comment 7

[mosscap]

I like the idea of consistency, which would bring this, especially cool would be if you could also use (a few) Functions/Options which comes with Reader View, but this an the other hand is a bit overloaded.

 - We should keep/use more the same (stylesheet) codebase !!! - 

And no, I am not sure if this is possible, at least it will be more work, than just changing the Stylesheet, also the Reader View will used differently than the Feed-Viewer, so choosing the same Style could be confusing.

Besides I am already happy as long the new Style looks (more or less) like the other about:pages and is responsive (for use in the sidebar), so I think the Style which has Tim Nguyen :ntim created is for now enough, except we find someone who has enough freetime ;)


PS: created BUG 1402569 for the relocation of the subscribe button

Comment 8

[mosscap]

Attachment: Feed.patch

There is also a Mockup available, with some Notes:
http://www.mosscap.bplaced.net/projects/Mozilla/Bug1365755/index.xhtml

Comment 9

[mosscap]

Since (not sure) Firefox 59, the moz-icon:// protocol is broken/unavailable !

Comment 10

[Marco Bonardo [:mak]]

The feed preview code has been removed by bug 1477669.