Класична тема SCP

Оцінювання:

Оцінювання + Інформаційний Модуль:

Інформація

---

Класична тема Фонду SCP
Зроблена: Lt Flops
Опублікована 21 червня 2020

Дякувати stormbreath та Croquembouche за допомогу.

---

Якщо вам це подобається, то звертайтесь до моєї авторської сторінки!]]

---

Стандартний інформаційний модуль:

Info

---

Що це таке?

---

Це сучасна версія класичної теми SCP.

Вона є адаптацією теми Wikidot “Shiny Theme”, яку використовував Фонд SCP як головну тему с 2008 до 2014 роках.

Як її використовувати

---

Якщо ви хочете використати цю тему, просто скопіюйте цей код на вершину вашої сторінки:

[[include theme:classic]]

На відміну від інших тем, ця не має логотипу.

Для чого ця тема використовується?

Ця тема існує, щоб імітувати естетику старої бази даних SCP. Подумайте про термінал доступу SCiPNET із застарілим програмним забезпеченням часів кінця 90-х або середини 2000-х років.

Ця тема підходить для оформлення файлів об'єктів, оповідань та інших сторінок.

Приклад форматування

Класичний блок зображення (Дивись джерельний код)

заголовок	заголовок	заголовок
зміст клітинки	зміст клітинки	зміст клітинки

L1 Заголовок

L2 Заголовок

L3 Заголовок

L4 Заголовок

L5 Заголовок

L6 Заголовок

Жирний | курсив | підкреслено | закреслено | моноширинний шрифт | ^{верхній індекс}_{нижній індекс}

Введіть чотири рисочки ---- щоб створити горизонтальну лінію.

---

Фейковий селектор коду {
Фейкова назва властивості: фейкове значення;
}

Посилання (Посилання, за яким ви вже, певно, ходили)

1. нумерований список
2. пункт списку
3. пункт списку

• маркований список
• пункт списку
• пункт списку

Назва вкладки

Це зміст вкладки

Назва вкладки

Привіт, тут більше тексту.

Та дуже багато!

Дооооооовга назва вкладки

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це велика вкладка. В неї багато тексту.

Це порожня вкладка, але в неї з невизначеної причини дуже довгий заголовок. І я сам не знаю, чому він такий довгий!

Порожня вкладка

Порожня вкладка

Порожня вкладка

Порожня вкладка

Порожня вкладка

Це цитата.

Більше тексту богу текстів!

---

А ось і горизонтальна лінія.

Цитата в цитаті

Джерельний код

▷ Показати код ◁

/* Класична тема Фонду SCP
 * [Тема Вікідоту 2020го року]
 * Створена Lt Flops
 * Відокремлена від Shiny Theme by Gabrys
**/
 
/* ======== HEADER AREA ======== */
/* ==== SELECTION ==== */
 ::selection {
    color: var(--key-color);
    background: var(--highlight-color);
}
 
/* ==== COMMON ==== */
 :root {
    /* == COLOUR SCHEME == */
    --green-light-1: hsl(127, 50%, 94%);
    --green-light-2: hsl(120, 100%, 77%);
    --red-light: hsl(0, 49%, 91%);
    --red-strong: hsl(355, 100%, 37%);
    --red-dark-1: hsl(0, 70%, 35%);
    --red-dark-2: hsl(353, 100%, 30%);
 
    --off-white: hsl(0, 0%, 99%);
    --gray-light-1: hsl(0, 0%, 93%);
    --gray-light-2: hsl(0, 0%, 87%);
    --gray-light-3: hsl(0, 0%, 83%);
    --gray-medium: hsl(0, 0%, 67%);
    --gray-dark-1: hsl(0, 0%, 40%);
    --gray-dark-2: hsl(0, 0%, 27%);
    --off-black: hsla(0, 0%, 0%, .95);
}
 
 :root {
    /* == COLOUR DEFINITIONS == */
    --accent-color: var(--red-dark-2);
    --fill-bg: var(--off-white);
    --key-color: var(--off-black);
 
    --area-border: var(--gray-light-2);
    --banner-primary-color: var(--gray-light-1);
    --banner-secondary-color: var(--red-dark-2);
    --highlight-color: var(--gray-light-3);
    --interwiki-bg: var(--green-light-1);
    --nav-bar-border: var(--gray-dark-2);
 
    --credit-btn-color: var(--gray-light-1);
    --credit-btn-hover-color: var(--green-light-2);
    --info-bar-color: var(--gray-dark-2);
    --link-color: var(--red-strong);
    --rate-bar-bg: var(--gray-dark-1);
    --tab-bg: var(--red-dark-1);
    --tab-hover-bg: var(--red-light);
 
    --special-border: var(--gray-medium);
    --special-btn-color: var(--gray-light-1);
    --special-text-color: var(--gray-light-1);
}
 
 :root {
    /* == FONTS == */
    --header-font: "Trebuchet MS", "Trebuchet", var(--body-font);
    --body-font: "Verdana", "Arial", "Helvetica", sans-serif;
}
 
 body {
    accent-color: var(--accent-color);
    color: var(--key-color);
 
    font-family: var(--body-font);
    overflow-wrap: break-word;
}
 
