What Is This?
This is the Parawatch Anon Theme, by Пользователь 'Lt Flops' не существует.
It is a variant version of the Creepypasta Theme, created by Пользователь 'The Great Hippo' не существует.
How to Use
To use this theme, please copy this syntax onto the top of your page:
[[include :scp-wiki:theme:creepypasta]]
[[include :scp-wiki:theme:anon]]
What is this theme used for?
This theme provides a different colour scheme for the Parawatch Wiki forum structure. The title comes from the word "anon" meaning "soon; shortly" (though, I wouldn't fault you for mistaking it as an abbreviation of "Anonymous").
It is suitable for use in Parawatch articles.
[OPTIONAL]
If, for some reason, you wish to continue using the pastel yellow from the Creepypasta Theme, copy this onto your page under the above code:
[[module CSS]]
div#header h1{
background: url(http://scp-wiki.wdfiles.com/local--files/theme%3Aanon/parawatch-anon.png) no-repeat;
}
:root{
--fg-accent-light: hsl(60, 100%, 90%);
--fg-accent: hsl(60, 100%, 80%);
--fg-accent-dark: hsl(60, 100%, 75%);
}
[[/module]]
You could technically replace these variables with any colour. Because this code uses HSL colour values over the traditional Hexadecimal or RGB, simply change the hue — but please, keep the saturation and lightness the same.
Personally, this goes against my vision for the theme. But, the option was requested, and so I thought I would make it clearly available.
L1 Heading
L2 Heading
L3 Heading
L4 Heading
L5 Heading
L6 Heading
bold | italic | underline | strikethrough | teletype
| superscriptsubscript
Type 4 hyphens ("----") to create a horizontal rule:
Block Quote
Nested Block Quote
This is a | table |
---|
You should know | how to make these |
already |
fake code selector{
fake code property: fake code value;
}
A link (A link you probably visited)
Something inside the collapsible
- numbered list
- list item
- list item
- bulleted list
- list item
- list item
[[/=]]
[[module CSS]]
/* Parawatch "Anon" Theme
* [2021 Wikidot Theme]
* Created by Lt Flops
* Based on "Creepypasta Theme" by The Great Hippo and 4chan theme "Tomorrow"
**/
/* ---- COLOURS ---- */
:root{
--bg-light: hsl(0, 0%, 7%);
--bg: hsl(210, 6%, 12%);
--bg-dark: hsl(220, 7%, 17%);
--bg-light-2: hsl(0, 0%, 11%);
--fg-light: hsl(140, 3%, 83%);
--fg: hsl(140, 3%, 78%);
--fg-dark: hsl(207, 100%, 73%);
--fg-dark-2: hsl(207, 100%, 56%);
--fg-accent-light: hsl(207, 50%, 36.5%);
--fg-accent: hsl(207, 90%, 63%);
--fg-accent-dark: hsl(207, 32%, 52%);
--fg-accent-2: hsl(140, 3%, 83%);
--fg-accent-dark-2: hsl(207, 32%, 63%);
--vivid-lime-green: hsl(112, 77%, 48%);
}
/* ---- GENERAL ---- */
a, body, span{
word-break: unset;
}
a:visited, a:hover{
color: var(--fg-accent-dark-2);
}
a.newpage{
color: hsl(237, 27%, 68%);
}
ins, del{
color: var(--bg-dark);
}
.meta-title{
color: var(--fg-light);
border-bottom-color: var(--fg-light);
}
#toc{
background-color: unset;
}
/* ---- SCROLLBAR ---- */
::-webkit-scrollbar{
width: unset;
height: unset;
}
::-webkit-scrollbar-track{
background: var(--bg-dark);
}
::-webkit-scrollbar-thumb{
background: var(--fg-dark);
border: none;
}
::-webkit-scrollbar-thumb:hover{
background: var(--fg-dark-2);
}
textarea::-webkit-scrollbar-track{
background: var(--bg);
}
/* ---- HEADER ---- */
div#container-wrap{
background-image: url(https://scp-wiki.wdfiles.com/local--files/theme%3Aanon/gradient-anon.png);
}
div#header{
background-image: none;
}
div#header h1{
position: relative;
float: unset;
top: 40px;
left: 10px;
max-height: 100%;
height: 100%;
margin: unset;
background: url(/local--files/theme:anon/parawatch-anon-ru.png) no-repeat;
}
/* ---- SIDE-BAR ---- */
div#side-bar div.side-block{
background-color: var(--bg-dark);
border-color: var(--fg-dark-2);
box-shadow: none;
}
div#side-bar div.side-block.media,
div#side-bar div.side-block.resources{
background: var(--bg-dark);
}
div#side-bar div.side-block div.heading,
div#side-bar div.collapsible-block-unfolded-link,
div#side-bar div.collapsible-block-unfolded-link div.collapsible-block-link{
color: var(--fg-dark-2);
border-color: var(--fg-dark-2);
}
#side-bar div.menu-item img{
filter: hue-rotate(62deg) invert(100%);
}
div.scpnet-interwiki-wrapper{
filter: hue-rotate(62deg) invert(83%);
}
@media (max-width: 767px){
#side-bar{
background-color: var(--bg-dark);
}
}
/* Модуль щобы покрасить кнопку "Стать участником" */
#u-become-member {
background-color: var(--bg-dark);
border-color: var(--fg-dark-2);
box-shadow: none;
}
#u-become-member .menu-item > .image {
filter: hue-rotate(62deg) invert(100%);
}
/* чтобы не вылезало за границы */
.menu-item.small {
font-size: .85em;
}
/* ---- TOP-BAR ---- */
#top-bar a{
color: var(--fg-accent-dark);
}
#top-bar .open-menu a{
color: var(--fg-dark-2);
background-color: var(--bg-dark);
border-color: var(--fg-dark-2);
}
div.yui-navset div.yui-content{
background-color: var(--bg);
}
div.yui-navset ul.yui-nav a,
div.yui-navset div.yui-navset-top ul.yui-nav a{
color: var(--fg-accent);
background-color: var(--bg-dark);
border-color: var(--fg-light);
}
div.yui-navset ul.yui-nav a:hover,
div.yui-navset ul.yui-nav a:focus{
color: var(--fg-accent-light);
background-color: var(--bg-light);
}
div.yui-navset ul.yui-nav .selected a,
div.yui-navset ul.yui-nav .selected a:focus,
div.yui-navset ul.yui-nav .selected a:hover{
background-color: var(--bg-light-2);
border-color: var(--fg-accent);
}
/* ---- INFO BAR ---- */
.info-container{
--linkColour: var(--fg);
--barColour: var(--bg-dark);
}
/* ---- INFO MODULE ---- */
.creditButton p a{
color: var(--fg);
}
.creditButton p a:hover,
.creditButtonStandalone p a:hover{
color: var(--vivid-lime-green) !important;
}
#page-content .modalbox{
background: var(--bg) !important;
box-shadow: none !important;
}
.close-credits,
.credit-back{
filter: hue-rotate(62deg) invert(100%) brightness(150%);
}
div#footer{
background: var(--bg-dark);
}
#license-area{
color: var(--fg);
}
/* ---- RATING MODULE ---- */
.page-rate-widget-box,
.rate-box-with-credit-button{
box-shadow: none;
}
.page-rate-widget-box .rate-points,
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a,
.page-rate-widget-box .cancel a,
.page-rate-widget-box .rateup a:hover,
.page-rate-widget-box .ratedown a:hover,
.page-rate-widget-box .cancel a:hover{
color: var(--fg);
}
/* ---- LICENSEBOX ---- */
.licensebox .collapsible-block-link{
color: var(--fg-accent-dark);
}
/* ---- FOOTNOTE HOVERS ---- */
.hovertip{
box-shadow: none;
}
/* ---- EDITING WINDOWS ---- */
.owindow{
border-color: var(--fg-dark-2);
}
.owindow,
.owindow h1,
.owindow h2,
.owindow h3,
.owindow h4,
.owindow h5,
.owindow h6{
color: var(--fg);
}
.owindow{
background-color: var(--bg-dark);
}
.owindow .title{
background-color: var(--bg);
}
.owindow a,
.owindow a:visited{
color: var(--fg-accent-dark);
}
.owindow .active{
color: var(--fg-dark-2);
}
.owindow .content.modal-body img{
background-color: var(--bg-dark) !important;
}
.owindow .button-bar a{
background-color: transparent;
border-color: var(--fg-dark-2);
}
.owindow .button-bar a:hover,
.owindow .button-bar a:focus{
background-color: transparent;
border-color: var(--fg-dark);
}
table.page-files .highlight{
background-color: var(--bg-light);
}
input.text,
input.text:focus,
input.text:hover{
color: var(--fg-light);
border-color: var(--fg);
}
.wd-editor-toolbar-panel div {
filter: hue-rotate(62deg) invert(83%);
}
textarea{
color: var(--fg);
background-color: var(--bg-dark);
}
.change-textarea-size a{
color: var(--fg);
background-color: var(--bg-dark);
}
div#lock-info{
background-color: var(--bg);
}
/* ---- SELECTION ---- */
::selection{
background: hsl(207, 11%, 27%);
}
/* ---- PARAWATCH DIV BLOCK ---- */
div.parapost{
border-color: var(--bg-dark);
}
span.title{
color: var(--fg-dark-2);
font-size: 110%;
font-weight: bold;
cursor: pointer;
word-break: unset;
}
span.title span{
word-break: unset;
}
span.title:hover,
span.title:focus{
text-decoration: underline;
}
/* -------- MOBILE MEDIA QUERY -------- */
@media (max-width: 479px){
div#header h1{
background-position-y: .5em !important;
background-size: 75% !important;
}
}
/* -------- NOTE MEDIA QUERY -------- */
@media (min-width: 480px) and (max-width: 580px){
div#header h1{
background-position-y: 1em !important;
background-size: 60% !important;
}
}
/* -------- MINI TABLET MEDIA QUERY -------- */
@media (min-width: 581px) and (max-width: 767px){
div#header h1{
background-position-y: .25em !important;
background-size: 65% !important;
}
}
@media (max-width: 767px){
.open-menu a:hover{
box-shadow: none !important;
}
#top-bar .open-menu a{
background-color: var(--bg-dark);
border-width: .1em;
}
}
/* -------- TABLET MEDIA QUERY -------- */
@media (min-width: 768px) and (max-width: 979px){
div#header h1{
background-size: 75% !important;
}
}
/* ---- CODE SELECTORS [BACK-END] ---- */
.hl-identifier,
.hl-code,
.hl-brackets{
color: var(--fg);
}
.hl-var{
color: #21ff00;
}
.hl-special,
.hl-quotes{
color: #ffff00;
}
.hl-reserved{
color: #00b2ff;
}
.hl-number,
.hl-string{
color: #ff0020;
}
[[/module]]

