未开基主题版式

黑色标记笔主题版式 » 黑色标记笔主题中心 » 未开基主题版式

主题颜色

Charade--gray-monochrome(48, 48, 64)

Gulf Stream--medium-accent(139, 179, 180)

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

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

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

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

Santas Grey--light-gray-monochrome(160, 160, 180)

Snuff--pale-gray-monochrome(220, 220, 240)

{$subcolor3-name}{$subcolor3-variable}{$subcolor3-info}

Half Baked--pale-accent(140, 202, 202)

Eden--dark-accent(33, 40, 78)

{$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}

使用方法

注意：这是一个基于黑色标记笔的主题版式。若你想使用此版式，你还需要导入黑色标记笔版式。点击这里了解更多。

在你的作品开头添加如下语法以应用此版式：

[[include :scp-wiki-cn:theme:black-highlighter-theme]]
[[include :scp-wiki-cn:theme:foundless]]

示例

由 stephlynch 制作的“未建立”标志

可通过五个连字符“-----”创建水平分割线。若它未被放在其他部件（诸如引用块）中，则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。

标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建。

+ 标题

此为分页（tab view）。

这是一个引用块，在一行字的起始处加上“> ”来创建。

更多文字

一条分割线

嵌套引用块

以及更多¹

这是	表格
你应该老早	就知道怎么
做这个了吧

页眉、标题及正文字体为 Inter / Noto Sans SC。
等宽字为 Recursive / Noto Serif SC。

代码

▼ 显示代码

▲ 隐藏代码

