Тема "Н.Т.О.З."

Тема была создана CutTheBirch Для использования в статьях, связанных с Н.Т.О.З.

[[include :ru-backrooms-wiki:theme:bntg]]

:)

Примеры:

Горизонтальная линия может быть создана путём написания 5 дефисов подряд "-----" и она будет тянуться на всю страницу (только если не размещена в блоке цитаты). Линии, делящие документ на секции выглядят так:

---

Заголовки могут быть созданы путём постановки от 1 до 6 плюсов подряд "+" в начале строки

+ Заголовки

Заголовок первого уровня

Заголовок второго уровня

Заголовок третьего уровня

Заголовок четвёртого уровня

Заголовок пятого уровня

Заголовок шестого уровня

СВ Классы

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}

СКСС

CONCORD ENTITY CLASSIFICATION SYSTEM

ENTITY ID: 7
HABITAT(S): 1, 2

IETS:
2?

CLASS:

Zoophoid

PROPERTIES:

HVM

VRL-A

VRL-B

NCR

MCH

CBR

SYN

DMN

SSV

CVL

RAD

NRO

TXC

PYR

RLA

UNQ

AGR

BNV

{$custom-name}

Вкладка

Это таблица с вкладками.

Обилие Вкладок

Смотрите, тут ещё текст.

Как неожиданно.

Длинная Вкладка

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

Это длинная вкладка. В ней очень много текста.

У этой пустой вкладки с какого-то перепуга очень длинное имя. Интересно...

Пустая Вкладка

Пустая Вкладка

Пустая Вкладка

Пустая Вкладка

Пустая Вкладка

What?

Это альтернативная таблица с вкладками, выглядящая как папка с файлами. Меня вдохновляла схожая вещь с вики по SCP.

Кроме того, если вы сейчас используете телефон, вы можете заметить, что даже 3 вкладки в этом моде не работают на мобильном телефоне. Если вы используете что-то подобное в своей статье, я бы посоветовал изменить CSS, чтобы на мобильных устройствах отображалось обычное представление вкладок.

Как?

Вам просто нужно поместить таблицу в див с классом "filetabs" прямо вот так:

[[div class="filetabs"]]
[[tabview]]
[[tab ЗАГОЛОВОК ВКЛАДКИ]]
СОДЕРЖИМОЕ ВКЛАДКИ
[[/tab]]
[[tab ЗАГОЛОВОК ВКЛАДКИ]]
СОДЕРЖИМОЕ ВКЛАДКИ
[[/tab]]
[[/tabview]]
[[/div]]

Очень длинное название

Если сделать длиннее, то оно начнёт хуже работать

P.S.

Если вы хотите установить что-то подобное для своей темы или просто поработать с существующей темой, дайте мне знать, и я буду рад помочь!

Это блочная цитата, созданная путём размещения "> " в начале каждой строки.
Больше текста

---

Это горизонтальная линия

Блок в блоке¹

А это	таблица
Вы наверняка	уже знаете
как их создавать

Тест заголовка
[[div class="titleblock"]]
[[span class="titlebox"]]Тест заголовка[[/span]]

[[/div]]

[[div class="styled-quote"]]

[[/div]]

[[div class="dark-styled-quote"]]

[[/div]]

[[div class="darkblock"]]

[[/div]]

[[div class="lightblock"]]

[[/div]]

Ты котик.
Ты котик.
Ты котик.
Ты котик.
Ты котик.
Ты котик.

---

В шапке и заголовках использован шрифт Staatliches.
Основным шрифтом стал PT Serif.

---

+ Код Темы

@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Serif&display=swap');
 
:root {
    --theme-base: "black-highlighter";
    --theme-id: "bntg";
    --theme-name: "B.N.T.G. Theme";
 
    --logo-image: none;
    --header-title: "Н.Т.О.З.";
    --header-subtitle: "Контролирующие рынок контролируют мир.";
 
    --header-font: 'Staatliches';
    --title-font: 'Staatliches';
    --body-font: 'PT Serif';
 
    --white-monochrome: 220, 221, 215;
    --pale-gray-monochrome: var(--white-monochrome);
    --light-pale-gray-monochrome: var(--pale-gray-monochrome);
    --light-gray-monochrome: var(--pale-gray-monochrome);
    --gray-monochrome: var(--dark-accent);
    --dark-gray-monochrome: 64, 61, 60;
    --black-monochrome: var(--medium-accent);
    --pale-accent: 232, 231, 213;
    --bright-accent: 86, 108, 90;
    --medium-accent: 102, 102, 102;
    --dark-accent: var(--bright-accent);
 
    --sd-border: var(--dark-gray-monochrome);
    --cecs-accent: var(--medium-accent) !important;
 
    --header-gradient-color-bottom: var(--dark-gray-monochrome);
    --header-gradient-color-middle: var(--dark-gray-monochrome);
    --header-gradient-color-top: var(--dark-gray-monochrome);
    --swatch-menubg-color: var(--pale-gray-monochrome);
    --swatch-topmenu-border-color: var(--dark-accent);
    --link-color: 68, 117, 77;
    --hover-link-color: var(--link-color);
    --visited-link-color: var(--link-color);
 
    --rating-module-button-plus-color: var(--dark-accent);
    --rating-module-button-negative-color: var(--dark-accent);
    --rating-module-button-cancel-color: var(--dark-accent);
    --rating-module-button-credit-color: var(--dark-accent);
 
    --gradient-header: repeating-linear-gradient(
      -30deg,
      rgba(var(--dark-gray-monochrome), 0.8),
      rgba(var(--dark-gray-monochrome), 1) 50px
    );
}
 
