ЧТО ЭТО ЗА МЕСТО?
Ад.
(Ну, не совсем)
Это JAKSTYLE. Персональная копирка PLACESTYLE, BLANKSTYLE и всех остальных STYLE, о которых вы могли вспомнить, созданная JakdragonX. Он не имеет привязки к чему-то во вселенной, будь то группа, канон, СО или ещё чего (Я что по-вашему, HarryBlank? Не, я не настолько умный.)
Кто угодно может использовать эту тему, но помните что я не помню даже что сам съел пять минут назад, так что выбирайте аккуратнее, если вам эта тема показалась "мега крутой".
КАК ИСПОЛЬЗОВАТЬ?
Для подключения этой темы, просто добавьте строчку ниже на вашу страницу и молитесь, что я ничего не сломал и оно заработает как надо.
[[include theme:jakstyle]]
Для редактирования хедера, субхедера и фоновой пикчи, вставьте этот код после подключения темы:
[[module CSS]]
:root {
--header-title: "тут заголовок";
--header-subtitle: "тут подзаголовок";
--lgurl: url('тут url');
}
[[/module]]
ПРИМЕЧАНИЕ: Пожалуйста, поймите что это ТЁМНАЯ тема. Попытки поменять цвета этой темы на очень тёмные или супер-светлые грозят уроном по глазам читателей и по рейтингу вашей статьи (поблагодарите меня за это позже).
В ЧЁМ ОТЛИЧИЯ?
Ты что, слепой что ли? Всё отличное. Но если тебе нужен детальный список изменений, держи:
Если хотите увидеть больше, в следующей секции представлены примеры стандартного оформления Wikidot.
ПРИМЕРЫ
Горизонтальная линия может быть создана при помощи 5 дефисов "-----" и проходит через всю страницу, если он не находится внутри чего-либо (например, цитат). Линии, разделяющие разделы этой страницы, представляют собой горизонтальные линии.
Ссылка по которой вы наверное переходили, хз
Заголовки можно создать, поставив от одного до шести плюс "+" в начале строки.
Первый заголовок
Второй заголовок
Третий заголовок
Четвёртый заголовок
Пятой заголовок
Шестой заголовок
Смотри, здесь больше текста.
Ещё больше.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это длинная вкладка. Она содержит много текста.
Это цитата, её можно создать поставив "> " в начале строки.
Больше текста
Это горизонтальная линия.
Вложенная цитата.
Это | Таблица |
---|
Ты уже должен знать | как такие |
создавать |
Примеры
Горизонтальная линия может быть создана при помощи 5 дефисов "-----" и проходит через всю страницу, если он не находится внутри чего-либо (например, цитат). Линии, разделяющие разделы этой страницы, представляют собой горизонтальные линии.
Заголовки можно создать, поставив от одного до шести плюс "+" в начале строки.
Первый заголовок
Второй заголовок
Третий заголовок
Четвёртый заголовок
Пятой заголовок
Шестой заголовок
Как подключить
Для включения этой темы на вашей странице, добавьте этот код в любое место статьи:
[[include theme:wanderers-depths]]
Представьте что здесь Lorem Ipsum
.
А вот некоторые ссылки:
Это цитата, её можно создать поставив "> " в начале строки.
Больше текста
Это горизонтальная линия.
Вложенная цитата.
И ещё одна
[[div class="paper"]]
[[/div]]
Это цитата, её можно создать поставив "> " в начале строки.
Больше текста
Это горизонтальная линия.
Вложенная цитата.
Это | Таблица |
---|
Ты уже должен знать | как это |
сделать |
Шрифт тела статьи - Lato.
Шрифт хедера - Azimov Edge Italic, потому что Trade Winds не поддерживает кириллицу.
Шрифт названия и заголовков - Azimov Edge Italic, потому что Trade Winds не поддерживает кириллицу.
Моноширный шрифт - PT Mono.
/* Wanderer's Depths Theme */
/* 2020 Wikidot Theme */
/* By ROUNDERHOUSE, based off Dustjacket by Woedenaz and Croquembouche */
/* Logo by Bard Bard, using art from SunnyClockwork, licensed under CC BY SA 3.0 */
/* Header background CC BA SA 3.0, edited by ROUNDERHOUSE. */
/* Fonts */
@import url('https://fonts.googleapis.com/css?family=Trade+Winds&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;700&display=swap');
@font-face {
font-family: "Azimov Edge Italic";
src: url("https://scpfoundation.net/local--files/theme:wanderers-depths/AsimovEdgeIt.otf") format('opentype');
}
/* All Vars Used */
:root {
/* S-CSS-P Integration */
/* If you're making a new CSS theme, please include the following three variables at minimum. */
--theme-base: "nuscp";
/* must be either "nuscp" or "sigma9" */
--theme-id: "WanderersDepths";
/* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
--theme-name: "Wanderer's Depths";
/* set this to your theme's full name */
/* Header */
--logo-image: url("https://scpfoundation.net/local--files/theme:wanderers-depths/anchor.png");
/* Logo image made by Bard Bard using elements from SunnyClockwork, all licensed under CC BY SA 3.0 */
--header-title: "ГЛУБИНЫ СТРАННИКА";
/* Typefaces */
--header-font: "Azimov Edge Italic", 'Trade Winds', cursive;
--title-font: "Azimov Edge Italic", 'Trade Winds', cursive;
--mono-font: "PT Mono", "Andale Mono", "Courier New", Courier, monospace;
/* Standard Colors */
--white-monochrome: 252, 252, 252;
/* white */
--pale-gray-monochrome: 244, 244, 244;
/* v light gray for blockquotes and stuff */
--light-gray-monochrome: 170, 170, 170;
/* light accent gray for login status */
--gray-monochrome: 66, 66, 72;
/* gray */
--dark-gray-monochrome: 48, 48, 52;
/* dark accent gray for sidebar background */
--black-monochrome: 12, 12, 12;
/* black */
--bright-accent: 255, 219, 90;
/* bright yellow */
--bright-two: 31, 101, 193;
/* bright blue */
--medium-accent: 12, 64, 122;
/* blue */
--dark-accent: 0, 63, 96;
/* dark blue */
--newpage-color: 221, 102, 17;
/* pale orange */
/* Primary Theme Colors */
--swatch-background: var(--white-monochrome);
--swatch-primary: var(--medium-accent);
--swatch-primary-darker: var(--bright-accent);
--swatch-primary-darkest: var(--bright-two);
/* Primary Text Colors */
--swatch-text-dark: var(--black-monochrome);
--swatch-text-light: var(--white-monochrome);
--swatch-important-text: var(--bright-accent);
/* Primary Header Colors */
--swatch-headerh1-color: var(--white-monochrome);
--swatch-headerh2-color: var(--white-monochrome);
--swatch-topmenu-border-color: var(--bright-accent);
--swatch-topmenu-bg-color: var(--medium-accent);
--rating-module-button-color: var(--bright-accent);
--rating-module-text-color: var(--bright-accent);
/* Interwiki */
--head: var(--medium-accent);
--link: var(--bright-two);
}
#content-wrap {
background-image: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperbodybg.jpg);
}
div#extra-div-1 {
background-image: url(https://scpfoundation.net/local--files/theme:wanderers-depths/waterbg.png);
background-size: contain;
background-repeat: repeat-x;
}
#top-bar {
--dropdown-links-hover-color: var(--white-monochrome);
}
#top-bar div.top-bar > ul > li > a {
padding: 0.2em 1em;
}
#top-bar div.top-bar > ul > li > ul {
background: rgba(var(--dark-gray-monochrome), 1);
}
#top-bar div.top-bar > ul > li > ul > a {
color: rgb(var(--medium-accent));
}
#side-bar {
--sidebar-links-hover-text-color: var(--white-monochrome);
}
#side-bar:target {
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg)!important;
}
div#page-options-bottom > a,
div#page-options-bottom-2 > a {
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
border: 0.15rem solid rgba(var(--dark-accent), 1);
color: rgba(var(--dark-accent), 1);
}
div#page-options-bottom > a:hover,
div#page-options-bottom > a:active,
div#page-options-bottom-2 > a:hover,
div#page-options-bottom-2 > a:active {
background-color: rgba(var(--swatch-menubg-light-color), 0,25);
color: rgba(var(--bright-two), 1);
border: 0.15rem solid rgba(var(--bright-two), 1);
}
#page-title {
border-bottom: 1px dashed rgb(var(--swatch-menubg-medium-dark-color,66,66,72));
}
.page-rate-widget-box {
background: linear-gradient(to top, rgba(var(--dark-accent), 1) 0, rgba(var(--medium-accent), .75) 100%);
}
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
border: 1px solid rgb(var(--bright-accent));
}
#search-top-box:not(:focus-within)::before {
color: rgb(var(--bright-accent));
}
.blockquote, blockquote {
border: 3px ridge rgb(var(--dark-accent));
background: rgba(var(--medium-accent),0.05);
}
#main-content hr {
background-image: none;
background-color: rgba(var(--medium-accent))!important;
}
.footnotes-footer .title {
font-family: var(--title-font);
}
.footnotes-footer {
box-sizing: border-box;
display: block;
position: relative;
width: 95%;
height: auto;
margin: 1.5rem 1.5rem .5rem;
padding: .15em 1em 1em 0;
background-color: rgb(var(--pale-gray-monochrome));
box-shadow: inset .5em 0 0 0 rgba(var(--footnotes-footer-colorbar-color));
color: rgb(var(--footnotes-footer-text-color));
}
.footnotes-footer {
border: 3px ridge rgb(var(--dark-accent));
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
}
#toc {
border: 3px ridge rgb(var(--medium-accent));
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
}
#toc .title {
color: rgb(var(--bright-two));
}
.collection > .collapsible-block {
background-color: rgb(var(--white-monochrome));
border: 3px solid rgb(var(--dark-accent));
}
.collection .collapsible-block-unfolded-link {
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
border: 2px solid rgb(var(--white-monochrome));
}
.collection .collapsible-block-folded {
background: url(https://scpfoundaiton.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
border: 2px solid rgb(var(--white-monochrome));
}
.authorname {
color: rgb(var(--dark-accent));
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
border: 2px solid rgb(var(--white-monochrome));
}
.titlecolumn {
border: 2px solid rgb(var(--white-monochrome));
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
}
.articlecolumn {
background-color: rgb(var(--white-monochrome));
}
.paper {
font-family: 'Caveat', cursive;
font-style: bold;
font-size: 1.4rem;
background: url("https://scpfoundation.net/local--files/theme:wanderers-depths/paper.jpg") repeat 0px 8px;
/*Licensed under CC, produced by https://www.deviantart.com/jojo-ojoj*/
border: 3px ridge rgb(var(--dark-accent));
border-radius: 5px;
padding: 10px 10px;
margin: auto;
}
.page p,
.page ul {
line-height: 1.2em;
margin: 0;
}
.wl-translations {
background-color: none;
background: url(https://scpfoundation.net/local--files/theme:wanderers-depths/paperdivbg.jpg);
}
.wl-translations a {
color: rgb(var(--bright-two));
}
.wl-image-block .wl-image-caption {
background-color: rgb(var(--medium-accent));
}
a {
color: rgb(var(--bright-two));
}
a:visited {
color: rgb(var(--dark-accent));
}
a:hover {
color: rgba(var(--bright-two), .6);
}
/* mobile */
@media only screen and (max-width: 768px) {
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
background-color: rgb(var(--medium-accent));
border-bottom: none;
border-right: none;
}
div#extra-div-1 {
background-size: cover;
}
div#extrac-div-1 {
background-image: url(https://scpfoundation.net/local--files/theme:wanderers-depths/waterbg.png);
background-size: var(--header-height-on-mobile);
background-repeat: no-repeat;
z-index: 3;
}
div#page-options-bottom {
width: 90%;
}
}
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]]