Present Malice Theme

---

What is this?

The Present Malice theme is a light theme for BHL visually based off of the 1996 survival horror videogame series Resident Evil. You can use it for any article… but preferably one with a sort of a "cold scientists research - and exploit - the unimaginable" vibe. Or if you like Resident Evil, of course.

---

Theme Colors

Umbrella Red--umbrella-red#8F0000

Barry's Magnum--barry-magnum#E6E6E6

{$color3-name}{$color3-variable}{$color3-info}

{$color4-name}{$color4-variable}{$color4-info}

{$color5-name}{$color5-variable}{$color5-info}

{$color6-name}{$color6-variable}{$color6-info}

Light S.T.A.R.S Blue--light-stars-blue#DCDAEB

Medium S.T.A.R.S Blue--medium-stars-blue#525366

Dark S.T.A.R.S Blue--dark-stars-blue#000854

Wesker's Shades--weskers-shades#141414

Itchy. Tasty.--itchy-tasty#7E4026

Chris's Blood--chris-blood#B90000

{$subcolor7-name}{$subcolor7-variable}{$subcolor7-info}

{$subcolor8-name}{$subcolor8-variable}{$subcolor8-info}

{$subcolor9-name}{$subcolor9-variable}{$subcolor9-info}

{$subcolor10-name}{$subcolor10-variable}{$subcolor10-info}

{$subcolor11-name}{$subcolor11-variable}{$subcolor11-info}

{$subcolor12-name}{$subcolor12-variable}{$subcolor12-info}

---

Signature Care Pharmaceuticals Logo

Note: This is a Black Highlighter based theme. You will need to import the Black Highlighter theme as well in order to use this theme. To learn more go here.

On any wiki:

[[include :scp-wiki:theme:black-highlighter-theme]]
[[include :scp-wiki:component:toggle-sidebar-bhl]]
[[include :scp-wiki:theme:present-malice]]

This theme also has code for Woedenaz's BHL Toggle Sidebar. If you want it removed, simply remove its include above.

---

Alternate Centered Header

This theme has code for Woedenaz's BHL Centered Header. If you want to add it, simply add:

[[include :scp-wiki:component:centered-header-bhl |malice=--]]]

after all of the includes above.

Examples

A horizontal rule can be created with 5 hyphens "-----" and extends across the whole page if it's not placed inside anything (eg a blockquote). The lines separating sections of this document are horizontal rules.

---

Titles can be created by putting between one and six plus "+" at the start of the line

+ Titles

First Title

Second Title

Third Title

Fourth Title

Fifth Title

Sixth Title

Tabulator

Just use your imagination and pretend there's `Lorem Ipsum` here.

Tabulation

Hey look, more text here.

How quaint.

Long Tab

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

This is a long tab. It contains a lot of text.

Empty Tab

Empty Tab

Empty Tab

"I have this!"

Empty Tab

something something Jill Sandwich

Empty Tab

Empty Tab

Will you use the INK RIBBON? [YES/NO]

This is a blockquote, created by putting "> " at the start of each line.
More text

---

That's a horizontal rule

Nested blockquotes

And another¹

This is a	table
You should know	how to make these
already

---

The Header font is Anton.
The Title font is Courier Prime.
The Body font is Jost.
The Monospace font used is Anonymous Pro.

---

+ Show theme code

/*
   Present Malice Theme
   [2021 Wikidot Theme]
   by JackalRelated
          greatly inspired by Resident Evil (1996)
*/
 
@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&family=Anton&family=Jost&family=Anonymous+Pro&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@600&display=swap');
 