/* sd banner colours */
 
.sd-container {
   --sd-border:64,61,60;
   --sd-symbol:255,255,255;
   --sd-text:255,255,255;
}
 
#container {
   background-image: none;
}
 
#header::before {
   left: -16.5rem;
   background-size: auto 14rem;
}
 
#skrollr-body {
    background-image:
     var(--gradient-header),
     var(--gradient-topmenu),
     var(--gradient-background)!important;
    background-size:
     var(--header-background-image-size),
     100% var(--final-header-height-on-desktop),
     100% var(--background-gradient-distance);
}
 
.page-rate-widget-box,
.page-rate-widget-box .rate-points,
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown,
.page-rate-widget-box .cancel {
   background: rgb(var(--pale-accent)) !important;
}
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    -webkit-box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
    box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-content {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border-color: rgb(var(--dark-accent));
}
 
div.blockquote, blockquote {
    background-color: rgb(var(--pale-accent));
    border-color: rgb(var(--dark-accent));
    border-style: solid;
}
 
table.wiki-content-table th {
    background-color: rgb(var(--dark-accent));
    color: rgb(var(--pale-gray-monochrome));
}
 
.footnotes-footer {
    border-color:  rgb(var(--dark-accent));
}
 
#side-bar .side-block {
    color: rgb(var(--swatch-text-general));
}
 
#side-bar:hover {
    background:  rgb(var(--pale-accent));
}
 
.scp-image-block {
   border: none;
}
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected,
.yui-navset .yui-nav .selected a:active,
.yui-navset .yui-nav .selected a:focus {
    background-color: rgb(var(--dark-accent));
}
 
.styled-quote,
.lightblock {
    background-color: rgb(var(--pale-accent));
}
 
.titleblock {
   background-color: rgb(var(--pale-accent));
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--dark-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--dark-accent));
  color: rgb(var(--pale-gray-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.footnotes-footer {
    background-color: rgb(var(--pale-accent));
}
 
table.wiki-content-table td,
table.wiki-content-table th {
   border-color: rgb(var(--dark-accent)) !important;
}
 
#account-topbutton {
   border-color: rgb(var(--pale-gray-monochrome));
}
 
#login-status a {
   color: rgb(var(--pale-gray-monochrome));
}
 
hr {
    border-color: rgb(var(--dark-accent));
    background-color: rgb(var(--dark-accent));
}
 
html,
#lock-info,
div.note,
input.checkbox,
input.text,
textarea {
    scrollbar-color: rgba(var(--medium-accent), 0.7) rgba(var(--swatch-tertiary-color), .1);
}
 
body::-webkit-scrollbar-thumb,
html::-webkit-scrollbar-thumb,
input.text::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb,
::-webkit-scrollbar-thumb {
    background: rgba(var(--medium-accent), 0.7)
}
 
.top-box {
   border-color: rgb(var(--sd-border)) !important;
}
 
.bottom-box ul li {
   color: rgb(var(--sd-border)) !important;
}
 
.bottom-box ul li:before {
   background: rgb(var(--sd-border)) !important;
}
 
.top-box .gradient-box {
  background: linear-gradient(90deg, rgba(var(--sd-border),1) 0%, rgba(var(--sd-border),0) 36%) !important;
}
 
.header-diamond {
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23403d3c;%7D .st1%7Bfill:%23403d3c;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
}
 
.top-box.class-unknown .header-diamond { filter: none !important; }
.top-box.class-unknown:before, .top-box.class-unknown .header-diamond .diamond-pattern{ opacity: 0.15 !important; }
 
.top-box .header-diamond .diamond-image {
   filter: brightness(0%) invert(100%);
}
 
.top-box.class-0,
.top-box.class-1 {
   background: rgb(var(--pale-accent)) !important;
}
 
.header-diamond .diamond-color.class-0,
.header-diamond .diamond-color.class-1 {
   background: rgb(var(--pale-accent)) !important;
}
 
.top-box.class-2,
 .top-box.class-3 {
   background: rgb(var(--medium-accent)) !important;
}
 
