Midnight Rush Theme

• 

  close

  Info

  ---

  X

  Info about your page.

  ---

---

Theme Colors

Penumbra Purple--penumbra-purple(75, 57, 123)

Deepwell--deepwell(43, 43, 43)

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

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

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

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

Subdirective Silver--subdirective-silver(204, 204, 204)

Liberation Lilac--liberation-lilac(145, 121, 231)

{$subcolor3-name}{$subcolor3-variable}{$subcolor3-info}

{$subcolor4-name}{$subcolor4-variable}{$subcolor4-info}

{$subcolor5-name}{$subcolor5-variable}{$subcolor5-info}

{$subcolor6-name}{$subcolor6-variable}{$subcolor6-info}

{$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}

---

This is a Black Highlighter theme based on the Sigma-9 Night Rush theme by Nagiros, with customized visuals for the ACS, Info Bar, Toggle Sidebar, and BetterFootnotes components.

You will need to import the Black Highlighter theme in order to use this theme. To learn more go here.

On any wiki:

[[include :scp-wiki:theme:black-highlighter-theme]]
[[include :scp-wiki:theme:midnight-rush]]

Examples

A horizontal rule can be created with 4 hyphens "----" and extends across the whole page if it's not placed inside anything (e.g. 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.

• Visited link
• Unvisited link
• Missing link

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

Empty Tab

Empty Tab

Empty Tab

This is a blockquote, created by putting "> " at the start of each line, or use [[div class="blockquote"]].
More text

---

That's a horizontal rule

Nested blockquotes

And another¹

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

[[div class="xtra-div-1"]]

[[div class="xtra-div-2"]]

[[div class="xtra-div-3"]]

[[div class="xtra-div-4"]]

[[div class="document"]]

---

Source Code

+ Show source code

/*
Midnight Rush Theme
[2023 Wikidot Theme]
By MontagueETC
Based on Night Rush by Nagiros
*/
 
:root {
 
    --theme-base: "black-highlighter";
    --theme-id: "midnight-rush";
    --theme-name: "Midnight Rush";
 
    /* Color Palette */
 
     --penumbra-purple: 75, 57, 123;
     --liberation-lilac: 145, 121, 231;
     --subdirective-silver: 204, 204, 204;
     --deepwell: 43, 43, 43;
 
     --medium-accent: var(--penumbra-purple);
     --cutColour: #fafafa;
     --barColour: var(--penumbra-purple);
     --toggle-border-color: rgb(var(--penumbra-purple));
     --toggle-icon-color: rgb(var(--penumbra-purple));
     --dark-accent: var(--penumbra-purple);
     --bright-accent: var(--penumbra-purple);
 
    --logo-image: url("https://scptestwiki.wdfiles.com/local--files/theme%3Amidnight-rush/midnight-rush-icon.png");
 
     --link-color: var(--liberation-lilac);
     --visited-link-color: 204, 156, 255;
     --hover-link-color: 204, 156, 255;
 
    --swatch-text-general: var(--subdirective-silver);
 
    --swatch-background: 26, 26, 26;
    --background-gradient-color: 26, 26, 26;
 
    --rating-module-bg-color: var(--deepwell);
    --rating-module-text-color: var(--subdirective-silver);
    --rating-module-text-hover-color: var(--deepwell);
 
    --swatch-menubg-medium-color: var(--penumbra-purple);
    --swatch-menubg-light-color: var(--deepwell);
    --swatch-menutxt-general-color: var(--subdirective-silver);
    --swatch-menutxt-light-color: var(--subdirective-silver);
    --swatch-menutxt-dark-color: var(--subdirective-silver);
 
    --ui-button-txt: var(--subdirective-silver);
    --ui-button-hover-txt: var(--subdirective-silver);
 
    --document-background-color: var(--deepwell);
 
/* Toggle Sidebar BHL */
 
    --toggle-roundness: 0%;
 
/* BetterFootnotes */
 
    --fnColor: rgb(var(--liberation-lilac));
 
}
 
.fncon {
    background: rgb(var(--deepwell));
    border: .125rem solid rgb(var(--liberation-lilac));
}
 
#main-content {
    --tabs-bg: var(--deepwell);
    --tabs-txt: var(--subdirective-silver);
    --tabs-content-bg-color: var(--deepwell);
    --tabs-content-border-color: rgba(0, 0, 0, 0);
    --blockquote-bg-color: var(--deepwell);
    --blockquote-border-color: var(--subdirective-silver);
    --tables-header-bg: 64, 64, 64;
    --tables-border: 107, 107, 107;
}   
 
#side-bar {
    --sideblock-heading-text-color: 166, 147, 236;
    --sideblock-heading-border-color: 166, 147, 236;
    --sidebar-bg-color: 18, 18, 18;
    --sidebar-links-text: var(--liberation-lilac);
}
 
#top-bar {
    --topmenu-hover-border-color: var(--liberation-lilac);
    --dropdown-border-color: var(--liberation-lilac);
}
 
