Fandom Developers Wiki
Advertisement

FANSUN is a dark theme stylesheet for official wikis. It amends all aspects of site theming - extension styling, site customisations and anti-pattern fixes are all supported.

There is an extension script that attempts to amend SASS parameters, alongside post-render CSS imports from ResourceLoader and AssetManager.

Installation

Step one: importing the stylesheet

There are two ways to install this stylesheet:

  • globally, for the 3 fully supported wikis
  • locally, for these 3 wikis OR any other official wiki

Global installation of the wiki stylesheets

@import url('/load.php?lang=en&mode=articles&articles=u:dev:MediaWiki:FANSUN/$WIKI.css&only=styles');

Local installation of the main stylesheet

  • The main stylesheet isn't scoped to a wiki, so you need to have no CSS rules inside your global.css to use this method.
  • In case you do have CSS rules on your global.css page, it is possible to move them to another page (for example global-code.css) and import that page in your global.css page.
  • Now add this code in your Special:MyPage/common.css.
@import url('/load.php?lang=en&mode=articles&articles=u:dev:MediaWiki:FANSUN.css&only=styles');

NB: For Community Council, local user CSS does not work. Using the instructions in § Global installation of the wiki stylesheets, just import u:dev:MediaWiki:FANSUN/council.css globally.

Step two: importing the script

Installing the script will amend most aspects of user styling and dynamically loaded CSS imports.

Color scheme

  • Jet Blue Gray#2c343dfor body$fansun01
  • Dark Blue Gray#39424dfor page$wds-color-dark-blue-gray
  • Mid Dark Gray#404a57for header$fansun02
  • Teal#00c8e0for links$fansun03
  • Cerulean#00b7e0for buttons$fansun04


Notes

  • A word of warning that this stylesheet is 200KB post-minification!
  • User scripting support is unlikely at this time. Expect code clashes for two reasons - 1. a lack of CSS variables for customisation and 2. load order issues with overriding SASS parameters.

See also

  • Dark syntax highlighting, code editor: Nord
  • Dark global navigation: Katsuragi
Text above can be found here (edit)
Advertisement