.header-diamond .diamond-color.class-2,
.header-diamond .diamond-color.class-3 {
   background: rgb(var(--medium-accent)) !important;
}
 
.top-box.class-4,
 .top-box.class-5 {
   background: rgb(var(--bright-accent)) !important;
}
 
.header-diamond .diamond-color.class-4,
.header-diamond .diamond-color.class-5 {
   background: rgb(var(--bright-accent)) !important;
}
 
.top-box.class-unknown {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.header-diamond .diamond-color.class-unknown {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.darkblock a,
.dark-styled-quote a {
    color: rgb(var(--pale-accent));
}
 
::selection {
    background: rgba(var(--dark-gray-monochrome), .25);
}
 
.darkblock h1,
.dark-styled-quote h1,
.darkblock h2,
.dark-styled-quote h2,
.darkblock h3,
.dark-styled-quote h3,
.darkblock h4,
.dark-styled-quote h4,
.darkblock h5,
.dark-styled-quote h5 {
    color: rgb(var(--white-monochrome));
}
 
.darkblock hr,
.dark-styled-quote hr {
   border-color: rgb(var(--pale-gray-monochrome));
   background-color: rgb(var(--pale-gray-monochrome));
}
 
.darkblock a.newpage,
.dark-styled-quote a.newpage {
    color: rgb(var(--newpage-color));
}
 
.dark-styled-quote {
    border-color: rgb(var(--pale-accent));
}
 
#header h1, #header h1 a {
   top: 0.5rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   top: 1.75rem;
}
 
.filetabs .yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
   display: inline-block;
}
 
.filetabs .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
   display: block;
}
 
.filetabs .yui-navset .yui-content {
   border-top-width: 15px;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a,
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' preserveAspectRatio='none' viewBox='0 0 150 45' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 4.6.0%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1 0 0 1 74.95 22.39)' id='bC-LIzxo7Tu37zCdkDrqS' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(86,108,90); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -74.94856 22.50703 L -60.0064 -12.520110000000003 C -60.0064 -12.520110000000003 -55.89385 -21.849030000000003 -47.235839999999996 -22.281930000000003 C -38.57782999999999 -22.714830000000003 46.87608 -22.39016 46.87608 -22.39016 C 46.87608 -22.39016 56.05659 -23.219710000000003 61.40639 -12.520120000000002 C 66.75618 -1.8205300000000015 74.94856 22.506959999999996 74.94856 22.506959999999996 z' stroke-linecap='round' /%3E%3C/g%3E%3Cg transform='matrix(1 0 0 1 75.18 17.97)' id='E8ePkHu_UUyvFWDAIzFyP' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(232,231,213); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -46.15385 12.0108 L -46.15385 -12.01079 L 46.153839999999995 -12.01079 L 46.153839999999995 12.0108 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 2.7rem;
    background-repeat: no-repeat;
    border-width: 0px;
    border-top: none;
    background-position: top;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a {
   padding: 4px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav .selected a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected a:hover {
    padding: 8px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
   padding: 6px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav,
.filetabs .yui-navset .yui-navset-top .yui-nav {
    border-color: transparent;
}
 
.filetabs .yui-navset .yui-nav .selected,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected,
.filetabs .yui-navset .yui-nav .selected a:active,
.filetabs .yui-navset .yui-nav .selected a:focus,
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   background-color: transparent;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   box-shadow: none;
}
 
.filetabs .yui-navset .yui-nav li {
   margin-right: 36px;
}
 
.filetabs .yui-navset .yui-nav .selected a {
   color: rgb(var(--swatch-text-general)) !important;
}
 
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover {
   color: rgb(var(--swatch-text-general));
}
 
.filetabs .yui-navset .yui-nav .selected a em,
.filetabs .yui-navset .yui-nav .selected a:hover em {
   position: relative;
   top: -4px;
}
 
.filetabs .yui-navset .yui-nav a:hover em {
   position: relative;
   top: -2px;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   border-bottom: solid 1px rgb(var(--white-monochrome));
}
 
.filetabs .yui-navset .yui-nav li.selected,
.filetabs .yui-navset .yui-navset-top .yui-nav li.selected {
   border-bottom: none;
   z-index: 1;
}
 
code,
.code {
   background-color: rgb(var(--pale-accent));
}
 
#search-top-box-input,
#search-top-box-form input[type=submit],
#search-top-box-input:focus, #search-top-box-input:hover {
   border-color: rgb(var(--dark-gray-monochrome));
}
 
.scp-image-block .scp-image-caption {
   background-color: rgb(var(--pale-accent));
}
 
#search-top-box-input:focus,
#search-top-box-input:hover {
   color: rgb(var(--swatch-text-general));
}

Автор

Автор:
CutTheBirch
Авторская страница (на английской вики)

Footnotes

1. А вот и сноска!