Database Theme

This theme was created by CutTheBirch. To import this theme to your page, put the following text anywhere inside it:

[[include :backrooms-wiki:theme:database]]

Examples

Terminal

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

SD Classes

SURVIVAL DIFFICULTY:

Class 0

• {$one}
• {$two}
• {$three}

SURVIVAL DIFFICULTY:

Class 1

• {$one}
• {$two}
• {$three}

SURVIVAL DIFFICULTY:

Class 2

• {$one}
• {$two}
• {$three}

SURVIVAL DIFFICULTY:

Class 3

• {$one}
• {$two}
• {$three}

SURVIVAL DIFFICULTY:

Class 4

• {$one}
• {$two}
• {$three}

SURVIVAL DIFFICULTY:

Class 5

• {$one}
• {$two}
• {$three}

SURVIVAL DIFFICULTY:

Class unknown

• {$one}
• {$two}
• {$three}

Tabulator

This is a tab view.

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.

This empty tab has a really long name for some odd reason. I wonder why?

Empty Tab

Empty Tab

Empty Tab

Empty Tab

Empty Tab

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

---

That's a horizontal rule

Nested blockquotes¹

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

This is a styled blockquote.

It can hold many things.

Lightblock!

Darkblock!

You are a cat.
You are a cat.
You are a cat.
You are a cat.
You are a cat.

---

The font used for everything is VT323.

---

Theme Code

@import url(https://backrooms-wiki.wdfiles.com/local--code/component%3Apatch/1);
 
@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "Database";
   --theme-name: "Database Theme";
 
   --base-font-size: 1.175rem;
 
   --logo-image: none;
   --header-title: "The Database";
   --header-subtitle: "";
   --footer-message: "You've been here before...";
 
   --body-font: VT323, monospace;
   --header-font: VT323, monospace;
   --title-font: VT323, monospace;
   --mono-font: VT323, monospace;
 
    --text: 229, 140, 36;
    --link: 184, 86, 24;
    --back: 29, 18, 7;
 
    --white-monochrome: var(--back);
    --pale-gray-monochrome: var(--back);
    --light-gray-monochrome: var(--text);
    --gray-monochrome: var(--back);
    --dark-gray-monochrome: var(--text);
    --black-monochrome: var(--text);
    --pale-accent: var(--link);
    --bright-accent: var(--link);
    --medium-accent: var(--link);
    --dark-accent: var(--link);
    /* --alt-accent: 255, 0, 255; */
 
   --swatch-text-secondary-color: var(--text);
   --swatch-text-light: var(--text);
   --rating-module-button-plus-color: var(--text);
   --rating-module-button-negative-color: var(--text);
   --rating-module-button-cancel-color: var(--text);
   --rating-module-button-credit-color: var(--text);
 
   --cecs-accent: var(--link) !important;
   --cecs-dark: var(--text) !important;
   --cecs-light: var(--back) !important;
 
   --border-styling: solid 0.15rem rgb(var(--swatch-border-color));
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--back)) 0%,
      rgba(var(--back), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   --gradient-topmenu: linear-gradient(
      to bottom,
      hsla(0, 0%, 100%, 0) 0%,
      hsla(0, 0%, 100%, 0) var(--header-height-on-desktop),
      rgba(var(--swatch-topmenu-border-color), 1) var(--header-height-on-desktop),
      rgba(var(--swatch-topmenu-border-color), 1) calc(var(--header-height-on-desktop) + 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--header-height-on-desktop) + 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-border-color), 1) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-border-color), 1) 100%
   );
}
 
html {
   line-height: 1.175;
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--back)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#container {
   background-image: none;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
   transition: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#login-status #account-topbutton {
    border: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
::selection {
    background: rgb(var(--link));
    color: rgb(var(--back));
    text-shadow: none;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
#header h1:before, #header h2:before {
   content: "";
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
#account-topbutton {
   border: var(--border-styling);
}
 
