A few additions to Discourse Breeze Dark style

WaniKani API And Third-Party Apps
1

When I saw there was a dark theme for the WaniKani forums too, I immediately installed it because my poor eyes hate bright screens. As the author’s post said, it’s not 100% complete, so some sections were unstyled, like so:

image
image1407×710 81.4 KB

image
image1407×710 97.1 KB

This was driving me crazy, so I made a few amendments as part of an exercise (I’m learning web development), but also so I could stop having random things blind me or be unreadable. It’s not perfect by any means (code snippits are a especially a little wonky if they’re given a language, so syntax highlighting will be mostly overwritten to ensure readability), but it works. Sharing the amendment in case someone finds it useful. Sorry I’m not more of an artist. :stuck_out_tongue:

image
image1407×710 81.7 KB

image
image1407×710 106 KB

To add the stuff in, click on the Stylus button, and then click edit.
image

Then paste this at the bottom of the file:

/*StarMechStuff!*/
aside.quote .title, blockquote, .topic-map {
    background-color: #333;
}
.topic-map h3, .topic-map .information{
color: #ddd;
}
a.mention{
    color: #383838 !important;
}
.reply-area{
    background-color: #232629;
}
.d-editor-textarea-wrapper, .d-editor-preview{
    background-color: #1a1c1e;
    border: 0;
}
.d-editor-textarea-wrapper textarea{
    color: #919191;
}
.d-editor-button-bar{
    border-bottom: 1px solid #232629;    
}
.d-editor-spacer{
    background-color: #232629;
}
.d-editor-preview{
    padding: 10px;
}
.select-kit.combo-box .select-kit-header{
    background-color: #1a1c1e !important;
}
.select-kit-body, .select-kit-body ul{
    background-color: #1a1c1e !important;
    max-width: inherit !important;
}
.select-kit-row.is-highlighted{
    background-color: #222 !important;
}
.select-kit-row.is-selected{
    background-color: rgb(0,0,30) !important;
}
.category-input{
    color: #232629 !important;
}
code{
    background-color: #000 !important;
}
.presence-users{
    background-color: #31363b;
}

Feel free to leave the comment out. I put it in so I know where I started adding stuff.

2

If I’m not mistaken the dark theme for the forums is provided by Discourse so it’s likely never going to be seen. Although that’s weird that it’s showing white in some places, that must be a bug or something because it doesn’t look like that for me at all.

817×787 72.6 KB

1479×293 16.7 KB

3

Just FYI, there’s also a native dark theme you can select in the interface settings

image

4

That’s not what OP was talking about? I wasn’t aware there was an external dark theme available.

5

@RysingDragon Weird. I wonder why mine was so messed up.
Are you using chrome?

Well dang. lol. I like Discourse Breeze Dark though :[ Looks pretty, like the WaniKani skin.

6

Oh, you were talking about the stock one? I didn’t know there was a stock dark theme. xD
We both TIL’d.

7

Valeth started making version of their WK theme for the forums, but it hasn’t been in active development for a long time now.

8

I’m still using it in combination with the native dark skin and it’s mostly fine. :man_shrugging: