2

i’m trying to rebuild base theme with dark colors and rebase night.css on that, here’s how it looks like atm:

image

if this works out, significantly less hacks would be needed in night.css and it should also work in preferences and for dialogs

3

this is definitely not complete yet but should be way better than before:

https://git.tt-rss.org/fox/tt-rss/commit/b78671356031f2f7d4c3340d2d955a306729f766

suggestions welcome

also: way less hacks

4

Nice!

The top buttons and attachment button could use some consistency
Dropdowns

The “Choose file” button as well:
FeedIcon

The edit feed checkboxes are tough to understand what’s going on since the background is the same as the disabled check box:
EditFeedChecks
Changing the backgrounds to #222 seems to clear it up and looks clean/flat:
EditFeedChecks222

5

I also think it makes sense to make the splitter have the same bg color as the panels (the thumb should be enough to show it can dragged)
dijitSplitter

.flat .dijitSplitterV .dijitSplitterThumb {
    background: repeating-linear-gradient(to right, #ccc, #ccc 1px, #222 1px, #222 2px);
    width: 3px;
}

.flat .dijitSplitterV {
    width: 7px;
    background-color: #222;
}

body.flat.ttrss_main.ttrss_index #feeds-holder {
    box-shadow: none;
}
6

Is there a simple way to disable the image darkening?

7

@disconn3ct add this to the custom css in your prefs:

body.flat.ttrss_main .post .content img:not(:hover) {
    opacity: 1;
    filter: none;
}
8

thanks for the feedback on this, @wbagdon

9

Thanks! That got me on the right track. Inspecting it looks like the image was under .cdm. I updated to this and it’s great (in case anyone else wants the change)

body.flat.ttrss_main .post .content img:not(:hover),
body.flat.ttrss_main .cdm .content-inner img:not(:hover),
body.flat.ttrss_main .post .content video:not(:hover),
body.flat.ttrss_main .cdm .content-inner video:not(:hover) {
    opacity: 1;
    filter: none;
}
10

fox: new dark themere is looking good. any thought to upgrading the android app dark theme as well?

11

what would you want upgraded?

12

Would it be possible to go back to using variables to define colors in CSS?
Or is there some easy way for me to be able to modify one variable to change colors.
I prefer the old blue to the new orange, and I’m trying to just augment your theme rather than creating a completely separate one.

Also the new CodeFlask CSS editor does not show any cursor or selection in the night theme.

13

there are variables, you just have to use less to adjust them properly

oh, you’ll also need to rebuild dijit dark theme then, that’ll need some npm cancer like grunt and stylus

if there’s more people who want it, i can make two dark themes - blue and amber, i have all this crap installed already anyway

although i’m not sure how would night mode switch work then

yeah, i’m aware of this; there’s no stock dark theme for it i think. maybe i could filter invert it. :slight_smile:
this needs fixing sure

e: https://git.tt-rss.org/fox/tt-rss/commit/6c9509ebae43a10b54c838ed7b027e4288a4c3b5 eh

14

update re: codeflask

so much shit is hardcoded in there and it’s in general so flaky, i don’t think it’s worth keeping it
reverting

15

Maybe use ace-editor? https://ace.c9.io/

Would you want an “accent color picker” implemented in the prefs?
I could take this on if you think it would be a worthwhile addition.

16

what like custom accents? i don’t really see how that could work, unfortunately.

i’ll take a look but in all honesty css editor is such a minor thing, dragging even more third party stuff for it doesn’t seem worth it. codeflask is really tiny, that’s why i initially added it.

e: https://git.tt-rss.org/fox/dijit-flat-ttrss just take a look at this pile of code

17

Re: css editor, completely agree.

Re: Custom accents, my idea was to go back to using CSS custom properties with fallback values and override via user preference:

Obviously this won’t work for IE users, not sure if that’s the reason you abandoned it in the first place.
If that’s the case, then yes there probably is no easy way to do this other than generating the CSS on the fly to override all the instances of accent colors which is probably a horrible idea.

18

take a look at the dijit theme, it’s used for the entire UI, and its entirely hardcoded with predefined colors

i’ve stopped using css variables in night.css because i converted it to LESS and it can use default.less variables directly when it is being rebuilt, which means way less theme-specific overrides

i.e. it’s a lot easier to change @color-panel-bg in theme once than adding multiple stanzas for it

also, phpstorm builds css files for me transparently when i edit less files

e: also, i don’t think css variables support stuff like lighten()

19

I am using the dark theme updated this morning and the latest firefox nightly on Win10. My view is set to “Unread” and when I click the check marks next to the feed title to mark the feed read, the items are marked read but still visible. since i am in a “Unread” view they should no longer be visible, correct? This was the previous behavior.

I do have “hide feeds with no unread articles checked”. I am in combined feed display.

EDIT: Just tried in Chrome and same behavior

20

this was never a thing

not until you reload the feed

21

I don’t use the dark theme, but isn’t @pcause1 typing about the same/similar issue I complained about over in this thread(?) ==> Impending doom, part whatever - #7 by martywd

.