[Theme][GitHub] feedly theme built from scratch

[levito]

Hey fox, this was fast! Yes, this fixes it. Thanks a lot!

[davidm]

@davidm: Yes, a bug. But not in the theme, but in Tiny Tiny RSS itself. The default theme also doesn't hide the content preview.

But I triple checked it!

[Checks again.]

Uh. You're right.

[Starts kicking own head.]

[davidm]

Sorry to be reporting again and again... Since I last updated, the floating title for combined mode is displaying when there is no open article. The top visible headline is generating a floating title, always. This is particularly evident when items are grouped by feed: the floating title can appear above the feed title. I have highlighted the floating title and the closed headline in this screenshot:

ttrss.png (37.46 KiB) Viewed 8127 times

These floating titles also slow down the scrolling. Firefox 22 on Linux. tt-rss on a shared hosting.

[levito]

@davidm: nevermind, it's always good to get feedback.

You could try with removing these lines from the CSS, in line 1298:

Code: Select all

#floatingTitle:not(:empty) {
   display: block !important;
}


This should solve the initially visible floating title thing. I didn't like that the floating title turns off and on while scrolling, so I added this rule.

Normally, changing feeds should result in an empty floating title, which is still hidden. But that's not always working. It's a JS issue, I can't do anything about it in a theme. Same with the scrolling performance - it's very unlikely that it's caused by the theme. Or is it noticeably better with the default theme?

Firefox and TT-RSS is not the fastest combination. I feel Chrome/Chromium performs a lot better with it. I contributed some scrolling performance optimization to TT-RSS, but it's really hard with such a large, complex codebase. But I can say: There's still a lot of juice in it

[davidm]

Thanks, your solution worked. The floating panel works as in the default theme, and the perceived performance is better.

Then I had to complicate my life. I didn't want to have to remember the change everytime I update your theme, so I tried to do somethin equivalent within the custom CSS dialog. Complications: the selector is complicated (I didn't even know that :empty and :not existed ) and is !important. I simply added this to custom CSS:

Code: Select all

#floatingTitle:not(:empty) {
   display: none !important;
}

Well, that obliterates the floating title even when it should appear AND the perceived performance is still poor.

As you say, Firefox is slower than Chrome (and even worse on Linux). But this performance hit only happens with your theme, not with the default.

[levito]

That's interesting... Could you please check the performance if you replace the rule with this:

Code: Select all

#floatingTitle {
   display: block !important;
}


If it's better, I will change it in the theme. Currently this will show a border on top of the articles which I don't want. But with some minor changes this would be fixed.

And: After the change you could get rid of the floating title with a simple

Code: Select all

#floatingTitle {
   display: none !important;
}


in your custom stylesheet.

Thanks for your feedback and for pointing this out! Good performance is crucial, always

[davidm]

Doing those two changes in my instance makes the floating title disappears in all situations, and the performance on Firefox to improve (smoother scrolling).

Thanks.

[levito]

I have applied the change to the code on GitHub (the one to always show the floating title). Very interesting that the :not(:empty) in the selector slowed things down so much in Firefox. I could feel the difference pretty much.

What I've also done recently is changing the skin of the preferences by customizing the whole Dojo/Dijit theme. So everything is more consistent now.

[recognitium]

Nice theme. I would like to know if there is any easy tweak to show only 1 line per article , when the article is not open.

Thanks for the great work.

[levito]

@recognitium: sure, just add this as custom stylesheet:

Code: Select all

.cdm.expandable:not(.active) .titleWrap,
.hlTitle {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}
.hlTitle {
   max-width: 1px;
}


This will make both closed expandable view (.cdm...) and classic view items (.hlTitle) single line. .hlTitle needs the max-width hack. I don't know what makes this works, but it does. Tested in Chrome 28, Firefox 22 and Safari 6.

[Jekyll]

I can not open headline links (a class=title) with right-click using Firefox 22.0 and Right Links Addon.
(This addon normally enables opening links with right click instead of middle click).

It does work in default.css

TIA Jekyll

[levito]

No idea what this could be. A theme - pure styling - doesn't change any behavior. Did you double-check if it's still working with the default theme?

EDIT:
Maybe you didn't hit the actual link right. I have set the mouse cursor to pointer for the whole row (e.g. in collapsed mode). I think the FF plugin will only detect clicks on A elements. Have a look at your status bar: it shows you the URL if you're actually hovering a link.

[levito]

@recognitium: I have made single-line article previews default. So you can simply update and remove your custom style.

Also, I have added styles for some new features of TT-RSS trunk:

• search term highlighting
• jump to article top
• read/unread state for floating title
• new plugin: shorten expanded articles (which I loved instantly!)

Have fun!

[recognitium]

@recognitium: I have made single-line article previews default. So you can simply update and remove your custom style.

Also, I have added styles for some new features of TT-RSS trunk:

• search term highlighting
• jump to article top
• read/unread state for floating title
• new plugin: shorten expanded articles (which I loved instantly!)

Have fun!

Thanks a lot, @levito!. I'll start using and probably recommend it for my research group .

[Uribou]

Is there a way to re-enable multiple-line article previews?

Thanks.