Обычный текст начинается тут.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent dapibus neque dapibus ullamcorper facilisis. Sed et porta arcu, a vestibulum ligula. Nam auctor, arcu vel fringilla lobortis, ipsum ante malesuada turpis, vitae dapibus mi risus non diam. Fusce aliquam feugiat mauris, a consectetur justo dignissim vitae.
Duis eleifend justo eu orci placerat, at bibendum felis aliquam. Integer eu dapibus dui. Praesent viverra dolor vitae commodo hendrerit. Suspendisse aliquam mattis neque et vulputate. Sed nisl risus, vehicula eu nunc vel, lobortis iaculis ex. Nullam sollicitudin, nunc scelerisque euismod dignissim, leo erat iaculis lorem, sit amet interdum nulla justo luctus nibh. Aliquam tincidunt, risus eget sagittis posuere, augue est malesuada magna, non rutrum justo magna nec nunc.
Mauris nisi turpis, feugiat sed semper vitae, scelerisque et libero. Vivamus ex massa, placerat ut lorem nec, mollis tempor risus. Morbi eget leo dui. Duis sit amet massa vel magna euismod commodo. Vestibulum sit amet pretium eros. Duis pretium suscipit nunc, id dignissim orci laoreet sodales. Duis non vehicula dolor. Nulla at mi ut ante gravida vehicula.
Это эстетическая тема за авторством
EstrellaYoshte, основанная на Sigma+ и вдохновлённая интерфейсом SCP: Containment Breach.
Для использования этой темы, добавьте в начало статьи следующий код:
[[include theme:paperstack]]
[[div class="logo"]]
[[image https://scpfoundation.net/local--files/theme%3Apaperstack/lgtrans.png]]
[[/div]]
[[>]]
[[module Rate]]
[[/>]]
[[div class="header-container-ex"]]
[[include component:image-block name=(СЮДА-ИЗОБРАЖЕНИЕ)|caption=(СЮДА ПОДПИСЬ)|width=300px|align=right]]
[[div class="header-info"]]
[[div class="header-info-flex"]]
[[div class="text-item"]]
[[size 90%]]##grey|**ОБЪЕКТ №:**##[[/size]]
[[size 220%]]**9999**[[/size]]
[[/div]]
[[div class="text-item"]]
[[size 90%]]##grey|**КЛАСС СОДЕРЖАНИЯ:**##[[/size]]
[[size 220%]]**ТЕМА-ЭЛЬ**[[/size]]
[[/div]]
[[/div]]
[[/div]]
[[/div]]
Обычный текст начинается тут.
В качестве альтернативы можно использовать один или несколько блоков text-item, а также пропустить блок с изображением.
[[include theme:paperstack]]
[[div class="logo"]]
[[image https://scpfoundation.net/local--files/theme%3Apaperstack/lgtrans.png]]
[[/div]]
[[>]]
[[module Rate]]
[[/>]]
[[div class="header-container-ex"]]
[[div class="header-info"]]
[[div class="header-info-flex"]]
[[div class="text-item"]]
ЗДЕСЬ ВАШ ТЕКСТ
[[/div]]
[[/div]]
[[/div]]
[[/div]]
Смотри, здесь больше текста.
Ещё больше.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это цитата, её можно создать поставив "> " в начале строки.
Больше текста
Это горизонтальная линия.
Вложенная цитата.
Это | Таблица |
---|
Ты уже должен знать | как это |
сделать |
Шрифт хедэра — Jost, потому что Josefin Sans не поддерживает кириллицу.
Шрифт тела статьи IBM Plex Sans.
Моноширный шрифт Fira Code.