/*
    Foundless Theme
    [2020 Wikidot Theme]
     Created by Greyve
     Logo by stephlynch
*/
@supports(display: grid) {
/* ROOT - Header &amp; General Recoloring */
    :root {
    /* Intro */
        --theme-base: "nuscp";
        --theme-id: "foundless";
        --theme-name: "Foundless Theme";
 
    /* Header */
        --logo-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Afoundless/unfounded.gif");
        --header-title: "Unfounded";
        --header-subtitle: "Untainted by the Foundation";
 
    /* Colors */
        --pale-gray-monochrome: 220, 220, 240; /* Light Grey */
        --light-gray-monochrome: 160, 160, 180; /* Accent Light Gray */
        --gray-monochrome: 48, 48, 64; /* Gray */
        --dark-gray-monochrome: 48, 48, 64; /*Gray */
 
        --pale-accent: 140, 202, 202; /* Pale Blue*/
        --bright-accent: 206, 233, 234; /* Light Blue*/
        --medium-accent: 139, 179, 180; /* Blue */
        --dark-accent: 68, 92, 109; /* Dark Blue */
        --newpage-color: 135, 158, 176; /* Grey Blue */
 
    /* Menu Colors */
        --swatch-menubg-color: var(--gray-monochrome);
        --swatch-menubg-light-color: var(--pale-gray-monochrome);
        --swatch-menubg-medium-color: var(--light-gray-monochrome);
        --swatch-menubg-medium-dark-color: var(--black-monochrome);
        --swatch-menubg-dark-color: var(--dark-gray-monochrome);
        --swatch-menubg-black-color: var(--black-monochrome);
        --swatch-menubg-hover-color: var(--gray-monochrome);
        --swatch-menutxt-dark-color: var(--dark-accent);
        --swatch-menutxt-light-color: var(--white-monochrome);
        --swatch-border-color: var(--black-monochrome);
 
    /* Link Colors */
      --link-color: var(--medium-accent);
      --visited-link-color: var(--dark-accent);
      --hover-link-color: var(--bright-accent);
 
    /* Rating Module Colors */
        --rating-module-text-color: var(--black-monochrome);
 
    /* Header Colors */
      --swatch-topmenu-border-color: var(--light-gray-monochrome);
      --swatch-topmenu-bg-color: var(--light-gray-monochrome);
 
    /* Navbar Shadow */
        --gradient-background:
            linear-gradient(
                to bottom,
                rgba(var(--background-gradient-color), 0.5) 0,
                rgba(var(--background-gradient-color), 0)
                    var(--background-gradient-distance)
            );
         --background-gradient-color: var(--dark-accent);
         --background-gradient-distance: 15rem;
 
        --header-gradient-color-bottom: 68, 92, 109;
        --header-gradient-color-middle: 135, 158, 176;
        --header-gradient-color-top: 154, 180, 181;
 
        --diagonal-stripes: repeating-linear-gradient(
            135deg,
            hsla(0, 0%, 100%, 0),
            hsla(0, 0%, 100%, 0) 0.25vh,
            rgba(88, 88, 88, 0.1) 0.35vh,
            rgba(88, 88, 88, 0.2) 0.5vh
        );
    }
 
    :root:lang(cn) {
    /* Header */
        --header-title: "未建立";
        --header-subtitle: "不受基金会所染";
    }
 
    #header {
        /* ===HEADER ELEMENTS=== */
            /* ===SEARCH ELEMENT=== */
                /* Focus is when the search box has been clicked on */
        --search-icon-focus-color: var(--swatch-alternate-color);
    }
 
    #top-bar {
            /* ===DROPDOWN MENU=== */
        --dropdown-links-hover-color: var(--swatch-text-tertiary-color);
    }
 
    #side-bar {
            /* ===SIDEBLOCK MENU=== */
        --sideblock-heading-border-color: var(--dark-accent);
        --sideblock-heading-bg-color: var(--medium-accent),0.25;
        --sideblock-heading-text-color: var(--swatch-text-tertiary-color);
 
        --sidebar-links-hover-bg-color: var(--light-gray-monochrome);
    }
 
        /* ===FOOTER=== */
    #footer {
        --footer-link-hover-color: var(--swatch-text-tertiary-color);
    }
 
        /* ===LICENSE AREA=== */
    #license-area {
        --license-link-hover-color: var(--swatch-text-tertiary-color);
    }
 
    #main-content {
        /* ===MAIN CONTENT UI ELEMENTS */
            /* ===UI ICONS=== */
                /* ===PAGE OPTIONS ICONS=== */
        --ui-icon-hover-color: var(--dark-accent);
 
                /* ===TEXT EDITOR ICONS=== */
        --editor-icon-color: var(--swatch-menutxt-dark-color);
        --editor-icon-hover-bg: var(--dark-accent);
 
            /* ===TABS=== */
        --tabs-txt: var(--swatch-text-tertiary-color);
        --tabs-hover-bg: var(--swatch-primary-darkest);
        --tabs-hover-txt: var(--swatch-text-secondary-color);
        --tabs-selected-bg: var(--swatch-primary-darker);
        --tabs-selected-txt: var(--swatch-text-secondary-color);
        --tabs-selected-outline: var(--swatch-primary-darker);
 
            /* ===TABLES=== */
        --tables-header-bg: var(--light-gray-monochrome);
 
            /* Color for special .colorbar-quote blockquote class */
        --blockquote-colorbar-color: var(--swatch-primary-darker), 1;
 
            /* ===PAGE TAGS=== */
        --pagetags-text-hover-color: var(--swatch-primary-darkest);
    }
 
        /* ===GLOBAL ELEMENTS=== */
    :root {
            /* ===UI BUTTONS=== */
        --ui-button-bg: var(--swatch-alternate-color);
        --ui-button-txt: var(--swatch-text-secondary-color);
        --ui-button-hover-bg: var(--swatch-primary-darkest);
        --ui-button-hover-outline: var(--swatch-primary-darkest);
 
            /* ===FOOTNOTES HOVER BLOCK=== */
        --hoverblock-bg: var(--swatch-alternate-color);
    }
 
    ::selection {
        background: rgba(var(--swatch-primary-darkest), 1);
        color: rgb(var(--swatch-primary));
    }
 
    /* Header Logo Compensation */
    #header {
        background-position: left 0 top 0;
        background-size: var(--header-height-on-desktop) auto;
    }
 
    /* Page Title */
    #page-title {
        border-color: rgb(var(--dark-gray));
        color: rgb(var(--medium-accent));
    }
 
    /* Page Rating Module */
    .page-rate-widget-box {
        border-color: rgb(var(--pale-gray-monochrome));
        background: linear-gradient(to top,
         rgba(var(--pale-gray-monochrome),1) 0%,
         rgba(var(--pale-gray-monochrome), 1) 100%);
    }
 
    #page-content .rate-box-with-credit-button {
        border-color: rgb(var(--pale-gray-monochrome));
        background: linear-gradient(to top,
         rgba(var(--pale-gray-monochrome),1) 0%,
         rgba(var(--pale-gray-monochrome), 1) 100%);
    }
    #page-content .rate-box-with-credit-button > .creditButton > p > a::before {
        background-color: rgb(var(--pale-gray-monochrome));
    }
 
    #page-content .rate-box-with-credit-button > .creditButton:hover {
        background: rgba(var(--bright-accent), 0.8);
    }
 
    #page-content .modalbox {
         border-radius: 0;
         background: rgb(var(--pale-gray-monochrome)) !important;
         box-shadow: 0 2px 6px rgba(var(--bright-accent), 0.5);
         color: rgb(var(--pale-gray-monochrome));
    }
 
    /* Ayers' Info Bar */
    .info-container {
        --barColour: rgb(var(--dark-accent));
    }
}