hr {
    background-color: rgb(var(--subdirective-silver));
}
 
::selection {
  background: rgb(var(--penumbra-purple));
}
 
:is(div.image-block, div.scp-image-block) {
 
    :is(.image-caption, .scp-image-caption) {
 
        background-color: rgb(var(--deepwell));
}
}
 
:is(.footnotes-footer, .bibitems) {
        background-color: rgb(var(--deepwell));
}
 
.info-container{
--barColour: rgb(var(--penumbra-purple));
}
 
/* DIVs */
 
.xtra-div-1 {
    border-top:solid 5px rgb(var(--penumbra-purple));
    border-bottom:solid 5px rgb(var(--penumbra-purple));
    background: rgb(var(--deepwell));
    width: 85%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px 10px 20px;
    word-break: break-word;
}
 
.xtra-div-2 {
    border-left:solid 5px rgb(var(--penumbra-purple));
    border-right:solid 5px rgb(var(--penumbra-purple));
    background: rgb(var(--deepwell));
    width:90%;
    padding:1px 15px;
    margin: 10px auto;
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
}
 
.xtra-div-3 {
    border:solid 4px rgb(var(--penumbra-purple));
    background: rgb(var(--deepwell));
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding: 20px 20px 20px 20px;
    word-break: break-word;
}
 
.xtra-div-4 {
    border:solid 1px rgb(var(--subdirective-silver));
    background: rgb(var(--deepwell));
    width: 65%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px 20px 20px;
    word-break: break-word;
}
 
#page-content div:is(.document) {
    max-width: 45rem;
}
 
div:is(.document) {
    display: block;
    margin-inline: auto;
    margin-block: 1.5em;
    padding: 1.5rem;
    position: relative;
    --posX: -20vw;
}
 
div.document {
    background-color: rgb(var(--document-background-color));
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 10, 0.8), 0px 6px 15px -4px rgba(0, 0, 7, 0.9);
}
 
div:is(.document)::before,
div:is(.document)::after {
    content: "";
    height: 98%;
    position: absolute;
    width: 98%;
    z-index: -1;
}
 
div:is(.document)::before {
    left: -5px;
    top: 4px;
    transform: rotate(-2.5deg);
}
 
div:is(.document)::after {
    right: -3px;
    top: 1px;
    transform: rotate(1.4deg);
}
 
div:is(.document)::before,
div:is(.document)::after {
    background-color: rgb(var(--document-background-color));
    opacity: 90%;
}
 
div.document::before {
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 10, 0.8), 0px 6px 15px -4px rgba(0, 0, 7, 0.9);
}
 
div.document::after {
    box-shadow: 0px 1px 1.9px -4px rgba(0, 0, 10, 0.8), 0px 6px 15px -4px rgba(0, 0, 7, 0.05);
}
 
@media only screen and (max-width: 1020px) {
 
    div:is(.document)::before,
    div:is(.document)::after {
     display: none;
    }
}
 
/*  ACS COLORS  */
 
div.anom-bar-container {
  --five-color: 196, 67, 67;   /*  red  */
  --four-color: 255, 141, 54;   /*  orange  */
  --three-color: 255, 226, 82;   /*  yellow  */
  --two-color: 40, 135, 189;   /*  blue  */
  --one-color: 40, 159, 107;   /*  green  */
 
  --white-bar: 207, 207, 207;
  --lg-bar: 118, 118, 130;
  --gray-bg: 66, 66, 72;
}
 
