RPC Library Wiki question: How do I put in a dark background? (or is there a dark mode available?)

[HeavyNorse]

I have absolutely no idea if this is the right place to ask, but I thought I would give it a try anyways, and hopefully there's someone out there who can help me! ^^'

 

I would absolutely LOVE to have inversed colours on my character wiki pages, but I have absolutely no idea how to do that!

Like a dark grey background with white text, like when using dark mode on certain sites.

Is there a way for me to get that? If so, how?

I've tried looking through the Help and Tools sections on the RPC Library, but can't seem to find anything about it anywhere (or I am just blind or don't understand where to look).

 

Please help me. ^^

[Unnamed Mercenary]

Hello! 

 

There's no dark-mode theme or anything of the like.

 

However, you can easily make the changes you want for your own wiki pages with the help of a little HTML/CSS. Our wiki software, Mediawiki, allows for inline CSS in most common HTML tags. You can probably accomplish the changes you want by wrapping most elements in <div> tags, unless the page template you're using is already making use of them. Then you'd need to set it per field.

 

<div style="background-color=000000 color=000000">
  
  your wiki page's content here
  
</div>

 

You can refer to https://www.w3schools.com/cssref/default.asp for some of the things you can use. The CSS background and color fields should do the trick.

[HeavyNorse]

2 hours ago, Unnamed Mercenary said:

Hello! 

 

There's no dark-mode theme or anything of the like.

 

However, you can easily make the changes you want for your own wiki pages with the help of a little HTML/CSS. Our wiki software, Mediawiki, allows for inline CSS in most common HTML tags. You can probably accomplish the changes you want by wrapping most elements in <div> tags, unless the page template you're using is already making use of them. Then you'd need to set it per field.

 

<div style="background-color=000000 color=000000">
  
  your wiki page's content here
  
</div>

 

You can refer to https://www.w3schools.com/cssref/default.asp for some of the things you can use. The CSS background and color fields should do the trick.

 

Thank you so much!

 

Edit:

Hmm, must be doing something wrong. Nothing changes.

Edited July 19, 2019 by HeavyNorse

[Unnamed Mercenary]

1 hour ago, HeavyNorse said:

 

Thank you so much!

 

Edit:

Hmm, must be doing something wrong. Nothing changes.

 

The code snippet above wasn't correct HTML. (Meant more as an example). For CSS, you'll need to use #000000 to #FFFFFF hex codes for colors. ..and a semicolon to separate them like so. Do note that some elements, like the table of contents or the character infobox won't be affected by these changes because they're generated separately from the actual page.

 

<div style="background-color:#000000; color:#FFFFFF;">
  
  content here
  
  use <h2 style="CSS stuff here">Heading2</h2> instead of ==Heading2== to colorize headings
</div>

 

[HeavyNorse]

1 hour ago, Unnamed Mercenary said:

Do note that some elements, like the table of contents or the character infobox won't be affected by these changes because they're generated separately from the actual page.

 

Is there any way to change that though?

[Unnamed Mercenary]

2 hours ago, HeavyNorse said:

 

Is there any way to change that though?

 

You'd need to copy the infobox template to a new template page and make changes to it generation code. Unlike character pages, the infoxbox templates make use of some really complicated code and plugins for their templating features. It's rather fickle and complex to edit and I would not advise doing so unless you're well-acquainted with HTML, CSS, wikicode, and MediaWiki parser functions. The infobox-roe template can give you an idea of how to add stylizing to the infoxbox-character template, but it's by no means a casual edit to make, I'm afraid. 

[HeavyNorse]

On 7/20/2019 at 5:37 AM, Unnamed Mercenary said:

 

You'd need to copy the infobox template to a new template page and make changes to it generation code. Unlike character pages, the infoxbox templates make use of some really complicated code and plugins for their templating features. It's rather fickle and complex to edit and I would not advise doing so unless you're well-acquainted with HTML, CSS, wikicode, and MediaWiki parser functions. The infobox-roe template can give you an idea of how to add stylizing to the infoxbox-character template, but it's by no means a casual edit to make, I'm afraid. 

 

Yeah, coding is definitely not my forte, so might just forget about it. XD

But I really appreciate your help, thank you so much! ♥

[Unnamed Mercenary]

Here's a manually created info table that can be adjusted for colors. It's not quite as robust as the template version as you'll need to make sure your images and categories are set manually, but it should offer you a bit more control! I recommend using the regular infobox first to gather all the generated categories, which you can ten use to flesh out the manual entry. Or you could skip them, but then your character won't show up on those pages if someone's browsing them.

 

For colors, you can reference something like https://htmlcolorcodes.com/ to get the hex code. Everything should be in the format of #RRGGBB to work, with common choices being #FFFFFF for white, #000000 for black, #FF0000 for max red, and so on. To add a section, copy the "optional text" block starting from the |- line above it and then the two lines below that, so you have 3 lines with "|- | left content | right content" to add an entry. Combined with the div tags on top and bottom (or per text block or section), you should be able to make style and color adjustments! Likewise, if there's an entry you don't want/need, you can just remove its lines as well, or reorder them to your liking. (The normal infobox is hardcoded into a particular order).

 

{| class="infobox" style="background-color:#FF0000; color:#00FF00; font-size:89%; width:300px; align:right;"
|- 
| colspan="2" style="font-weight:bold; background-color:#000000; color:#FFFFFF; font-size:150%; padding:3px;" | [[Image: Ul%27dah-transparent.png | 48px]]   NAME
|- style="text-align:center;" 
| colspan="2" style="padding:0.5em;" | [[Image: Placeholder_person.gif | 250px]] <br/>''caption''
|- style="background-color:#000000; color:#FFFFFF;"
| colspan="2" | <center>'''Title'''</center>
|- style="background-color:#000000; color:#FFFFFF;"
| '''Gender''' 
| Gender 
|- style="background-color:#000000; color:#FFFFFF;"
| '''Race'''
| [[Category:Race]] Race
|- style="background-color:#000000; color:#FFFFFF;"
| '''Clan'''
| [[Category:Clan]] Clan
|- style="background-color:#000000; color:#FFFFFF;"
| '''Citizenship'''
| [[Category:Citizenship]] City
|- style="background-color:#000000; color:#FFFFFF;"
| '''Server'''
| [[Category:Server]] Server
|- style="background-color:#000000; color:#FFFFFF;"
| '''Optional Thing'''
| Right side text
|}
[[Category: Character]] [[Category: Player Character]]