Theme Tổ Chức SCP Trung Quốc In-Universe

Bảng Màu Theme

Tundora--gray-monochrome(72,66,66)

Vermilion--bright-accent(203,90,204)

{$color3-name}{$color3-variable}{$color3-info}

{$color4-name}{$color4-variable}{$color4-info}

{$color5-name}{$color5-variable}{$color5-info}

{$color6-name}{$color6-variable}{$color6-info}

Gallery--pale-gray-monochrome(234,224,224)

Nobel--light-gray-monochrome(160,150,150)

Bright Red--medium-accent(171,0,5)

Rosewood--dark-accent(80,0,2)

{$subcolor5-name}{$subcolor5-variable}{$subcolor5-info}

{$subcolor6-name}{$subcolor6-variable}{$subcolor6-info}

{$subcolor7-name}{$subcolor7-variable}{$subcolor7-info}

{$subcolor8-name}{$subcolor8-variable}{$subcolor8-info}

{$subcolor9-name}{$subcolor9-variable}{$subcolor9-info}

{$subcolor10-name}{$subcolor10-variable}{$subcolor10-info}

{$subcolor11-name}{$subcolor11-variable}{$subcolor11-info}

{$subcolor12-name}{$subcolor12-variable}{$subcolor12-info}

Logo chi nhánh Trung Quốc

Hướng dẫn

Lưu ý: Đây là theme dựa trên Black Highlighter. Bạn sẽ cần import cả theme Black Highlighter để sử dụng theme này. Để tìm hiểu thêm bấm vào đây.

Để sử dụng theme này, thêm đoạn sau vào bài viết:

[[include :scp-vn:theme:black-highlighter-theme]]
[[include :scp-vn:theme:ch-scp-theme]]

Nếu đang dùng Tiêu Đề Giữa hãy sử dụng theo cách này:

[[include :scp-vn:theme:black-highlighter-theme]]
[[include :scp-vn:theme:ch-scp-theme]]
[[include :scp-vn:component:centered-header-bhl |ch-scp=--]]]

Ví dụ

Một dòng kẻ ngang có thể được tạo với 5 dấu gạch ngang "-----" và giãn ra cả trang nếu nó không được đặt trong bất kì thứ gì (ví dụ một blockquote). Các đường chia phần của tài liệu là các dòng kẻ ngang.

Đề mục có thể được tạo bằng cách đặt giữa một và sáu dấu cộng "+" ở đầu dòng

+ Đề mục

Đây là tab.

Đây là blockquote, tạo bằng cách đưa "> " vào đầu mỗi dòng.
Thêm chữ

Đó là một dòng kẻ ngang

Blockquote trong blockquote

Đây là cái	bảng
Bạn cần biết	cách làm bảng
rồi chứ

+ Mã nguồn

- Ẩn mã nguồn

/* Fonts */
 
@import url("https://use.typekit.net/rbw6esf.css");
 