:root {
    --light-gray-monochrome: 160, 160, 180;
    --bright-accent: 206, 233, 234;
    --medium-accent: 139, 179, 180;
    --dark-accent: 68, 92, 109;
    --swatch-menutxt-dark-color: var(--dark-accent);
}
::selection {
    background: rgba(var(--swatch-primary-darkest), 1);
    color: rgb(var(--swatch-primary));
}
.side-block {
    --sideblock-heading-border-color: var(--dark-accent);
    --sideblock-heading-bg-color: var(--medium-accent),0.25;
    --sideblock-heading-text-color: var(--swatch-text-tertiary-color);
    --sidebar-links-hover-bg-color: var(--light-gray-monochrome);
}

+ Show component code

- Hide component code

#side-bar {
    /* ===SECONDARY & TERTIARY COLORS=== */
    /* Editing these will edit a vast majority of theme elements. Useful for making dark themes */
 
    /* Colors for Secondary & Tertiary items like Blockquote and YUI Tabs */
    --swatch-secondary-color: var(--swatch-menubg-dark-color);
    --swatch-tertiary-color: var(--swatch-menubg-medium-color);
    --swatch-alternate-color: var(--swatch-menubg-light-color);
 
    /* Text Colors for Secondary & Tertiary items like Sidebar Headers and Top-Bar Menu Text */
    --swatch-text-secondary-color: var(--swatch-menutxt-dark-color);
    --swatch-text-tertiary-color: var(--swatch-menutxt-light-color);
 
    /* ===SIDE-BAR ELEMENTS=== */
 
    /* ===SIDE-BAR GENERAL=== */
    --sidebar-bg-color: var(--swatch-menubg-dark-color);
    --sidebar-resources-bg-color: 0, 0, 0, 0;
    --sidebar-media-bg-color: 0, 0, 0, 0;
 
    /* ===SIDEBLOCK MENU=== */
    --sideblock-heading-border-color: var(--bright-accent);
    --sideblock-heading-bg-color: 0, 0, 0, 0;
    /* Transparent */
    --sideblock-heading-text-color: var(--swatch-text-tertiary-color);
 
    /* ===MENU-ITEMS=== */
    --sidebar-border-color: var(--swatch-primary), 0.08;
    --sidebar-subtest-color: var(--swatch-text-tertiary-color);
 
    --sidebar-links-text: var(--swatch-text-tertiary-color);
    --sidebar-links-hover-bg-color: var(--bright-accent);
    --sidebar-links-hover-text-color: var(--swatch-text-tertiary-color);
 
    /* ===SIDEBAR COLLAPSIBLES=== */
    /*Folded Colors */
    --sidebar-collapsible-fld-link-bg: var(--swatch-primary), 0.25;
    --sidebar-collapsible-fld-link-color: var(--swatch-text-tertiary-color);
    --sidebar-collapsible-fld-link-hover-color: var(--swatch-text-tertiary-color);
    --sidebar-collapsible-fld-arrow-hover-color: var(--swatch-text-tertiary-color);
 
    /*Unfolded Colors */
    --sidebar-collapsible-ufld-link-bg: var(--swatch-primary-darker), 0.25;
    --sidebar-collapsible-ufld-link-color: var(--swatch-text-tertiary-color);
    --sidebar-collapsible-ufld-link-hover-color: var(--swatch-text-tertiary-color);
    --sidebar-collapsible-ufld-arrow-hover-color: var(--swatch-text-tertiary-color);
 
    /* Unfolded Body Colors */
    --sidebar-collapsible-link-color: var(--swatch-text-tertiary-color);
    --sidebar-collapsible-link-hover-color: var(--swatch-text-tertiary-color);
 
    scrollbar-color:
        rgba(var(--swatch-primary-darker), 0.1)
        /* Thumb */
        rgba(var(--swatch-secondary-color), 0.05);
    /* Track */
 
    border-color: rgba(var(--swatch-secondary-color), 0.4);
}
 