div.anom-bar-container .anom-bar > .bottom-box {   /*  horizontal bar  */
  box-shadow: 0 -0.5rem 0 0 rgb(207, 207, 207);
  -webkit-box-shadow: 0 -0.5rem 0 0 rgb(207, 207, 207);
  -moz-box-shadow: 0 -0.5rem 0 0 rgb(207, 207, 207);
  box-shadow: 0 -0.5rem 0 0 rgb(var(--white-bar, 207, 207, 207));
  -webkit-box-shadow: 0 -0.5rem 0 0 rgb(var(--white-bar, 207, 207, 207));
  -moz-box-shadow: 0 -0.5rem 0 0 rgb(var(--white-bar, 207, 207, 207));
}
div.anom-bar-container .bottom-box > .diamond-part {   /*  vertical bar  */
  box-shadow: -0.5rem 0 0 0 rgb(207, 207, 207);
  -webkit-box-shadow: -0.5rem 0 0 0 rgb(207, 207, 207);
  -moz-box-shadow: -0.5rem 0 0 0 rgb(207, 207, 207);
  box-shadow: -0.5rem 0 0 0 rgb(var(--white-bar, 207, 207, 207));
  -webkit-box-shadow: -0.5rem 0 0 0 rgb(var(--white-bar, 207, 207, 207));
  -moz-box-shadow: -0.5rem 0 0 0 rgb(var(--white-bar, 207, 207, 207));
}
div.anom-bar-container.esoteric .text-part .main-class,
div.anom-bar-container.explained .text-part .main-class,
div.anom-bar-container.neutralized .text-part .main-class,
div.anom-bar-container.pending .text-part .main-class {
  background-color: rgba(66, 66, 72, .5);
  background-color: rgba(var(--gray-bg, 66, 66, 72), .5);
  border-left-color: rgb(118, 118, 130);
  border-left-color: rgb(var(--lg-bar, 118, 118, 130));
}
div.anom-bar-container .danger-diamond > .arrows,
div.anom-bar-container .danger-diamond > .bottom-icon::before {   /*  inverted arrows, esoteric icons  */
  filter: invert(90%);
  -webkit-filter: invert(90%);
}
div.anom-bar-container .danger-diamond > .quadrants > .bottom-quad,
div.anom-bar-container.explained .danger-diamond > .quadrants > .top-quad,
div.anom-bar-container.neutralized .danger-diamond > .quadrants > .top-quad,
div.anom-bar-container.pending .danger-diamond > .quadrants > .top-quad {   /*  "transparent" bottoms/top icon backgrounds  */
  background-color: rgb(26, 26, 26);   /*  body background color  */
}
div.anom-bar-container .danger-diamond > .bottom-icon,
div.anom-bar-container.pending .danger-diamond > .top-icon::before {   /*  esoteric, pending icon backgrounds  */
  background-color: rgb(3, 3, 3);
}
 
div.anom-bar-container .acs-hybrid-text-bar > .acs-clear > .clearance-level-text::before,
div.anom-bar-container .acs-hybrid-text-bar > .acs-disrupt .disruption-class-number::before,
div.anom-bar-container .acs-hybrid-text-bar > .acs-risk .risk-class-number::before {   /*  hybrid text fixes  */
  color: rgb(237, 237, 237);   /*  text color  */
}
div.anom-bar-container .acs-hybrid-version.acs-yes .acs-secondary,
div.anom-bar-container .acs-hybrid-version.acs-esoteric .acs-contain,
div.anom-bar-container .acs-hybrid-version.acs-explained .acs-contain,
div.anom-bar-container .acs-hybrid-version.acs-neutralized .acs-contain,
div.anom-bar-container .acs-hybrid-version.acs-pending .acs-contain {   /*  hybrid vertical bars  */
  box-shadow: inset 0.5rem 0 0 0 rgb(118, 118, 130);
  -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(118, 118, 130);
  -moz-box-shadow: inset 0.5rem 0 0 0 rgb(118, 118, 130);
  box-shadow: inset 0.5rem 0 0 0 rgb(var(--lg-bar, 118, 118, 130));
  -webkit-box-shadow: inset 0.5rem 0 0 0 rgb(var(--lg-bar, 118, 118, 130));
  -moz-box-shadow: inset 0.5rem 0 0 0 rgb(var(--lg-bar, 118, 118, 130));
}
div.anom-bar-container .acs-hybrid-version.acs-pending .acs-contain {
  background-color: rgba(66, 66, 72, .5);
  background-color: rgba(var(--gray-bg, 66, 66, 72), .5);
}
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
 
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% - 0.125rem);
    margin: 0 auto;
    box-shadow: 0 calc(0.0625rem * 5) 0 0 rgb(var(--bright-accent));
}
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    display: flex;
    position: relative;
    max-width: 100%;
    margin: 0 0.25em 0.5em;
    padding: 0;
    transition: all 300ms cubic-bezier(0.4, 0.0, 0.2, 1);
    box-shadow: 0 0 0 0.0625rem rgba(var(--dark-accent), 0.5);
    color: rgb(var(--bright-accent));
    font-weight: bold;
}
 
.yui-navset .yui-nav li a,
.yui-navset .yui-navset-top .yui-nav li a {
    zoom: unset;
    border: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    zoom: unset;
    vertical-align: bottom;
}
 
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:active {
    font-weight: bold;
}
 
.yui-navset .yui-nav a:focus-within {
    color: rgb(var(--dark-accent));
    font-weight: bold;
}
 
.yui-navset .yui-nav a em,
.yui-navset .yui-navset-top .yui-nav a em {
    padding: 0.35em 0.75em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
 
.yui-navset .yui-nav li em {
    /* Undoes border set by wikidot's default layout */
    border: unset;
}
 
/* Selected Tab */
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected,
.yui-navset .yui-nav .selected:hover,
.yui-navset .yui-navset-top .yui-nav .selected:hover {
    flex-grow: 2;
    margin: -0.25em 0 0.25em 0;
    padding: 0;
}
 
.yui-navset .yui-nav .selected a {
    width: 100%;
    /* Undoes a color set by wikidot's default layout */
    color: rgb(var(--white-monochrome));
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
    margin-bottom: -0.125rem;
    background-image: none;
    font-weight: bold;
    cursor: default;
}

Footnotes

1. And here's a footnote!