:root {
    --theme-base: "black-highlighter";
    --theme-id: "present-malice";
    --theme-name: "Present Malice Theme";
 
    --logo-image: url("https://scp-wiki.wdfiles.com/local--files/theme:present-malice/umbrella-scp.png") !important;
    --header-title: "SCP FOUNDATION";
    --header-subtitle: "SECURE. CONTAIN. PROTECT.";
 
    --body-font: 'Jost', sans-serif;
    --header-font: 'Anton', sans-serif;
    --title-font: 'Courier Prime', sans-serif;
    --mono-font: 'Anonymous Pro', monospace;
    --UI-font: var(--body-font);
 
    /* WHITE - GREY - BLACK */
    --tyrant-white: 240, 235, 235;
    --barry-magnum: 230, 230, 230;
    --jill-grey: 198, 205, 215;
    --pecking-crow: 40, 40, 40;
    --weskers-shades: 20, 20, 20;
    --mr-x: 5, 5, 5;
 
    /* BLUE - GREEN */
    --menu-blue: 132, 134, 163;
    --light-stars-blue: 0, 13, 135;
    --medium-stars-blue: 42, 45, 102;
    --dark-stars-blue: 0, 8, 84;
    --rpd-uniform: 30, 30, 56;
    --jills-shoulderpads: 20, 20, 36;
    --chris-green: 11, 138, 0;
    --woman-drawing-water: 1, 71, 50;
 
    /* RED - BROWN */
    --chris-blood: 185, 0, 0;
    --umbrella-red: 143, 0, 0;
    --ashford-red: 84, 0, 0;
    --barry-jacket: 165, 51, 51;
    --rotten-flesh: 82, 54, 42;
    --itchy-tasty: 126, 64, 38;
    --rust-rot: 61, 31, 18;
 
    /* THEME ASSIGNMENTS */
    --white-monochrome: var(--tyrant-white);
    --pale-gray-monochrome: var(--barry-magnum);
    --light-gray-monochrome: var(--barry-magnum);
    --gray-monochrome: var(--weskers-shades);
    --dark-gray-monochrome: var(--jills-shoulderpads);
    --black-monochrome: var(--weskers-shades);
    --pale-accent: var(--barry-jacket);
    --bright-accent: var(--chris-blood);
    --medium-accent: var(--umbrella-red);
    --dark-accent: var(--ashford-red);
 
    --swatch-topmenu-bg-color: var(--weskers-shades);
    --swatch-topmenu-border-color: var(--weskers-shades);
 
    --swatch-background: var(--jill-grey);
    --swatch-border-color: var(--weskers-shades);
 
    --swatch-text-dark: var(--mr-x);
    --swatch-text-light: var(--barry-magnum);
    --swatch-text-general: var(--swatch-text-dark);
    --swatch-important-text: var(--bright-accent);
 
    --swatch-menubg-color: var(--tyrant-white);
    --swatch-menubg-light-color: var(--menu-blue);
    --swatch-menubg-medium-color: var(--rpd-uniform);
    --swatch-menubg-medium-dark-color: var(--jills-shoulderpads);
    --swatch-menubg-dark-color: var(--jills-shoulderpads);
 
    --swatch-menutxt-dark-color: var(--mr-x);
    --swatch-menutxt-light-color: var(--barry-magnum);
 
    --swatch-secondary-color: var(--jills-shoulderpads);
 
    --swatch-text-secondary-color: var(--tyrant-white);
    --swatch-text-tertiary-color: var(--barry-magnum);
 
    --header-gradient-color-top: var(--weskers-shades);
    --header-gradient-color-middle: var(--weskers-shades);
    --header-gradient-color-bottom: var(--weskers-shades);
    --background-gradient-distance: 0rem;
    --diagonal-stripes: linear-gradient(transparent 0);
 
    --sidebar-transition-timing: 0.8s ease-in-out 0.1s;
 
    --hover-link-color: var(--chris-blood);
    --link-color: var(--umbrella-red);
    --newpage-color: var(--chris-blood);
    --visited-link-color: var(--ashford-red);
 
    --ui-wght: 200;
    --ui-hvr-wght: 200;
 
    --toggle-button-bg: rgb(var(--weskers-shades));
    --toggle-border-color: rgb(var(--umbrella-red));
    --toggle-icon-color: rgb(var(--tyrant-white));
    --toggle-roundness: 0%;
}
 
/* HEADER AND TOPBAR */
 
#header {
    --swatch-headerh1-color: var(--chris-blood);
    --swatch-headerh2-color: var(--tyrant-white);
 
    --search-icon-color: var(--barry-magnum);
    --search-icon-hover-color: var(--tyrant-white);
    --search-icon-hover-bg-color: var(--umbrella-red);
    --search-textbox-text-color: 0, 0, 0, 0;
 
    --search-icon-focus-color: var(--tyrant-white);
    --search-icon-focus-bg-color: var(--umbrella-red);
    --search-focus-outline-color: var(--chris-blood);
    --search-focus-textbox-bg-color: var(--medium-stars-blue);
    --search-focus-textbox-text-color: var(--barry-magnum);
 
    --login-line-divider-color: var(--chris-blood);
    --login-username-color: var(--chris-blood);
    --login-myaccount-color: var(--barry-magnum);
    --login-myaccount-underline-color: var(--umbrella-red);
    --login-myaccount-hover-bg-color: var(--mr-x);
    --login-arrow-color: var(--barry-magnum);
 
    --login-dropdown-bg-color: var(--jills-shoulderpads);
    --login-dropdown-bg-image: var(--jills-shoulderpads);
    --login-dropdown-border-color: var(--mr-x);
    --login-dropdown-text-color: var(--barry-magnum);
    --login-dropdown-text-hover-color: var(--tyrant-white);
    --login-dropdown-bg-hover-color: var(--chris-blood);
 
    --login-mobile-icon-color: var(--barry-magnum);
    --login-mobile-icon-hover-color: var(--tyrant-white);
    --login-mobile-icon-hover-bg-color: var(--chris-blood);
}
 
