[Userstyle] WaniKani Breeze Dark

@theusaf Which place is this fixing? I looked through all the subpages and I’m not seeing it so far.

@artemigos It looks like WaniKani reverted some of their changes. Earlier, certain styles had !important at the end of them, causing the issue, which is no longer there.

The best kinds of bugs are the ones that fix “themselves” :smiley:

1.3.15 release

Fixed

  • sections on subscription page have the correct background and text color again
  • inverted colors of image showing no upcoming reviews
  • background and text color of forum section header
  • restored avatar on profile page
  • minus button visibility in reorder ultimate 2

If you still know about things that are broken, then go ahead and let me know. I didn’t really check if any of the supported user scripts broke, so there might be things.

The settings styling is now broken. From Item Inspector:

BreezeDark

I see, that’s a big one, I will take a look later today.

Is it possible that this is something on your side? With WKOF, Additional Filters, Item Inspector and Self-Study Quiz enabled, this is what it looks like for me:
image

The div with rounded corners that is there has no background set for me. I also looked through the changes I made and I don’t see anything that could affect this.

I have tracked this issue to the Heatmap script. When turn this script off the issue disappears. When I turn the script on the issue comes back.

@Kumirei please investigate. The Heatmap script breaks the settings styling under Breeze Dark.

I was using a jQuery datepicker element in my settings and thus loading the CSS for it. However, it seems like the jQuery datepicker css also affects other jQuery modules (like the one used for the WKOF settings dialogue). For simplicity I have removed the datepicker.

If you look for a replacement you may use this.

Kumirei? Do know why or how to fix the obscured user synonyms?

Any I create are unreadable T_T

@artemigos see the post I am responding to.

As a temporary fix you can put this at the end of Breeze Dark

.new-synonyms li {
    z-index: 1;
    background-color: transparent !important;
}

.new-synonyms li form {
    z-index: -1;
}

.new-synonyms li:hover form button::before {
    opacity: 1;
    transition-delay: .1s;
    transition-duration: .2s;
}

image

That did the trick! Thank you so, so, so much @Kumirei !

I see, this feature flew under my radar. I’ll take a look later.

@Kumirei can I just use your code for Breeze Dark when I do this?

Sure, but I would recommend you have a look at it first. I didn’t make sure it’s the best solution

Just want to say I fixed this myself by having the following:

.new-synonyms li {
    background-color: #1e2123 !important;
}
  
.new-synonyms form button {
    background-color: transparent !important;
}

The button animation is fine with just this as well. Just an alternative if it helps at all.

I love this style @artemigos!

It just seems to have one problem when used with the Self-Study Quiz script, it hides the green/red highlight around the answer which marks it as correct/incorrect (screenshots below). The script still works as intended, but not being able to see whether you’ve got it right or not apart from looking at the correct/incorrect count is a bit annoying!

Any chance of a fix if you’ve got time? :pray:

Edit: One other bug (although this one not very important tbh), I’ve just seen that the dropdowns (“Audio Quiz” & “Burned Items” in my screenshots) also need fixing: when open, all the options (except the selected one) have black text against dark background, making them hard to see!

Not working with Breeze Dark:

How it is without Breeze Dark:

Thanks, for reporting this :slight_smile:

Most of the gratitude should be directed towards the original author not me, but I’m glad you like it.

I’ll definitely make time for this, this is one of the supported user scripts.

hi, im trying to install this but it seems the stylish link and the badge to directly install it is broken, is there anywhere else to install this?