#header {
background-image: url('/local--files/theme:sandbox-classic-theme/logo.png');
}
#header h1 a, #header h2 span {
color: transparent;
text-shadow: none;
}
#header h1 a::before {
content: 'SCP Sandbox';
color: rgb(238, 238, 238);
text-shadow: 3px 3px 5px #000;
}
#header h2 span::before {
content: 'Осторожно! Идут испытания!';
color: rgb(240, 240, 192);
text-shadow: 1px 1px 1px rgba(0, 0, 0, .8);
}
The SCP Archive Theme is a site theme created by Пользователь '7happy7' не существует of the JP branch. It was originally located here.
It was ported to EN by Пользователь 'aismallard' не существует, on behalf of the Technical Team.
The STAR Animation is from the 2017 JP April Fool's theme. It was created by:
- Пользователь 'Dr Devan' не существует
- Пользователь 'C-Take' не существует
- Пользователь 'Nanimono Demonai' не существует
Usage
On any wiki, simply add the following to the top of the page:
[[include theme:black-highlighter-theme]]
[[include theme:scp-archive]]
You can customize the header text by adding the following after the includes:
[[module CSS]]
:root {
--header-title: "SCP Foundation";
--header-subtitle: "Secure, Contain, Protect";
}
[[/module]]
Theme Colors
This is a theme originally created by Пользователь 'Dc_Yerko' не существует for the Spanish Translation Site and adapted by Пользователь 'stormbreath' не существует. Code for the snow flakes adapted by Пользователь 'EstrellaYoshte' не существует.
Use it on your own article with the following:
[[include theme:xmas
|xmas-header= --]
|xmas-snow= --]]]
If you only want to use the header, use the following:
[[include theme:xmas
|xmas-header= --]]]
If you only want to use the snow, use the following:
[[include theme:xmas
|xmas-snow= --]]]
Likewise, to use with Black Highlighter:
[[include theme:black-highlighter-theme]]
[[include theme:xmas
|xmas-header-bhl= --]
|xmas-snow-bhl= --]]]
[[include theme:black-highlighter-theme]]
[[include theme:xmas
|xmas-header-bhl= --]]]
[[include theme:black-highlighter-theme]]
[[include theme:xmas
|xmas-snow-bhl= --]]]
/*
Xmas Theme
[2020 Wikidot Theme]
Originally made by Dc_Yerko for the Spanish Branch
Ported to -EN by stormbreath
*/
div#container-wrap {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/GIF-111.gif');
}
#header {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/logo-xmas.png');
}
#top-bar div.open-menu a {
color: #990011;
border-color: #33552D;
}#header-extra-div-1, #header-extra-div-2, #header-extra-div-3 {
-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 50%, rgba(0,0,0,0));
mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 50%, rgba(0,0,0,0));
background-repeat: repeat;
height: 270px;
width: 99.4vw;
position: absolute;
left: calc((-100vw + 100%)/2);
z-index: 2;
pointer-events: none;
}
/* ---- SNOWFALL, adapted from https://github.com/elena-in-code/Css-Snow-Fall-Animation ---- */
#header-extra-div-1 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/sn2.png');
background-size: 230px;
animation: snowOne 83s infinite linear;
filter: blur(1.3px);
}
#header-extra-div-2 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/sn.png');
background-size: 370px;
animation: snowTwo 39s infinite linear;
filter: blur(0.4px);
}
#header-extra-div-3 {
background: url('https://scpfoundation.net/local--files/theme:xmas/sn.png');
background-size: 720px;
animation: snowThree 21s infinite linear;
filter: blur(2.4px);
}
@keyframes snowOne{
0%
{
background-position: 0px 0px;
opacity: 0;
}
10%
{
opacity: 0.6;
}
90%
{
opacity: 0.5;
}
100%
{
background-position: 100px 750px;
opacity:0;
}
}
@keyframes snowTwo{
0%
{
background-position: 0px -100px;
opacity: 0;
}
8%
{
opacity: 0.74;
}
90%
{
opacity: 0.65;
}
100%
{
background-position: -50px 700px;
opacity: 0;
}
}
@keyframes snowThree{
0%
{
background-position: 0px 100px;
opacity: 0;
}
13%
{
opacity: 0.9;
}
91%
{
opacity: 0.8;
}
100%
{
background-position: 240px 750px;
opacity: 0;
}
}:root {
--logo-image: url("https://scpfoundation.net/local--files/theme:xmas/logo-xmas-bhl.png");
}
#extra-div-1,#extra-div-2 {
height: 2rem;
width: 100%;
position: absolute;
top: calc(var(--final-header-height-on-desktop) - 0.3125rem);
background-repeat: repeat-x;
background-size: 6.2rem;
pointer-events: none;
z-index: 9;
}
#extra-div-1 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/n1.png');
animation: lightOne 3s infinite steps(1, end);
}
#extra-div-2 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/n2.png');
animation: lightTwo 3s infinite steps(1, end);
}
@media (max-width: 767px) {
#extra-div-1, #extra-div-2 {
top: calc(var(--header-height-on-mobile) + var(--topbar-height-on-mobile) - 0.3125rem);
}
}
@keyframes lightOne {
0% { opacity: 0; }
50% { opacity: 1; }
100% { opacity: 0; }
}
@keyframes lightTwo {
0% { opacity: 1; }
50% { opacity: 0; }
100% { opacity: 1; }
}#extrac-div-1, #extrac-div-2, #extrac-div-3 {
-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 50%, rgba(0,0,0,0));
mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 50%, rgba(0,0,0,0));
height: 24rem;
width: 100%;
position: absolute;
background-repeat: repeat;
z-index: 10;
pointer-events: none;
}
#extrac-div-1 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/sn2.png');
background-size: 230px;
animation: snowOne 83s infinite linear;
filter: blur(1.3px);
}
#extrac-div-2 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/sn.png');
background-size: 370px;
animation: snowTwo 39s infinite linear;
filter: blur(0.4px);
}
#extrac-div-3 {
background-image: url('https://scpfoundation.net/local--files/theme:xmas/sn.png');
background-size: 720px;
animation: snowThree 21s infinite linear;
filter: blur(2.4px);
}
@media (max-width: 767px) {
#extrac-div-1, #extrac-div-2, #extrac-div-3 {
height: 10.5rem;
}
}