#header h1 a,
#header h1 a:before {
    --wght: 200;
    font-weight: 200;
}
 
#header h2 span::before {
    margin-left: -0.2rem;
}
 
@media only screen and (max-width: 320px) {
    #header h2 span::before {
        margin-left: -0.4rem;
    }
}
 
@media only screen and (max-width: 375px) {
    #header h2 span::before {
        margin-left: -0.7rem;
    }
}
 
#top-bar {
    --topmenu-category-color: var(--barry-magnum);
    --topmenu-category-hover-color: var(--tyrant-white);
    --topmenu-category-hover-bg: var(--jills-shoulderpads);
    --topmenu-hover-border-color: var(--umbrella-red);
 
    --mobile-topmenu-sidebar-button-color: var(--barry-magnum);
 
    --dropdown-bg-color: var(--rpd-uniform), 0.9;
    --dropdown-border-color: var(--jills-shoulderpads), 0.5;
    --dropdown-links-color: var(--barry-magnum);
    --dropdown-links-hover-color: var(--tyrant-white);
    --dropdown-links-hover-bg-color: var(--umbrella-red);
}
 
/* BREADCRUMBS */
 
#breadcrumbs a:hover,
.pseudocrumbs a:hover,
#breadcrumbs a:active,
.pseudocrumbs a:active {
    color: rgb(var(--chris-blood));
    text-decoration: none;
}
 
#breadcrumbs a:focus-within,
.pseudocrumbs a:focus-within {
    color: rgb(var(--umbrella-red));
    text-decoration: none;
}
 
/* SCROLLBAR AND SIDEBAR */
 
html,
body {
    scrollbar-color:
        rgb(var(--weskers-shades)) rgb(var(--umbrella-red));
}
 
html::-webkit-scrollbar,
body::-webkit-scrollbar {
    width: 18px;
    background: #transparent;
}
 
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
    background: rgb(var(--weskers-shades));
}
 
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
    background: rgb(var(--umbrella-red));
    border: rgb(var(--umbrella-red)) 1px solid;
    border-radius: 0px;
}
 
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
    background: rgb(var(--chris-blood));
}
 
#side-bar,
#interwiki {
    --sidebar-bg-color: var(--jills-shoulderpads);
    --sidebar-resources-bg-color: var(--ashford-red);
    --sidebar-media-bg-color: var(--ashford-red);
 
    --sideblock-heading-bg-color: var(--umbrella-red);
    --sideblock-heading-border-color: var(--chris-blood);
    --sideblock-heading-text-color: var(--tyrant-white);
 
    --sidebar-border-color: var(--rpd-uniform);
    --sidebar-subtest-color: var(--umbrella-red);
 
    --sidebar-links-text: var(--barry-magnum);
    --sidebar-links-hover-bg-color: var(--chris-blood);
    --sidebar-links-hover-text-color: var(--tyrant-white);
}
 
hr {
    background-color: rgb(var(--dark-stars-blue));
}
 
.code {
    background-color: rgb(var(--barry-magnum));
}
 
.scp-image-block .scp-image-caption {
    border-top: .0625rem outset rgba(var(--umbrella-red), 1);
    background-color: rgb(var(--barry-magnum)) !important;
    color: var(--mr-x);
}
 
.scp-image-block {
    box-shadow: none;
    border: none;
}
 
/* MAIN CONTENT */
 
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
    -webkit-filter: hue-rotate(0deg);
            filter: hue-rotate(0deg);
}
 
.page-rate-widget-box .rate-points {
    border: none !important;
    background-color: rgba(0, 0, 0, 0) !important;
}
 
