Black Highlighter Style Collapsibles

NOTICE:

This is a component page used internally by the SCP Wiki. It is intended to be used and included on other pages.

rating: +40+x
Pretty self explanatory.
For anyone who really wants the dark sidebar from the O.G. BHL on their articles.
Just add this include AFTER the BHL include:
[[include :scp-wiki:component:bhl-dark-sidebar]]

rating: +40+x

Including

On any wiki:

[[include :scp-wiki:component:bhl-style-collapse-source
|scp-number=XXXX]]

Be sure to set the "scp-number" variable accordingly. If you aren't using the Black Highlighter Theme on your article, insert this CSS module after the previous include:


What this is

This is an unofficial Black Highlighter Theme component that adds slick, animated BHL-style collapsible bars to your articles. It affects the existing [collapsible] element. Your articles will probably require only minor modification to be made compatible.


Usage

Collapsible

Normal:
This component modifies the standard collapsible, so this is entirely the same. Heavily recommended that you make the 'show' and 'hide' fields the same.

Note: The "ADDENDUM XXXX.N" is automatically added and incremented based on the number of previous collapsibles. It can be removed, see below.


Always Unfolded:
To be clear, this is literally just an "in-place" decorative element. You aren't actually putting any of your article inside of this "collapsible."

Note: The "ADDENDUM XXXX.N" counter is still incremented by these collapsibles.

COOL THING
[[div_ class="unfolded-collapse"]]
COOL THING
[[/div]]
[[div_ class="unfolded-collapse-border"]]
[[/div]]

Modifiers

Changing Colors:
Note: This will affect all collapsibles in the article.
--base-color: The color of collapsibles you aren't hovering over.
--hover-color: The color of collapsibles you are hovering over.
--click-color: The color a collapsible flashes when you click on it.
The default values are included below. You only need to add this code if you want to use different colors.

[[module css]]
:root{
  --base-color: rgb(66, 66, 72);
  --hover-color: rgb(100, 46, 44);
  --click-color: rgb(133, 0, 5);
}
[[/module]]

Centering:

COOL THING
[[div_ class="center-collapse"]]
[[div_ class="unfolded-collapse"]]
COOL THING
[[/div]]
[[div_ class="unfolded-collapse-border"]]
[[/div]]
[[/div]]

Remove "Addendum" and Animation:
Note: The "ADDENDUM XXXX.N" counter is still incremented by these collapsibles.

COOL THING
[[div_ class="no-addendum"]]
[[div_ class="unfolded-collapse"]]
COOL THING
[[/div]]
[[div_ class="unfolded-collapse-border"]]
[[/div]]
[[/div]]

Remove Footer:



Footer
[[div_ class="addendumfooter"]]
[[/div]]

Credits

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License