#search-top-box-form input[type="submit"]:hover {
    background: rgb(var(--text));
    color: rgb(var(--back));
}
 
#account-options {
   background-color: rgb(var(--back));
   border: var(--border-styling);
}
 
#account-options>ul>li a:hover {
   color: rgb(var(--text));
}
 
#search-top-box input.empty:hover {
     color: rgb(var(--back));
}
 
#top-bar>ul>li a {
   color: rgb(var(--text));
}
 
#page-title {
   color: rgb(var(--link));
}
 
#page-title:before {
   content: "> ";
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li,
#top-bar div.top-bar>ul>li>ul>li {
    background-color: rgb(var(--back));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li a,
#top-bar div.top-bar>ul>li>ul>li a {
    color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li:hover,
#top-bar div.top-bar>ul>li>ul>li:hover {
    background-color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li a:hover,
#top-bar div.top-bar>ul>li>ul>li a:hover {
    color: rgb(var(--back));
}
 
h1, h2, h3, h4, h5, h6 {
   color: rgb(var(--link));
}
 
h1:before, h2:before, h3:before, h4:before, h5:before, h6:before {
    content: "> "
}
 
blockquote, .blockquote, .darkblock, .dark-styled-quote {
   padding: 0.1rem 0.7rem;
   margin: 1rem 0;
   color: rgb(var(--text));
   background: rgb(var(--back));
   border: var(--border-styling) !important;
   box-shadow: 0;
}
 
.styled-quote, .light-block {
   background-color: rgb(var(--text));
   padding: 0.1rem 0.7rem;
   margin: 1rem 0;
   color: rgb(var(--back));
   border: var(--border-styling);
}
 
.page-rate-widget-box {
   border: var(--border-styling) !important;
   background: rgb(var(--back));
}
 
.code {
   border: var(--border-styling);
}
 
.scp-image-block .scp-image-caption {
   border-top: var(--border-styling);
}
 
.scp-image-block {
   border: var(--border-styling);
}
 
hr {
   color: transparent;
   background-color: transparent;
   border: 0;
   border-bottom: var(--border-styling);
}
 
.collapsible-block-link:before {
   content: "> "
}
 
.footnotes-footer {
   border: var(--border-styling);
   border-color: rgb(var(--link));
   background-color: rgb(var(--back));
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border: var(--border-styling) !important;
   background-color: rgb(var(--back));
   color: rgb(var(--text));
   margin: 0;
   border-collapse: collapse;
   box-sizing: content-box;
}
 
#side-bar .heading p {
   color: rgb(var(--text));
}
 
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
   color: rgb(var(--text));
}
 
.printuser img.small {
    display: none;
}
 
::-webkit-scrollbar-thumb,
#side-bar:hover::-webkit-scrollbar-thumb {
   background-color: rgb(var(--text)) !important;
}
 
::-webkit-scrollbar-track,
#side-bar:hover::-webkit-scrollbar-track {
   background: rgb(var(--back)) !important;
}
 
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
   transition: none;
}
 
#top-bar div.mobile-top-bar>ul>li,
#top-bar div.top-bar>ul>li {
   transition: none;
}
 
#top-bar div.mobile-top-bar>ul>li>a:after,
#top-bar div.mobile-top-bar>ul>li>a:before,
#top-bar div.top-bar>ul>li>a:after,
#top-bar div.top-bar>ul>li>a:before,
#top-bar>ul>li {
   transition: none;
}
 
#top-bar>ul>li>:after,
#top-bar>ul>li>:before {
   display: none;
}
 
#top-bar li ul {
   transition: none;
}
 
.yui-navset * {
   transition: none;
}
 
#side-bar {
   background-color: rgb(var(--back));
}
 
#main-content::before {
   display: none;
}
 
span.printuser a:first-of-type:not(:last-of-type) {
    aspect-ratio: unset; 
}
 