/* ==== SITE BANNER ==== */
 div#container-wrap {
    background-image: url(https://scp-wiki.wdfiles.com/local--files/theme%3Aclassic/classic_body_bg.png);
    background-repeat: repeat-x;
    background-size: auto;
}
 
 #header {
    background: 0;
}
 
 #header h1,
 #header h2 {
    margin: 0 0 0 -4px;
}
 
 #header h1 {
    max-height: 105px;
}
 
 #header h1 a,
 #header h2 span {
    color: transparent;
    text-shadow: none;
}
 
 #header h1 a {
    font-family: var(--header-font);
    letter-spacing: 0;
}
 
 #header h1 a::before,
 #header h2 span::before {
    text-shadow: none;
}
 
 #header h1 a::before {
    content: "The SCP Foundation";
    color: var(--banner-primary-color);
}
 
 #header h2 span::before {
    content: "Охороняємо, Утримуємо та Захищаємо";
    color: var(--banner-secondary-color);
}
 
/* ==== SEARCH ==== */
 #search-top-box-form input[type="submit"] {
    color: var(--key-color);
    background: var(--special-btn-color);
    border: 1px solid var(--special-border);
    border-radius: 0;
    box-shadow: none;
    font-size: 100%;
    font-weight: normal;
}
 
 #search-top-box-form input[type="submit"]:hover,
 #search-top-box-form input[type="submit"]:focus {
    color: var(--key-color);
    background: var(--highlight-color);
    border: 1px solid var(--special-border);
    box-shadow: none;
}
 
/* ==== TOP MENU ==== */
 #top-bar ul li,
 #top-bar ul li ul {
    box-shadow: none;
}
 
 #top-bar ul li ul {
    border-color: var(--nav-bar-border);
    border-style: solid;
    border-width: 0 1px 1px;
}
 
 #top-bar ul li a {
    border-color: var(--nav-bar-border);
    border-style: solid;
    border-width: 0 0 0 1px;
}
 
 #top-bar ul li a::before {
    content: "[";
}
 
 #top-bar ul li a::after {
    content: "]";
    position: relative;
}
 
 #top-bar ul li ul li a::before {
    content: unset;
}
 
 #top-bar ul li ul li a::after {
    content: unset;
}
 
 #top-bar ul li:nth-child(5) a::after {
    left: unset;
}
 
 #top-bar .top-bar > ul > li > a,
 #top-bar .mobile-top-bar > ul > li > a {
    font-weight: normal;
}
 
 #top-bar .top-bar > ul > li:hover > ul {
    margin-top: 1px;
}
 
 .mobile-top-bar {
    bottom: -.5px;
}
 
/* ==== LOGIN ==== */
 #login-status ul a {
    background: var(--special-text-color);
}
 
/* ==== SIDE MENU ==== */
 #side-bar {
    clear: both;
    padding: .78em;
    padding-bottom: 0;
    border: 1px solid var(--area-border);
    border-radius: 0;
    box-shadow: none;
}
 
 #side-bar .side-block {
    margin-bottom: .78em;
    background: var(--fill-bg);
    border: none;
    border-radius: 0;
    box-shadow: none;
}
 
 #side-bar .heading {
    padding-left: 0;
    color: var(--key-color);
    border-bottom: 1px solid var(--special-border);
}
 
/* ==== INTERWIKI ==== */
 #interwiki body {
    overflow: hidden;
}
 
 #interwiki .side-block {
    background: var(--interwiki-bg);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
 
 #interwiki .heading {
    margin: 0;
    padding-left: 0;
 
    color: var(--key-color);
    border-color: var(--special-border);
}
 
 #side-bar a:visited,
 #interwiki a:visited {
    color: var(--link-color);
}
 
/* ======== CONTENT AREA ======== */
/* ==== INFO BAR ==== */
 .info-container {
    --barColour: var(--info-bar-color);
    --linkColour: var(--credit-btn-color);
}
 
 .info-container:hover {
    --linkColour: var(--credit-btn-hover-color);
}
 