/* Hover Scrollbar Behavior */
#side-bar:hover,
#side-bar:active {
    scrollbar-color:
        rgb(var(--swatch-primary-darker), 1)
        /* Thumb */
        rgb(var(--swatch-menubg-dark-color), 1);
    /* Track */
}
 
#side-bar:focus-within {
    scrollbar-color:
        rgb(var(--swatch-primary-darker), 1)
        /* Thumb */
        rgb(var(--swatch-menubg-dark-color), 1);
    /* Track */
}
 
#side-bar::-webkit-scrollbar-track {
    background-color: rgba(var(--swatch-tertiary-color), 0.8);
}
 
#side-bar::-webkit-scrollbar,
#side-bar::-webkit-scrollbar-thumb,
#side-bar::-webkit-scrollbar-corner {
    background-color: rgba(var(--swatch-menubg-dark-color), 0);
}
 
#side-bar .side-block.media a:-webkit-any-link {
    background: rgba(var(--swatch-menubg-light-color), 0.75) !important;
}
 
#side-bar .side-block.media a:-moz-any-link {
    background: rgba(var(--swatch-menubg-light-color), 0.75) !important;
}
 
#side-bar .side-block.media a:any-link {
    background: rgba(var(--swatch-menubg-light-color), 0.75) !important;
}
 
#side-bar .side-block.media a::before {
    background: rgb(var(--social-color));
}
 
#side-bar .side-block.media a[href*="tiktok"]::before,
#side-bar .side-block.media a[href*="tiktok"]::after {
    transition:
        background 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background-color 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background-image 200ms cubic-bezier(0.4, 0, 0.2, 1),
        -webkit-clip-path 200ms cubic-bezier(0.4, 0, 0.2, 1);
    transition:
        clip-path 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background-color 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background-image 200ms cubic-bezier(0.4, 0, 0.2, 1);
    transition:
        clip-path 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background-color 200ms cubic-bezier(0.4, 0, 0.2, 1),
        background-image 200ms cubic-bezier(0.4, 0, 0.2, 1),
        -webkit-clip-path 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
 
#side-bar .side-block.media a[href*="tiktok"]:hover::before {
    --clip-path:
        polygon(-15% 0,
            115% 0,
            100% 100%,
            0 100%
        );
}
 
#side-bar .side-block.media a[href*="tiktok"]:hover::before,
#side-bar .side-block.media a[href*="tiktok"]:active::before {
    --clip-path:
        polygon(-15% 0,
            115% 0,
            100% 100%,
            0 100%
        );
    background-image: var(--tiktok-icon-gradient);
    background-size: contain;
}
 