#main-content {
    --tabs-bg: var(--jills-shoulderpads);
    --tabs-txt: var(--barry-magnum);
    --tabs-hover-bg: var(--light-stars-blue);
    --tabs-hover-txt: var(--tyrant-white);
    --tabs-selected-bg: var(--chris-blood);
    --tabs-selected-txt: var(--tyrant-white);
    --tabs-selected-outline: var(--chris-blood);
    --tabs-bottom-border-color: var(--light-stars-blue);
    --tabs-content-bg-color: var(--tyrant-white);
    --tabs-content-border-color: var(--jills-shoulderpads);
 
    --tables-header-bg: var(--chris-green);
    --tables-header-txt: var(--weskers-shades);
    --tables-border: var(--woman-drawing-water);
    --tables-body-bg: var(--rpd-uniform), 0.25;
 
    --toc-header-bg-color: var(--umbrella-red);
    --toc-header-text-color: var(--barry-magnum);
    --toc-header-text-hover-color: var(--tyrant-white);
    --toc-body-bg-color: var(--rpd-uniform);
    --toc-body-link-color: var(--barry-magnum);
 
    --ui-icon-color: var(--barry-magnum);
    --ui-icon-bg: var(--jills-shoulderpads);
    --ui-icon-hover-color: var(--tyrant-white);
    --ui-icon-hover-bg: var(--chris-blood);
 
    --editor-icon-hover-color: var(--tyrant-white);
 
    --blockquote-bg-color: var(--tyrant-white), 0.35;
    --blockquote-border-color: var(--rust-rot);
    --blockquote-colorbar-color: var(--itchy-tasty);
 
    --footnotes-footer-bg-color: var(--menu-blue);
    --footnotes-footer-colorbar-color: var(--umbrella-red);
    --footnotes-footer-title-bg-color: var(--umbrella-red);
    --footnotes-footer-title-text-color: var(--barry-magnum);
 
    --pagetags-title-bg: var(--weskers-shades);
    --pagetags-title-text: var(--barry-magnum);
    --pagetags-text-color: var(--mr-x);
    --pagetags-text-hover-color: var(--tyrant-white);
    --pagetags-text-hover-bg-color: var(--chris-blood);
}
 
.blockquote hr,
div.blockquote hr {
    background-color: rgb(var(--rotten-flesh));
}
 
table.wiki-content-table th {
    font-family: var(--title-font);
}
 
:root {
    --hoverblock-header-bg: var(--chris-blood);
    --hoverblock-header-txt: var(--tyrant-white);
    --hoverblock-footer-txt: var(--barry-magnum);
 
    --ui-button-hover-bg: var(--chris-blood);
    --ui-button-hover-txt: var(--tyrant-white);
 
    --modal-body-header-text: var(--barry-magnum);
    --modal-body-text: var(--barry-magnum);
 
    --rating-module-button-plus-color: var(--chris-green);
    --rating-module-button-negative-color: var(--chris-blood);
    --rating-module-button-cancel-color: var(--itchy-tasty);
    --rating-module-button-credit-color: var(--tyrant-white);
    --rating-module-bg-color: var(--pecking-crow);
    --rating-module-text-color: var(--barry-magnum);
    --rating-module-text-hover-color: var(--tyrant-white);
}
 
/* FOOTERS AND BELOW */
 
.page-source {
    background: rgb(var(--tyrant-white));
    font-family: var(--mono-font);
}
 
#lock-info,
div.note,
input.checkbox,
input.text,
textarea {
    font-family: var(--body-font);
}
 
form#edit-page-form #edit-page-textarea {
    background-color: rgb(var(--barry-magnum));
}
 
#footer {
    --footer-bg-color: var(--jills-shoulderpads);
    --footer-text-color: var(--barry-magnum);
    --footer-link-color: var(--barry-magnum);
    --footer-link-hover-color: var(--tyrant-white);
    --footer-link-hover-bg-color: var(--chris-blood);
}
 
#license-area {
    --license-bg-color: var(--weskers-shades);
    --license-text-color: var(--barry-magnum);
    --license-link-color: var(--barry-magnum);
    --license-link-hover-color: var(--tyrant-white);
    --license-link-hover-bg-color: var(--chris-blood);
}
 
/* TOGGLE SIDEBAR (BHL) CHANGES */
 
@supports(display: grid) {
    @media only screen and (min-width: 769px) {
        #main-content::before {
            background: rgba(var(--dark-stars-blue), .45) 1px 1px repeat;
        }
    }
}
 
html,
body {
    scrollbar-color:
        rgb(var(--umbrella-red)) rgb(var(--weskers-shades));
    border-color: rgba(var(--umbrella-red), 1);
}
 
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
    background-color: rgb(var(--weskers-shades));
}
 
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
    background-color: rgb(var(--umbrella-red));
}
 
html::-webkit-scrollbar-thumb:hover,
body::-webkit-scrollbar-thumb:hover {
    background-color: rgb(var(--chris-blood));
}

Footnotes

1. And here's a footnote!