/* ==== PAGE RATING ==== */
 .page-rate-widget-box {
    margin-right: 0;
    border-radius: 0;
    box-shadow: none;
}
 
 div.page-rate-widget-box .rate-points {
    background-color: var(--rate-bar-bg) !important;
    border: none;
    border-radius: 0;
}
 
 .page-rate-widget-box .rateup,
 .page-rate-widget-box .ratedown {
    background-color: var(--area-border);
    border: none;
    font-weight: normal;
}
 
 .page-rate-widget-box .cancel {
    background-color: var(--area-border);
    border: none;
    border-radius: 0;
}
 
 .page-rate-widget-box .rateup a,
 .page-rate-widget-box .ratedown a {
    color: var(--key-color);
}
 
 .page-rate-widget-box .cancel a {
    color: var(--key-color);
    text-transform: lowercase;
}
 
 .page-rate-widget-box .rateup a:hover,
 .page-rate-widget-box .ratedown a:hover {
    color: var(--key-color);
    background: var(--special-text-color);
    text-decoration: underline;
}
 
 .page-rate-widget-box .cancel a:hover {
    color: var(--key-color);
    background: var(--special-text-color);
    text-decoration: underline;
}
 
/* ==== INFO MODULE ==== */
 #page-content .creditRate {
    margin-right: 0;
}
 
 #page-content .rate-box-with-credit-button {
    background: var(--rate-bar-bg);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
 
 #page-content .creditButton p a,
 #page-content .creditButtonStandalone p a {
    color: var(--special-btn-color);
    text-decoration: none;
}
 
 #page-content .creditButton p a {
    border-left: 0;
}
 
 #page-content .creditButtonStandalone p a {
    background: var(--rate-bar-bg);
    border-radius: 0;
    box-shadow: none;
}
 
 #page-content .rate-box-with-credit-button .fa-info:hover,
 #page-content .creditButtonStandalone p a:hover {
    color: var(--credit-btn-hover-color);
}
 
 #page-content .modalbox {
    border-radius: 0;
    box-shadow: none;
}
 
/* ==== FORMATTING | [GENERAL] ==== */
 h1, h2, h3, h4, h5, h6 {
    font-family: var(--header-font);
}
 
 h1 {
    color: var(--accent-color);
}
 
 hr {
    height: 0;
    margin: 1em 0;
    background: 0;
    border-top: 1px solid var(--special-border);
}
 
 *, a, span {
 /* No Line Breaks Mid-Word */
    word-break: normal;
}
 
 li, p {
    text-underline-offset: 30%;
}
 
 a {
    color: var(--link-color);
}
 
/* ==== IMAGE BLOCK ==== */
/* == STANDARD == */
 .scp-image-block.block-right {
    margin: 0 0 1em 2em;
    box-shadow: none;
}
 
/* == CLASSIC == */
 .classic-image-block {
    float: right;
    width: 300px;
    margin: 0 0 1em 2em;
    text-align: center;
}
 
/* ==== TABLE STYLING ==== */
 table.wiki-content-table td {
    background-color: var(--fill-bg);
}
 
/* ==== YUI TABS ==== */
 .yui-navset .yui-nav a,
 .yui-navset .yui-navset-top .yui-nav a {
    /* ==== Tab Background Colour | [UNSELECTED] ==== */
    background-color: var(--fill-bg);
    /* ==== */
    background-image: none;
}
 
 .yui-navset .yui-nav a:hover,
 .yui-navset .yui-nav a:focus {
    /* ==== Tab Background Colour | [HOVER] ==== */
    background-color: var(--tab-hover-bg);
    /* ==== */
    background-image: none;
}
 
 .yui-navset .yui-nav .selected a,
 .yui-navset .yui-nav .selected a:focus,
 .yui-navset .yui-nav .selected a:hover {
    /* ==== Tab Background Colour | [SELECTED] ==== */
    background-color: var(--tab-bg);
    /* ==== */
    background-image: none;
}
 
/* ======== MOBILE BREAKPOINT ======== */
 @media (max-width: 767px) {
     #side-bar .side-block {
     background-color: var(--fill-bg);
    }
 
     #header,
     .mobile-top-bar {
     max-width: 95%;
    }
 
     .mobile-top-bar {
     left: 0;
    }
}
 
#search-top-box-input {
    background-color: #ffffff;
}
 
#search-top-box-input:hover, #search-top-box-input:focus {
    background-color: #e4e4e4;
}

---

‡ Ліцензування / Цитування

Цитувати цю сторінку як:

"Класична тема SCP", автор: Lt Flops, сторінка розміщена на Англійська філія SCP, джерело — https://scp-wiki.wikidot.com/theme:classic. Переклад: murzei_chaos. Ліцензовано за CC-BY-SA.

За більш докладною інформацією дивиться посібник з ліцензування.
Більше інформації стосовно ліцензій

Ім'я файлу: classic_body_bg.png
Автор: Gabrys
Ліцензія: Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)
Джерело: Wikidot

Ім'я файлу: base_image_frame.png
Автор: Lt Flops
Ліцензія: Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)
Джерело: Self

Ім'я файлу: scp_foundation_logo.png
Автор: far2
Ліцензія: Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)
Джерело: Сайт Фонду SCP

За більш докладною інформацією стосовно ліцензій щодо контенту цієї вікі звертайтесь до переліку ліцензованого контенту (англійською).