Link to article: SCP-8000 Contest Hub.
/* Phantasmagoria Theme */
/* by syuzhet */
/*
Beware! The code you are about to see was cruft by wicked hands...
There is nothing here for you but sorrow, member of the tech team.
Turn back now!
*/
:root {
--basalt-secondary-color: 0, 0, 0;
--basalt-overtone: 73, 90, 211;
--basalt-undertone: 73, 90, 211;
--basalt-bright-element-color: 73, 90, 211;
--basalt-dark-element-color: 73, 90, 211;
--link-color: 59, 199, 251;
--link-visited-color: 59, 199, 251;
--top-bar-link-color-hover: 255, 255, 255;
--login-status-text-color-hover: 255, 255, 255;
--side-bar-link-color-hover: 255, 255, 255;
--side-bar-link-background-hover: 73, 90, 211;
--header-border-width: 0rem;
--title-size: 1.25rem;
--subtitle-size: 0rem;
--side-bar-button-height: 50vh;
--user-button-width: 2rem;
--header-logo-size: 67.5%;
--basalt-UI-dark-palette: 0, 0, 0;
--top-bar-link-background-hover: 73, 90, 211;
}
#header h1 a::before {
display: none;
}
#header h1 a span::after {
margin-bottom: 0;
}
#container #header {
background: none;
position: absolute;
box-shadow: unset;
backdrop-filter: none;
}
div #container-wrap {
background-color: #2D455E;
background: url(https://scp-wiki.wdfiles.com/local--files/scp8000contesthub/bg.jpg);
background-attachment: fixed;
background-size: cover;
}
#main-content {
margin-top: 0;
}
#page-content {
padding-top: 0;
}
#page-content > p:nth-child(-n+4) {
display: none;
}
.widebox div {
position: relative;
top: 70%;
}
.widebox img {
display: block;
margin: auto;
width: 35%;
}
.widebox #u-logotop {
font-size: 2rem;
}
.widebox {
position: relative;
left: calc(-50dvw + 50%);
width: 100dvw !important;
height: calc(100dvh);
max-width: 100dvw !important;
background-image: url(https://scp-wiki.wdfiles.com/local--files/scp8000contesthub/banner.jpg);
background-repeat: no-repeat;
background-size: cover;
background-position: top;
}
.widebox:before {
/*content: "";*/
position: absolute;
left: calc(-50dvw + 50%);
width: 100dvw !important;
height: calc(100dvh);
max-width: 100dvw !important;
background-image: linear-gradient(180deg, transparent 0%, transparent 80vh, rgb(13,13,15) 100vh, transparent 100%);
background-repeat: no-repeat;
background-size: cover;
background-position: center;
pointer-events: none;
}
.widebox .bannerseparator {
position: absolute;
z-index: 0;
left: calc(-50dvw + 50%);
width: 100%;
height: calc(100dvh);
max-width: 100dvw !important;
top: 85dvh;
}
.widebox .bannerseparator img {
width: 100%;
}
hr {
border: none;
height: 2px;
background-image: linear-gradient(to right, #494ED0, #45CEEE, #494ED0);
margin: 25px;
}
hr::after {
content: '∞';
display: inline-block;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
transform-origin: 50% 50%;
padding: 0.2rem 1rem;
background-color: #05111A;
color: #45CEEE;
}
.darkdocument {
outline: 3px solid #494ED0;
outline-offset: -10px;
padding: 50px !important;
background-color: #050F18;
background: url(https://scp-wiki.wdfiles.com/local--files/scp8000contesthub/8kon_darkdoc_bg.jpg);
}
.darkdocument h1 {
font-size: 28px;
font-weight: bold;
color: #fff;
margin: 1rem 5px 2rem;
--f: .5em; /* control the folded part*/
--r: .8em; /* control the ribbon shape */
position: relative;
top: 20px;
left: 5px;
margin-right: 50%;
inset-inline: -69px;
padding-inline: 1em;
line-height: 1.8;
background: #495AD3;
border-bottom: var(--f) solid #0005;
border-right: var(--r) solid #0000;
clip-path:
polygon(calc(100% - var(--r)) 0,0 0,0 calc(100% - var(--f)),var(--f) 100%,
var(--f) calc(100% - var(--f)),calc(100% - var(--r)) calc(100% - var(--f)),
100% calc(50% - var(--f)/2));
}
h1, #page-options-container, .licensebox .collapsible-block-folded a, .page-watch-options a {
color: white;
}
#action-area, .licensebox .collapsible-block-content {
background: #0D0D0F;
padding: 10px;
}
.licensebox .collapsible-block-link {
background: #0D0D0F;
padding: 10px;
}
.dragon {
position: relative;
margin: auto;
width: 50%;
}
.dragon:after {
content:"Here be dragons!";
visibility:hidden;
width: 200px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
/* Position the tooltip */
position: absolute;
z-index: 1;
top: 100%;
left: 50%;
margin-left: -100px;
}
.dragon:hover:after, .dragon:active:after {
visibility: visible;
}
/* Piece of shit sidebar */
#top-bar div.mobile-top-bar>.open-menu {
visibility:visible;
opacity: 0.6;
transition: opacity 0.2s;
}
#top-bar div.mobile-top-bar>.open-menu:hover {
opacity: 1;
}
#side-bar {
margin-top:0;
height:100%
}
#side-bar, #side-bar:is(:hover, :focus-within):not(:target) {
left:calc(var(--side-bar-width) * -1)
}
#side-bar::after, #side-bar::before {
display:none
}
#side-bar:target {
left:0;
width:var(--side-bar-width);
z-index:10
}
#side-bar a.close-menu, #side-bar:target a.close-menu {
display:block;
pointer-events:none;
position:fixed;
top:0;
right:0;
left:auto;
width:100%;
min-width:3.75rem;
height:100%;
margin-left:0;
opacity:0;
z-index:-1;
transition:width var(--side-bar-transition),opacity var(--side-bar-transition)
}
#side-bar:target a.close-menu {
width:calc(100% - var(--side-bar-width));
pointer-events:auto;
opacity:1;
}
/* Accessibility */
.aria-invisible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
pointer-events: none;
}
/* Mobile */
@media only screen and (max-width: 1020px) {
.darkdocument h1 {
margin-right: 0;
inset-inline: -40px;
}
.darkdocument {
outline: 2px solid #494ED0;
outline-offset: -10px;
padding: 20px !important;
background-color: #05111A !important;
}
#container #header {
background: black;
position: sticky;
}
.widebox div {
position: relative;
top: 60%
}
.widebox .bannerseparator {
top: 90dvh;
}
.widebox img {
width: 100%
}
.widebox #u-logotop {
font-size: 6vw;
}
}
font-weight: bold
font-weight: bold
font-weight: bold
font-weight: bold
:scp-wiki:theme:basalt
[info]
:scp-wiki:component:license-box
[info]
:scp-wiki:component:license-box-end
[info]
aria-invisible
widebox
bannerseparator
aria-invisible
darkdocument
darkdocument
dragon