#side-bar .side-block.media a[href*="tiktok"]:focus-within::before {
    --clip-path:
        polygon(-15% 0,
            115% 0,
            100% 100%,
            0 100%
        );
    background-image: var(--tiktok-icon-gradient);
    background-size: contain;
}
 
#side-bar .side-block.media a[href*="tiktok"]::after {
    --clip-path:
        polygon(0 0,
            0 0,
            0 100%,
            0 100%
        );
    background: rgba(var(--swatch-menubg-light-color), 0.75) !important;
}
 
#side-bar .side-block.media a[href*="tiktok"]:hover::after,
#side-bar .side-block.media a[href*="tiktok"]:active::after {
    --clip-path:
        polygon(-15% 0,
            115% 0,
            100% 100%,
            0 100%
        );
    background: rgba(var(--swatch-menubg-light-color), 0.75) !important;
}
 
#side-bar .side-block.media a[href*="tiktok"]:focus-within::after {
    --clip-path:
        polygon(-15% 0,
            115% 0,
            100% 100%,
            0 100%
        );
    background: rgba(var(--swatch-menubg-light-color), 0.75) !important;
}
 
#side-bar .side-block.media a img {
    -webkit-filter: drop-shadow(0 0 0 rgba(var(--swatch-alternate-color), 0));
            filter: drop-shadow(0 0 0 rgba(var(--swatch-alternate-color), 0));
    transition: -webkit-filter 200ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: filter 200ms cubic-bezier(0.4, 0, 0.2, 1);
    transition: filter 200ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-filter 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
 
#side-bar .side-block.media a:hover img,
#side-bar .side-block.media a:active img {
    -webkit-filter: drop-shadow(0.1875rem 0.1875rem 0 rgb(var(--swatch-alternate-color)));
            filter: drop-shadow(0.1875rem 0.1875rem 0 rgb(var(--swatch-alternate-color)));
}
 
#side-bar .side-block.media a:focus-within img {
    -webkit-filter: drop-shadow(0.1875rem 0.1875rem 0 rgb(var(--swatch-alternate-color)));
            filter: drop-shadow(0.1875rem 0.1875rem 0 rgb(var(--swatch-alternate-color)));
}
 
html:not(:lang(cn)) div.scpnet-interwiki-wrapper p::before {
    box-shadow: inherit;
}
 
#side-bar iframe.scpnet-interwiki-frame:not(:lang(cn)) {
    -webkit-filter: invert(1);
            filter: invert(1);
}
 
#side-bar .scpnet-interwiki-wrapper:not(:lang(cn))::before,
#side-bar .scpnet-interwiki-wrapper:not(:lang(cn)) p::before,
#side-bar .scpnet-interwiki-wrapper:not(:lang(cn)) p::after {
    background-color: rgb(var(--swatch-menubg-dark-color));
}
 
#side-bar .scpnet-interwiki-wrapper:not(:lang(cn))::before {
    mix-blend-mode: lighten;
}

<html>
    <head>
    </head>
    <body>
        <script type="text/javascript">
        function sendStyle() {
            try {
                window.parent.window.interwikiFrame.bhlDark();
            } catch(e) {}
        }
        sendStyle();
        </script>
    </body>
</html>

版式

页面版本: 13, 最后编辑于: 10 Oct 2021 14:35

编辑评分 (+13) 标签讨论 (8) 历史记录附件打印网站工具 + 选项

SCP基金会

控制，收容，保护

主题颜色

使用方法

注意：这是一个基于黑色标记笔的主题版式。若你想使用此版式，你还需要导入黑色标记笔版式。点击这里了解更多。

示例

1 级标题

2 级标题

3 级标题

4 级标题

5 级标题

6 级标题

代码

其它有趣的网站

The SCP Sandbox

Marble Hornets

สถาบัน SCP

Rhye's of Wiki