@media only screen and (max-width: 440px) {
    .top-box .top-text p {
        font: 2.35rem VT323 !important;
    }
 
    .bottom-box ul li {
        line-height: 1.5rem !important;
    }
}
 
#page-content a { transition: 0; }
#page-content a:hover { 
   text-decoration: none; 
   color: rgb(var(--back)); 
   background: rgb(var(--link)); 
}
 
.yui-navset .yui-nav .selected {
    --tabs-selected-bg: var(--text);
}
 
#main-content::after {
    display: none;
}
 
#footer { --swatch-text-secondary-color: var(--back); --footer-link-color: var(--back); --footer-text-color: var(--back); --footer-link-hover-color: var(--text); }
#license-area { --license-link-color: var(--back); --license-text-color: var(--back); --license-link-hover-color: var(--text); }
 
.lightblock {
   background: rgb(var(--text));
   color: rgb(var(--back));
   box-shadow: 0;
}
 
/* License Box */
#page-content .licensebox .collapsible-block-link {
    margin-left: .25em;
    padding: .25em;
    font-weight: 700;
    opacity: .5;
    color: rgb(var(--text));
    -webkit-transition: opacity .5s ease-in-out;
    -moz-transition: opacity .5s ease-in-out;
    transition: opacity .5s ease-in-out;
}
 
#page-content .licensebox .collapsible-block-link:hover {
     color: rgb(var(--link));
}
 
/* Rater with Info */
#page-content div.rate-box-with-credit-button {
    border: 2px solid rgb(var(--text));
    border-bottom-width: 2px;
}
 
#page-content div.rate-box-with-credit-button div.page-rate-widget-box {
    border-width: 0 !important;
}
 
/* ==SD CLASS CODE== */ 
 
.top-box .bottom-text p, .top-box .bottom-text:after, .top-box .top-text p {
   color: rgb(var(--text)) !important;
}
 
.top-box, .diamond-color {
    background: rgb(var(--back)) !important;
}
 
.top-box {
   border: var(--border-styling) !important;
}
 
.top-box .top-text p {
    font: 2.9rem VT323 !important;
}
 
.top-box .bottom-text p, .top-box .bottom-text:after {
   font: 2rem VT323 !important;
}
 
.top-box .gradient-box, .top-box:before {
    background: none !important;
}
 
.header-diamond {
    background-image: none !important;
}
 
.header-diamond .diamond-pattern, .diamond-color {
   background: rgb(var(--back)) !important;
   border: var(--border-styling) !important;
     mask: none !important;
     -webkit-mask: none !important;
     transform: rotate(45deg) translate(3.1rem, -0.46rem);
   width: 11.5rem !important;
    height: 11.5rem !important;
}
 
.bottom-box ul li {
    font: 2rem VT323 !important;
    color: rgb(var(--text)) !important;
    line-height: 1rem !important;
}
 
.bottom-box ul li:before {
    background: rgb(var(--back)) !important;
    height: 0.75rem !important;
    width: 0.75rem !important;
    border: var(--border-styling);
}
 
.top-box.class-unknown .header-diamond {
   filter: none !important;
}
 
.top-box.class-0 .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-0.png") center/78% no-repeat !important; 
}
 
.top-box.class-1 .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-1.png") center/78% no-repeat !important; 
}
 
.top-box.class-2 .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-2.png") center/78% no-repeat !important; 
}
 
.top-box.class-3 .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-3.png") center/78% no-repeat !important; 
}
 
.top-box.class-4 .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-4.png") center/78% no-repeat !important; 
}
 
.top-box.class-5 .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-5.png") center/78% no-repeat !important; 
}
 
.top-box.class-unknown .header-diamond .diamond-image,
.top-box.class-pending .header-diamond .diamond-image { 
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-unknown.png") center/78% no-repeat !important; 
}

Footnotes

1. And here's a footnote!