/* All Vars Used */
@supports(display:grid) {
    :root {
     /* S-CSS-P Integration */
     /* If you're making a new CSS theme, please include the following three variables at minimum. */
     --theme-base: "black-highlighter";
     /* must be either "nuscp" or "sigma9" */
     --theme-id: "chscp-theme";
     /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
     --theme-name: "Theme BHL Trung Quốc";
     /* set this to your theme's full name */
 
     /* Header */
     --logo-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Ach-scp-theme/scpchlogonotagline.png");
     --header-title: "Tổ Chức";
     --header-subtitle: " ";
 
     /* Typefaces */
     --header-font: great-primer-sc, 'Poppins', sans-serif;
     --title-font: great-primer-sc, 'Poppins', sans-serif;
     --mono-font: "PT Mono", "Andale Mono", "Courier New", Courier, monospace;
 
     /* Standard Colors */
     --white-monochrome: 252, 252, 252;
     /* white */
     --pale-gray-monochrome: 234, 224, 224;
     /* v light gray for blockquotes and stuff */
     --light-gray-monochrome: 160, 150, 150;
     /* light accent gray for login status */
     --gray-monochrome: 72, 66, 66;
     /* gray */
     --dark-gray-monochrome: 0, 0, 0;
     /* dark accent gray for sidebar background */
     --black-monochrome: 0, 0, 0;
     /* black */
     --bright-accent: 195, 7, 7;
     /* bright red */
     --medium-accent: 171, 0, 5;
     /* medium red */
     --dark-accent: 80, 0, 2;
     /* dark red */
     --newpage-color: 210, 74, 32;
     /* pale orange */
 
     /* Primary Theme Colors */
     --swatch-background: var(--white-monochrome);
     --swatch-primary: var(--bright-accent);
     --swatch-primary-darker: var(--medium-accent);
     --swatch-primary-darkest: var(--dark-accent);
     /* Primary Text Colors */
     --swatch-text-dark: var(--black-monochrome);
     --swatch-text-light: var(--white-monochrome);
     --swatch-important-text: var(--bright-accent);
 
     /* Primary Menu Colors */
     --swatch-menubg-color: var(--white-monochrome);
     --swatch-menubg-light-color: var(--pale-gray-monochrome);
     --swatch-menubg-medium-color: var(--light-gray-monochrome);
     --swatch-menubg-medium-dark-color: var(--gray-monochrome);
     --swatch-menubg-dark-color: var(--dark-gray-monochrome);
     --swatch-menubg-black-color: var(--black-monochrome);
     --swatch-menubg-hover-color: var(--black-monochrome);
     --swatch-menutxt-dark-color: var(--black-monochrome);
     --swatch-menutxt-light-color: var(--white-monochrome);
     --swatch-border-color: var(--black-monochrome);
     /* Primary Header Colors */
     --swatch-headerh1-color: var(--white-monochrome);
     --swatch-headerh2-color: var(--white-monochrome);
     --swatch-topmenu-border-color: var(--black-monochrome);
     --swatch-topmenu-bg-color: var(--gray-monochrome);
 
     --rating-module-button-color: var(--black-monochrome);
     --rating-module-text-color: var(--swatch-menutxt-dark-color);
 
     /* Header Gradients */
 
     --gradient-header: linear-gradient(to top,
     rgba(var(--bright-accent), 0.97) 0%,
     rgb(var(--medium-accent)) 70%,
     rgb(var(--medium-accent)) 100%);
     --gradient-topmenu: linear-gradient(to bottom,
     white 0%,
     white var(--header-height-on-desktop),
     rgba(var(--swatch-topmenu-border-color), 0.05) var(--header-height-on-desktop),
     rgba(var(--swatch-topmenu-bg-color), 0.05) calc(var(--header-height-on-desktop) + 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 0.05) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 0.05) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-border-color), 0.05) 100%);
     --gradient-topmenu-mobile: linear-gradient(to bottom,
     rgba(208, 208, 208, 1) 0,
     rgba(217, 217, 217, 1) 0.125rem,
     rgba(217, 217, 217, 1) calc(3rem - 0.125rem),
     rgba(217, 217, 217, 1) calc(3rem - 0.125rem),
     rgba(208, 208, 208, 1) 3rem);
     --diagonal-stripes: initial;
     --gradient-sidemenu-header: linear-gradient(10deg,
     rgba(var(--dark-accent), 0.85) 0%,
     rgba(var(--bright-accent), 0.95) 100%);
     --gradient-background: linear-gradient(to bottom,
     rgba(var(--background-gradient-color), 1) calc(calc(0 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.987) calc(calc(0.8 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.951) calc(calc(2.9 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.896) calc(calc(6.4 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.825) calc(calc(11 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.741) calc(calc(16.6 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.648) calc(calc(23.1 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.55) calc(calc(30.4 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.45) calc(calc(38.3 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.352) calc(calc(46.7 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.259) calc(calc(55.4 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.175) calc(calc(64.4 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.104) calc(calc(73.5 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.049) calc(calc(82.5 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0.013) calc(calc(91.4 / 100) * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color), 0) calc(calc(100 / 100) * var(--background-gradient-distance)));
     --header-background-image-size: 100% var(--header-height-on-desktop);
 
     /* Spacing Measurements */
     --offset-from-page-top: 0.75rem;
     /* space between the top of the page and the start of the header */
     --body-width-on-desktop: 44.25rem;
     --sidebar-width-on-desktop: calc(var(--base-font-size)*16);
     --sidebar-width-on-mobile: 14rem;
     --scrollbar-width: 0.5625rem;
     --border-styling: solid 0.0625rem rgb(var(--swatch-border-color));
     --border-radius-width: 0.0625rem;
 
     /* Box-Shadow 1px Borders */
     --box-border-bottom: 0 0.0625rem 0 0 rgb(var(--swatch-border-color));
     --box-border-top: 0 -0.0625rem 0 0 rgb(var(--swatch-border-color));
     --box-border-left: -0.0625rem 0 0 0 rgb(var(--swatch-border-color));
     --box-border-right: 0.0625rem 0 0 0 rgb(var(--swatch-border-color));
     --box-border-all: 0 0 0 0.0625rem rgb(var(--swatch-border-color));
 
     /* Sidebar */
     --sidebar-transition-timing: 0.5s ease-in-out 0.1s;
     --sidebar-internal-border-thickness: 0.125rem;
 
     --background-gradient-color: 215, 215, 215;
     --background-gradient-distance: 40rem;
    }
 
    a,
    a:active,
    a:visited {
     color: rgb(var(--swatch-primary-darker));
    }
 
    #header {
     background-position: left .75rem top .65rem;
     background-size: auto 6.375rem;
     -webkit-filter: unset;
     filter: unset;
    }
 
    #header h1 a {
     margin-left: 7.75rem;
    }
 
    #header h1 a::before {
     text-shadow: unset;
    }
 
    #header h2 {
     background: url('https://scp-wiki.wdfiles.com/local--files/theme%3Ach-scp-theme/scpchtag.png');
     background-repeat: no-repeat;
     background-clip: border-box;
     background-size: contain;
     top: 4.5rem;
     left: 8rem;
     height: 2rem;
    }
 
    #top-bar {
     margin: var(--header-height-on-desktop) 0 1.75rem 0;
     height: 1.875rem;
     font-size: calc(var(--base-font-size) * .75);
    }
 
    #top-bar div.top-bar>ul>li>a,
    #top-bar div.mobile-top-bar>ul>li>a {
     color: rgb(var(--swatch-menutxt-dark-color)) !important;
     font-family: var(--header-font);
     text-transform: uppercase;
    }
 
    #top-bar div.top-bar>ul>li:hover>a,
    #top-bar div.top-bar>ul>li:focus-within>a,
    #top-bar div.mobile-top-bar>ul>li:hover>a,
    #top-bar div.mobile-top-bar>ul>li:focus-within>a {
     color: rgb(var(--swatch-menutxt-light-color)) !important;
    }
 
    #top-bar div.top-bar>ul>li:hover,
    #top-bar div.top-bar>ul>li:focus-within,
    #top-bar div.mobile-top-bar>ul>li:hover,
    #top-bar div.mobile-top-bar>ul>li:focus-within {
     background-color: rgba(var(--swatch-primary-darker), 0.93);
     background-image: url('https://scp-wiki.wdfiles.com/local--files/theme%3Ach-scp-theme/subtle_white_mini_waves.png');
     background-blend-mode: overlay;
     background-size: auto 5.625rem;
    }
 
    #top-bar div.top-bar>ul>li>ul,
    #top-bar div.mobile-top-bar>ul>li>ul {
     margin-top: 1.875rem;
     background: rgba(var(--swatch-primary-darker), 0.93);
     background-image: url('https://scp-wiki.wdfiles.com/local--files/theme%3Ach-scp-theme/subtle_white_mini_waves.png');
     background-blend-mode: overlay;
     background-size: auto 5.625rem;
    }
 
    #top-bar div.top-bar>ul>li>a::before {
     height: calc(0.0625rem * 3);
    }
 
    #top-bar div.top-bar>ul>li>a::after {
     height: calc(0.0625rem * 2);
    }
 
    #top-bar div.top-bar>ul>li>a::before,
    #top-bar div.top-bar>ul>li>a::after {
     background-color: rgba(var(--swatch-border-color), 1);
    }
 
    #top-bar div.top-bar>ul>li>ul>li>a,
    #top-bar div.mobile-top-bar>ul>li>ul>li>a {
     font-weight: 600;
     font-size: calc(var(--base-font-size) * 0.9);
    }
 
    #skrollr-body::before {
     background-image:
     linear-gradient(to bottom,
     rgba(var(--bright-accent), 0.5) 0,
     rgba(var(--bright-accent), 0.25) 10rem,
     rgba(var(--white-monochrome), 1) 22rem,
     rgba(var(--white-monochrome), 1) 100%);
     background-size: 100% 100%;
     background-repeat: no-repeat;
     background-position: center top var(--final-header-height-on-desktop);
     content: " ";
     width: 100%;
     height: 100%;
     position: absolute;
     pointer-events: none;
     z-index: -2;
    }
 
    #container-wrap-wrap::before {
     content: " ";
     width: 100%;
     height: 25%;
     position: absolute;
     top: var(--final-header-height-on-desktop);
     background: url('https://scp-wiki.wdfiles.com/local--files/theme%3Ach-scp-theme/subtle_white_mini_waves.png');
     background-blend-mode: overlay;
     background-size: 5.625rem;
     background-repeat: repeat;
     background-position: 0 0;
     pointer-events: none;
     z-index: -1;
    }
 
    div#container-wrap {
     background-image: unset;
    }
 
    div#container-wrap::before {
     background-image: url('https://scp-wiki.wdfiles.com/local--files/theme%3Ach-scp-theme/subtle_white_mini_waves.png');
     background-size: auto;
     background-repeat: repeat;
     background-position: 0 0;
     background-blend-mode: soft-light;
     content: " ";
     height: var(--final-header-height-on-desktop);
     width: 100%;
     position: absolute;
     top: 0;
     left: 0;
     pointer-events: none;
    }
 
    #side-bar {
     overflow-y: auto;
     overflow-x: hidden;
    }
 
    #side-bar .close-menu::before {
     font-family: var(--title-font) !important;
    }
 
    #side-bar .heading,
    #side-bar .side-block>.collapsible-block:nth-child(1) .collapsible-block-folded {
     letter-spacing: .15em;
    }
 
    #side-bar .heading p,
    #side-bar .side-block>.collapsible-block .collapsible-block-link {
     font-family: var(--header-font);
     text-shadow: unset;
    }
 
    .code {
     font-size: calc(var(--base-font-size) * 0.8);
    }
 
    textarea,
    input {
     font-family: var(--body-font);
    }
 
    #search-top-box-form input[type="submit"] {
     font-size: calc(var(--base-font-size) * 0.9);
    }
 
    #page-title,
    .meta-title,
    .meta-title span {
     font-family: var(--header-font);
     color: rgb(255, 237, 6);
    }
 
    /* Sky Sermon Nav CSS */
 
    .skysermon-nav {
     --text-shadow: rgba(var(--black-monochrome), 0.35);
     --box-shadow: rgb(var(--gray-monochrome));
     --border-color: rgb(var(--newpage-color));
     color: rgb(var(--white-monochrome));
     text-shadow: 0.0625rem 0.0625rem 0.125rem var(--text-shadow);
     border-radius: 0.0625rem;
     border: double 0.188rem var(--border-color);
     background-color: rgb(var(--bright-accent));
     box-shadow: 0.09375rem 0.09375rem 0.188rem var(--box-shadow);
     padding: 0 0.125rem;
     margin: 0.625rem 0 0.938rem;
     margin-bottom: 1.250rem;
    }
 
    .skysermon-nav a {
     color: rgb(255, 237, 6);
     display: inline-block;
     position: relative;
     width: 100%;
     height: 100%;
     padding-top: 0.45em;
     padding-bottom: 0.35em;
    }
 
    .skysermon-nav a::before {
     display: flex;
     position: absolute;
     align-items: center;
     height: 100%;
     font-size: calc(var(--base-font-size) * 1.1);
     line-height: calc(var(--base-font-size) * 0.7);
     font-weight: 800;
     top: 0;
    }
 
    .skysermon-nav .footer-wikiwalk-nav {
     display: flex;
     align-items: center;
     justify-content: center;
     font-weight: 400;
     letter-spacing: 0.025em;
     font-size: 75%;
    }
 
    .skysermon-nav .footer-wikiwalk-nav * {
     line-height: 1em;
    }
 
    .skysermon-nav .footer-wikiwalk-nav .center {
     flex-basis: 8em;
     text-align: center;
    }
 
    .skysermon-nav .footer-wikiwalk-nav .left,
    .skysermon-nav .footer-wikiwalk-nav .right {
     flex-basis: calc(50% - 5em);
     display: inline-flex;
     align-items: center;
     font-size: calc(var(--base-font-size) * 0.8);
     position: relative;
    }
 
    .skysermon-nav .footer-wikiwalk-nav .left {
     text-align: right;
     justify-content: flex-end;
     border-right: 0.0625rem solid rgb(var(--black-monochrome));
     padding-left: 1em;
     padding-right: 0.5em;
     margin: 0.35em 0 0.35em 0.35em;
    }
 
    .skysermon-nav .left>a::before {
     content: "«";
     left: -0.75em;
     transition: left 1s ease-in-out;
     -webkit-animation: bounce-left 1.7s infinite;
     animation: bounce-left 1.7s infinite;
     -webkit-animation-play-state: paused;
     animation-play-state: paused;
    }
 
    .skysermon-nav .left>a:hover::before {
     -webkit-animation-play-state: running;
     animation-play-state: running;
    }
 
    .skysermon-nav .footer-wikiwalk-nav .right {
     text-align: left;
     justify-content: flex-start;
     border-left: 0.0625rem solid rgb(var(--black-monochrome));
     padding-left: 0.5em;
     padding-right: 1em;
     margin: 0.35em 0.35em 0.35em 0;
    }
 
    .skysermon-nav .right>a::before {
     content: "»";
     right: -0.75em;
     transition: left 1s ease-in-out;
     -webkit-animation: bounce-right 1.7s infinite;
     animation: bounce-right 1.7s infinite;
     -webkit-animation-play-state: paused;
     animation-play-state: paused;
    }
 
    .skysermon-nav .right>a:hover::before {
     -webkit-animation-play-state: running;
     animation-play-state: running;
    }
 
    /* Rating Box */
 
    .page-rate-widget-box .rate-points,
    .page-rate-widget-box .rateup,
    .page-rate-widget-box .ratedown,
    .page-rate-widget-box .cancel,
    .page-rate-widget-box .rateup a,
    .page-rate-widget-box .ratedown a,
    .page-rate-widget-box .cancel a {
     font-weight: 400;
    }
 
    @media only screen and (max-width: 56.25rem) {
     #header h1 {
     font-size: calc(var(--base-font-size) * 1.25);
     }
 
     #header h1 a {
     margin-top: calc(0.8rem + var(--offset-from-page-top));
     }
 
     #header h2 {
     height: 1.15rem;
     }
 
     #side-bar {
     left: calc(-17rem - var(--scrollbar-width));
     }
 
     #side-bar:target {
     overflow-x: hidden;
     }
 
     #top-bar>div.mobile-top-bar>div.open-menu>p>a {
     color: rgb(var(--swatch-menutxt-dark-color)) !important;
     }
 
     #skrollr-body:target #side-bar {
     left: 0;
     }
 
     #side-bar:target .close-menu {
     margin-left: calc(15.5rem + 2 * var(--scrollbar-width) + 0.125rem);
     }
 
     #skrollr-body:target #container {
     transform: none;
     }
 
     #skrollr-body:target #container-wrap-wrap {
     overflow: hidden;
     }
 
     #top-bar div.top-bar>ul>li>ul,
     #top-bar div.mobile-top-bar>ul>li>ul {
     transform: translate(-50%, 0);
     display: flex;
     }
 
     #top-bar div.mobile-top-bar>ul>li>ul>li {
     max-height: calc(99vh / 15);
     max-width: calc(98vw + 1px);
     display: flex;
     width: calc(98vw + 1px);
     flex-grow: 2;
     flex-basis: calc(98vw / 2);
     }
 
     #top-bar div.top-bar>ul>li>ul>li>a,
     #top-bar div.mobile-top-bar>ul>li>ul>li>a {
     height: 100%;
     width: 100%;
     line-height: 1em;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: calc(var(--base-font-size) * 0.8);
     }
 
     #top-bar>div.mobile-top-bar>ul>li:nth-child(1)>ul>li:nth-child(1)>a::before,
     #top-bar>div.mobile-top-bar>ul>li:nth-child(1)>ul>li:nth-child(11)>a::before,
     #top-bar>div.mobile-top-bar>ul>li:nth-child(1)>ul>li:nth-child(21)>a::before,
     #top-bar>div.mobile-top-bar>ul>li:nth-child(1)>ul>li:nth-child(31)>a::before,
     #top-bar>div.mobile-top-bar>ul>li:nth-child(1)>ul>li:nth-child(41)>a::before,
     #top-bar>div.mobile-top-bar>ul>li:nth-child(1)>ul>li:nth-child(51)>a::before {
     display: flex;
     align-items: center;
     justify-content: center;
     }
    }
 
    @-webkit-keyframes bounce-left {
     0% {
     left: -0.75em;
     }
 
     50% {
     left: -0.50rem;
     }
 
     100% {
     left: -0.75em;
     }
    }
 
    @keyframes bounce-left {
     0% {
     left: -0.75em;
     }
 
     50% {
     left: -0.50rem;
     }
 
     100% {
     left: -0.75em;
     }
    }
 
    @-webkit-keyframes bounce-right {
     0% {
     right: -0.75em;
     }
 
     50% {
     right: -0.50rem;
     }
 
     100% {
     right: -0.75em;
     }
    }
 
    @keyframes bounce-right {
     0% {
     right: -0.75em;
     }
 
     50% {
     right: -0.50rem;
     }
 
     100% {
     right: -0.75em;
     }
    }
}

theme

sửa đổi trang: 3, chỉnh sửa lần cuối: 25 Dec 2021 05:03

Chỉnh sửa Đánh giá (+1) Tag Bình luận (0) Lịch sử Tệp In Công cụ trang + Lựa chọn

Tổ Chức SCP

Quản thúc, Lưu trữ, Bảo vệ

Bảng Màu Theme

Hướng dẫn

Lưu ý: Đây là theme dựa trên Black Highlighter. Bạn sẽ cần import cả theme Black Highlighter để sử dụng theme này. Để tìm hiểu thêm bấm vào đây.

Ví dụ

Đề mục 1

Đề mục 2

Đề mục 3

Đề mục 4

Đề mục 5

Đề mục 6

Các trang khác:

The Fade: Ultimate Edition

AnalyticsCamp

El Mundo Imaginario del ArchiAlquimista

后室神风特攻队总部