[Userstyle] Wanikani Clean Dashboard

[Mempo]

I have long been annoyed by some useless sections on the dashboard. I don’t care at all for the ‘recent unlocked items’, ‘critical items’ and ‘burned items’. Thanks to @RayderBlitz i discovered the ‘Stylish’ add-on that let’s you restyle a website.

So it started out by removing these sections. But i really love one-page websites and wondered i could remove more things, so i restyled the whole dashboard. Essentially, i wanted to distil the dashboard to its very essence (without setting my computer on fire). This meant i wanted the forums and SRS progress visible with one look.

v1.2
- Added option to keep unlocked, critical and burned item panes

With @rfindley’s timeline

How to install

[OPTIONAL - Install the ‘Stylish’ add-on: https://addons.mozilla.org/en-US/firefox/addon/stylish/ ]
- Download the theme at https://userstyles.org/styles/121874/wanikani-clean-dashboard
- Look carefully at the presented options. These can be changed at any time by going back and clicking on ‘Update with Stylish’. Be sure to refresh the page if you do this right after installing the theme for the first time.

Note: it is possible to install the theme as a userscript. The only downside to this is that you always need to refresh the page before changes are applied. This is not the case with Stylish. Personally, i also like to keep userscripts and userstyles separate.

Change log:

v1.1
 - added option to show/hide the dropdown menu in the progress section

v1.0
- Forum headers are smaller
- Removed (in my opinion) useless ‘new items’, ‘critical items’ and ‘burned items’
- Removed radicals/kanji under progress bar
- Removed text under SRS item count

[arkragon]

Looks really nice!

[RayderBlitz]

This looks neat, though I’m currently not going to use it since I’m fine with the dashboard as it is.

Also, as I’ve been told stylish styles can just be added to script addons like tapermonkey etc. and they work just as well (my guess is that in the background stylish works just the same as them… maybe), though imo keeping styles and scripts separately makes it a lot better to manage them… especially when you have 20+ scripts and/or styles.

Ima try out your style though, kinda curious what my dashboard would look like with it.

PS:
One advantage of stylish is that with the website if you add content “switches” the creator can change functionalities and keep the “keys” and  the styles will be updated accordingly (did this in one(?) of my styles if you’re interested in what it’d look like).

Edit:
Actually looks pretty neat, I might even keep it on.
But as Hayako pointed out the dropdowns are missing now, I’d also like to have them back. ;○P

[Hayako]

I really like the style you’ve made! Also in combination with rfindley’s timeline, which I’m also using.

I noticed that the drop down option under the radical and kanji progress bar is gone. I mean the one where you can see which radicals and kanji you need to guru in order to level up. Can you add the drop down again? The drop down option can be very small in my opinion. I just would like to have the option to see the additional info (especially useful with the Dashboard Progress Plus API) AND look your neat style!

[sirvorn]

For people that just want to block entire sections, and you don’t want to add on Stylish, and you already have AdBlock added you can easily block most of the sections on the page you don’t want to see like they’re ads. My friend who uses wanikani blocks off pretty much everything below the progression bar, so his looks like this:

There are definitely some things I just don’t look at

[Renbowsophie]

The only thing I don’t want to see there is the 376 reviews “next day”.

[HigginsHere]

sirvorn said... For people that just want to block entire sections, and you don't want to add on Stylish, and you already have AdBlock added you can easily block most of the sections on the page you don't want to see like they're ads. My friend who uses wanikani blocks off pretty much everything below the progression bar, so his looks like this:

There are definitely some things I just don't look at :P

 Thanks! This worked just as well.

[ffao]

Mempo said...Sorry you need to install a new add-on for this. It's possible to do this in a userscript, but it's a lot more developer-friendly with Stylish. If need be, i could convert it to a userscript if it's heavily requested.

 You don't need to. userstyles.org does that automatically (you probably didn't see it because you have Stylish installed).

Looks very nice! I did edit the style to bring back the dropdowns, they are actually useful.

[embe]

What do I edit to bring back the dropdowns?

[Mempo]

Thx for the feedback!

I removed the dropdown boxes because i don’t use them. Either I just don’t “get” how I’m supposed to interpret them atm, or I’m doing something wrong with the Dashboard Progress Plus add-on (i mean it doesn’t provide the information i expect from it).

But i posted this to help other people, so in the next version i’ll add it back. Ideally there’d be an option what sections to include/exclude. However, it’s the first time i used ‘Stylish’ so I’m not aware of all it’s functionality like @RayderBlitz is.

[Mempo]

embe said... What do I edit to bring back the dropdowns?

 Delete line 66-68

[rfindley]

@Mempo,
I love this script!

It inspired me to add an option in Dashboard Progress Plus to minimize my portion of display, and auto-open the progress:

Dashboard Progress Plus:  v1.2.4 - Added option for compact dashboard display.

[shikaji]

thanks for this great script! since i don’t even care about the progress bars i made them disappear as well. now it’s a one-page website even with ultimate timeline.

[polv]

I tried to install Stylish and the UserStyle on Safari, but it didn’t wrong. The script existed, but didn’t load in the WaniKani website.

[Mempo]

patarapolw said... I tried to install Stylish and the UserStyle on Safari, but it didn't wrong. The script existed, but didn't load in the WaniKani website.

 I don't have access to Safari, so I can't help you with that. It's also possible to install it as a regular userscript (without Stylish), so maybe you should try that.

[polv]

Mempo said...

patarapolw said... I tried to install Stylish and the UserStyle on Safari, but it didn't wrong. The script existed, but didn't load in the WaniKani website.

 I don't have access to Safari, so I can't help you with that. It's also possible to install it as a regular userscript (without Stylish), so maybe you should try that.

 But how do I convert it to Userscript?

[Mempo]

patarapolw said...

Mempo said...

patarapolw said... I tried to install Stylish and the UserStyle on Safari, but it didn't wrong. The script existed, but didn't load in the WaniKani website.

 I don't have access to Safari, so I can't help you with that. It's also possible to install it as a regular userscript (without Stylish), so maybe you should try that.

 But how do I convert it to Userscript?

Uninstall the style, uninstall Stylish, refresh the download page and then there should be an option 'install as userscript' 

[polv]

But there isn’t a button to “Install as Userscript”.

Although I can view the CSS code, I can’t manage to make a workable Userscript.

[rfindley]

patarapolw said...Although I can view the CSS code, I can't manage to make a workable Userscript.

[this] script of mine is a good template for what you need.  Just replace the CSS code.

[polv]

rfindley said...

patarapolw said...Although I can view the CSS code, I can't manage to make a workable Userscript.

[this] script of mine is a good template for what you need.  Just replace the CSS code.

 Still not working. I don't know how to edit the script to make it work. Also, probably many debugging problems in Line 33-36. Deleting the code doesn't work.