AniList High-Contrast Dark-Theme

Reinachan
2020-11-12T18:45:48Z

Adjusts the dark-theme to have higher contrast and some other tweaks.

AniList High-Contrast Dark-Theme

Major overhaul to the default dark-theme on AniList to improve accessibility for visual impairments where increased contrast is helpful but dark themes still preferred.

Install

Computer

you can install it via UserStyles.world, directly from GitHub, or from GreasyFork — with Stylus on Firefox or Chrome

Android

Add it through the same method as above, just use a browser that supports extensions. Kiwi Browser and Yandex Browser both support Chrome extensions. Other browsers might support these extensions in the future or currently. I'm not an Android user, so open an issue or make a PR if this information is out of date.

iOS/iPadOS/Alternative method for MacOS

You have to use Safari on iOS/iPadOS 15+ for this method.

Install Userscripts extension. This one is blazing fast and privacy-respecting. Open the app you've installed and set a directory for the extension to read from. I recommend storing it on a cloud service so you can easily sync it between different devices. Putting it on a cloud service also allow you to easily add the style from a computer.

Install from your iOS device

Add this Shortcut which allows you to download files from a url and choose the file extension. Hold on this link and choose "Share". Scroll until you find Download File and tap that one. Save to the directory you chose in the previous part and when it prompts you, replace .txt with .css.

Install from a computer

Download the file from here and place it in the folder in the cloud service you picked as your directory for Userscripts.

Screenshots

Known Issues

The GraphiQL interactive editor is still light-themed.

If any of these issues are really annoying to you, message me on my profile https://anilist.co/user/Reina/

Changelog

1.0.0 - Released
1.0.1 - Fixed navbar not disappearing when scrolling

1.1.0 - Adjusted the scrollbar to integrate better with the look and be slimmer
1.1.1 - Fixed an issue with the quick-add-to-list dropdown on media pages having white text on a white background
1.1.2 - Fixed an issue with the watching/reading status from the advanced entry editor
1.1.2.1 - I accidentally deleted the closing bracket at the end which broke the plugin. Should be fixed now.
1.1.3 - Apparently I can't have that many numbers in my version, so I had to change it to 1.1.3 instead of 1.1.2.1

1.2.0 - Made the scrollbar-styling work in Firefox using official CSS spec. Made the scrollbars in long posts not change the width of the content when you hover over the element (as in, it's always there, but transparrent until you hover over the field).
1.2.1 - Removed the padding I added for some testing and forgot to remove before publishing. Oops.

1.3.0 - Added dark-theme to the database submission manual and darkened the announcement background colour.
1.3.1 - Dark-themed the calendar picker and removed a superfluous closing curly bracket
1.3.2 - Quick-fix of miscoloured arrow on the calendar picker.

1.4.0 - Major under-the-hood restructuring as well as some welcome changes to how liking activites work and filtering posts displays.
1.4.1 - Fixed an unintentional text alignment issue with the edit post dropdown.

1.5.0 - Database tools are now usable on small screens and viewports.
1.5.1 - Improved modals, character page, and images in the database tools on small screens.
1.5.2 - Updated metadata as I now host the userstyle on Github.
1.5.3 - Fixed semi-transparent navbar. Now it actually appears semi-transparent.
1.5.4 - Enabled database edit button on mobile.
1.5.5 - improved like hearts with hover effects.

1.6.0 - Dark-themed AniChart and styled some more aspects of Automail.
1.6.1 - Fixed the scrollbar issue when you hover over custom lists that overflow.
1.6.2 - Merged minor tweaks from PR's by @synthtech.
1.6.3 - Refinements. Gave comment/post composer back the scrollbar as my hack sometimes made it hard to reach content. Removed height-change animation to remove the appearing and disappearing scrollbar. Added spacing to the bottom of bios to prevent content from almost overflowing.
1.6.4 - Changed the colour when hovering over a liked heart. It becoming blue when hovering previous was a bit confusing, especially as it stayed blue when clicking like in the first place.
1.6.5 - Added the stuff I forgot in the previous version making it actually work.

1.7.0 - Added content previously hidden on small screens. You can now get tags and streaming links on media pages and on profiles you can now see favourites and activity history.
1.7.1 - Fixes to improve compatibility with automail
1.7.2 - fixes width of streaming links

1.8.0 - Changed the GitHub Action to use a new extension, Userscripts, for iOS that is significantly faster and privacy-respecting than Hyperweb. Removed the now unecessary submission manual stuff as AniList moved that to a different service. Deprecated the old bookmarklet method (the file will remain but the install instructions have been removed).

1.9.0 - Merged PRs by @kazzarin removing duplicate tag section on media pages as AniList added those in themselves. The other one switches to a userscript as an alternative method of injecting the style rather than the previous alternate userstyle.