[Userstyle] WaniKani Breeze Dark

[Kumirei]

The link works fine for me

[assawa]

really? when i click the link it shows this for me

which I assume is the source code
I would try to build it myself but i really dont want to learn how to code in SCSS from scratch

[Kumirei]

First of all you need an extension to house your styles, such as the Stylus extension. Once you install that you can go back to the style page and it will prompt you to install it in the extension. Also, the real CSS doesn’t begin until ==/UserStyle== */, so the weird looking stuff is just information for the browser extension. The SCSS is already compiled to CSS

[assawa]

ahh i got it now thanks alot

[Kumirei]

No problem!

[Rrwrex]

Oh, man. This is my new favorite thing.

I had no idea how easy it was to change the only thing that bugged me about this theme: wayyyyy less visual disambiguation between meaning questions and reading questions.

I highly, highly recommend the following to anyone else who needs as dramatic of a reminder as possible when you’re supposed to switch to “English” mode and provide a meaning answer (vs. the Japanese reading):

1. Stylus menu → Options

2. Click the gear icon next to Breeze Dark

3. Change the Review Meaning Background color to #7e5202 (a lower luminosity version of the gold Kanji Color).

4. Leave the other defaults the hell alone. They are <chefs-kiss>Perfect</chefs-kiss>!

[artemigos]

1.3.16 release

Fixed

• fixed styling of user synonyms
• decluttered style for “patterns of use” tabs
• fixed answer field background in self-study quiz

---

@Rrwrex thanks for the trigger and code snippet for the Self-Study Quiz fix - it made things easier to figure out for me.
@Kumirei and @LupoMikti thanks for pointing me in the right direction with user synonyms.

[Rrwrex]

FYI: Looks like the new extra study features breaks some things with breeze dark.

[Hubbit200]

Yep - if you could find some time at some point soon to fix breeze dark with the extra study buttons I’d be eternally grateful @artemigos lmao

[artemigos]

Hi, I’m slightly sick right now, but I’m estimating that I’m getting better already I should be able to take a look sometime next week. Is the new feature big?

[Hubbit200]

Good luck getting better! No rush for now

How useful it is will depend very much on your learning style: I personally don’t think I’ll be using the default Extra Study options, but I’m already loving it with the “Extra Study: Burned Items” script - it’s like self-study quiz but in standard WaniKani review style. Still obviously missing lots compared to the self-study script (such as possibility of audio → meaning questions) but it definitely has potential!

[Rrwrex]

@artemigos

I’m slightly sick right now

Get well. Nothing urgent.

The feature adds a new set of pages at www.wanikani.com/extra_study — I can’t figure out a simple way to get stylus not to apply breeze dark to just those pages (lookahead regex patterns don’t seem to be supported).

It’s an odd problem. I haven’t spent much time looking at it but for some reason the entire menu-bar div hierarch disappears entirely like it’s at a lower z-index (nothing there is visible or selectable, but it does take up space in the display layout). I don’t see anything with a higher z-index though…

As usual, writing down the problem led me to the crux of the issue, if not the fix.

The extra_study pages give a z-index of 1 to the parent container (.menu-bar). Breeze dark assigns a z-index of 100 to #stats and #summary-button, but these are children of .menu-bar. The end result is that the menu bar is hidden under everything.

This is the rule currently being applied:

#stats, #summary-button, #header-buttons {
    color: #bcbcbc !important;
    z-index: 100 !important;
}

Simply changing the rule to the following does the trick:

.menu-bar, #stats, #summary-button, #header-buttons {
    color: #bcbcbc !important;
    z-index: 100 !important;
}

That is, at line 1082 in the script, insert a line containing

.menu-bar,

I’ve not tested this thoroughly to ensure it doesn’t break anything on other pages.

[Hubbit200]

Anyone have any idea how I could fix this blue outline around the checkbox in @Sinyaven’s script with Breeze Dark?

I can’t seem to override this selector in Breeze Dark: input[type="checkbox"]:checked { border: 1px solid #1d99f3 !important; } on line 366, even using !important, with a higher specificity (the Audio Quiz script’s .switch class) and placed after the CSS on line 366. I thought that would give my custom CSS higher priority, but apparently not!
Any ideas?

The script in question:

@Sinyaven

Extra Study: Audio Quiz

[artemigos]

I’ll be working on the extra study stuff today, I can try to exclude this checkbox from breeze dark styling while I’m at it. Also, I need to catch up with popular user scripts - it seems that the extra study feature lead to a bunch of new, useful scripts

[Hubbit200]

Thanks, I appreciate it I didn’t want to trouble you, but my CSS knowledge is limited so I just couldn’t work it out!

[artemigos]

Don’t worry, that’s what I’m here for

[artemigos]

1.3.17 release

Fixed

• audio buttons in review and extra study now show up properly (color and visibility fix)
• top bar with title and buttons is now visible in extra study
• hiragana now has a readable text color in kana chart in extra study and review
• improved visibility of the question marks of the 2 new buttos starting extra study sessions
• inverted the colors of the extra study image on the dashboard

---

@Rrwrex your fix made it in as-is, thanks for the investigation
@Hubbit200 @Sinyaven I’ll check back again tomorrow and probably get the fix for the audio quiz checkbox

[Gorbit99]

@artemigos I’ve added in breezy dark support for CIDWWA, but it blends into the background currently (see link). If you have the time, could you do something about that? I’ve added in the class “cidwwa-modal” onto the root modal element.

[IstudyKanjiNow]

@Maxung

Cascadea

thanks man

[artemigos]

Sorry, somehow i missed the notification about your message. Sure, I’ll take a look at it, maybe even tomorrow

śr., 23 mar 2022, 01:01 użytkownik Gorbit99 via WaniKani Community <notifications@wanikanicommunity.discoursemail.com> napisał: