安山岩 版式
Rating: +33

基础信息页面元素玄武岩闪长岩安山岩花岗岩方解石深板岩安山合金黄铜机壳

基础信息

在你的页面开头添加如下代码以应用此版式:

[[include :scp-wiki-cn:theme:andesite]]

Q&A

Q:这是什么?它可以用到哪?

A:这是一个不与任何设定挂钩的美学版式,大量参考并借鉴了玄武岩版式,旨在于我的Safari浏览器1上提供近似的玄武岩体验尝试一种内容完全由div块包裹的页面构成,并且可自定义性与兼容性较差,当前不建议自定义本版式。

安山岩 版式是一个Sigma+版式。

Q:有没有别的?

A:添加了无Saving Page组件和超超超超超好的脚注组件

Q:图片哪来的?

A:Logo来自玄武岩版式。

Q:字体?

A:Noto Sans SC, Font Awesome。

显示里面的东西隐藏里面的东西
css
@import url("https://scp-wiki-cn.wikidot.com/component:sigma-plus/code/1");
@import url("https://evernight-aquarium.wikidot.com/component:non-savingpage/code/1");
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Noto+Sans+SC:wght@100..900&display=swap');
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css");
@import url(https://fendsfox.wikidot.com/component:betterbetterfootnote/code/1);

/* 全局 */
:root {
    --sp_header-logo: url("https://scp-wiki.wikidot.com/local--files/theme:basalt/basalt_scp_logo-for_lightmode.svg");
    --header-title: "SCP基金会";
    --header-subtitle: "控制 收容 保护";
    --sp_top-bar-link-color: #000;
    --sp_top-bar-link-hover-color: #fff;
    --sp_top-bar-link-hover-background: none;

    --sp_header-height: 10rem;

    --sp_tab-selected-text-color: none;
    --sp_tab-selected-background: none;
    --sp_tab-selected-border-color: none;
    --sp_tab-hover-background: none;

    --divborder: 0.4em solid;
}

p {
    margin: 0.5em 0 0.5em;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Noto Sans SC", Arial, Helvetica;
}

/* 版头 */
#header h1 a, #header h2 span {
    font-family: Noto Sans SC, sans-serif;
    font-weight: 500;
    text-shadow: none;
    color: #161616;
}

#header {
    background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.9), rgba(244, 244, 244, 0.9));
    box-shadow: 0 -5px 15px #ddd;
}

/* 搜索栏/用户信息 */
/* source: https://1nu.wikidot.com/iikanji */

div#search-top-box {
    top: 18.5px;
    width: 100%;
    right: 70px
}

div#search-top-box form {
    display: flex;
    justify-content: flex-end
}

div#search-top-box form input[type="text"],
div#search-top-box form input[type="text"]:hover {
    background-color: #5B5B5B !IMPORTANT;
    display: inline-block;
    height: 1.1rem;
    width: 8rem;
    transition: width .25s;
    outline: none;
    filter: brightness(120%);
}

_::-webkit-full-page-media,
_:future,
:root div#search-top-box form input[type="text"] {
    font-size: 16px
}

div#search-top-box form input[type="text"]:not(:focus),
div#search-top-box form input[type="text"]:not(:focus):not(:hover) {
    background-color: var(--base-color);
    color: transparent;
    cursor: pointer;
    display: inline-block;
    width: 22px;
    height: 22px;
    box-sizing: border-box;
    border-radius: 50px;
    box-shadow: none;
    background-position: center;
    background-size: 55%;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E");
}

div#search-top-box form input[type="submit"] {
    display: none
}

#search-top-box-input {
    border: solid 1px var(--background);
    border-radius: 5px
}

#login-status {
    top: 2px
}

#login-status {
    display: flex;
    flex-direction: column;
    align-content: space-around;
    font-size: 0;
    z-index: unset;
}

#login-status .printuser {
    margin: 0;
    background-color: none;
    position: absolute;
    top: 13px;
    right: 0px;
    width: 28px;
    padding: 0;
}

#login-status .printuser img.small {
    background: none !important;
    margin: 0;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 100px;
    box-shadow: 0 0 3px #3f3f3f;
}

#login-status [id] {
    font-size: .72rem
}

#login-status>a[href="javascript:;"] {
    font-size: 0;
    font-weight: bold;
    margin: 0;
    text-align: center;
    text-decoration: none;
    background: none;
    width: 21.8px;
    position: absolute;
    top: 13px;
    height: 21px;
    right: 30px;
    border: none;
}

#login-status>a[href="javascript:;"]:before {
    display: inline-block;
    font-family: FontAwesome;
    font-size: 1.3rem;
    margin: 4px 3px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    transform: translate(0, 0);
}

#login-status #account-topbutton:before {
    content: "\f013";
    color: var(--base-color)
}

#login-status .login-status-sign-in {
    right: 35px !important;
}

#login-status .login-status-sign-in:before {
    content: "\f13e";
    color: var(--base-color)
}

#login-status .login-status-create-account {
    right: 11px !important;
    margin: 0 0 .25rem;
}

div#login-status a.login-status-create-account {
    right: 11px;
}

#login-status .login-status-create-account:before {
    content: "\f067";
    color: var(--base-color)
}

#login-status #my-account {
    display: none
}

#login-status a strong {
    position: absolute;
    top: 0;
    right: 2.25rem;
    font-family: var(--bauhaus);
    font-size: 1rem;
    var(--lightColor)-space: nowrap
}

#login-status #account-topbutton:not(:focus):not(:focus-within):not(:hover):not(:active)+#account-options {
    display: none !important
}

#header #login-status #account-topbutton+#account-options:focus,
#header #login-status #account-topbutton+#account-options:focus-within,
#header #login-status #account-topbutton+#account-options:hover,
#header #login-status #account-topbutton+#account-options:active {
    display: block !important
}

#account-options ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around
}

#account-options ul>li {
    flex-grow: 1;
    text-align: center;
    width: 40%
}

#account-options ul>li a {
    transition: all .25s ease-in-out
}

#account-options ul>li a:hover {
    background-color: var(--base-color);
    color: var(--background);
    text-decoration: none
}

#login-status ul a {
    color: #000
}

div#search-top-box {
    top: 20px;
    right: 60px;
}

#search-top-box {
    grid-area: login;
    justify-content: flex-end !important;
}

#login-status a strong {
    display: none;
}

/* Sidebar组件 */
/* source: https://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1 */

#top-bar .open-menu a {
        position: fixed;
        top: 0.5em;
        left: 0.5em;
        z-index: 10;
        font-family: 'Nanum Gothic', san-serif;
        font-size: 30px;
        font-weight: 700;
        width: 30px;
        height: 30px;
        line-height: 0.9em;
        text-align: center;
        border: transparent;
        background-color: transparent;
        border-radius: 0em;
        color: var(--lightColor);
        pointer-events: auto;
}

@media not all and (max-width: 767px) {

    #top-bar .mobile-top-bar {
        display: block;
        pointer-events: none;
    }

    #top-bar .mobile-top-bar li {
        display: none;
    }

    #main-content {
        max-width: 44.5rem;
        margin: 0 auto;
        padding: 0;
        transition: max-width 0.2s ease-in-out;
    }

    #side-bar {
        display: block;
        position: fixed;
        top: 0;
        left: -18rem;
        width: 15.25rem;
        height: 100%;
        margin: 0;
        overflow-x: hidden;
        overflow-y: auto;
        z-index: 10;
        padding: 1em 1em 0 1em;
        background-color: rgba(0,0,0,0.1);
        transition: left 0.4s ease-in-out;
    }

    #side-bar:target {
        left: 0;
    }
    #side-bar:focus-within {
        left: 0;
    }

    #side-bar:target .close-menu {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-left: 17rem;
        opacity: 0;
        z-index: -1;
        visibility: visible;
    }
    #side-bar:not(:target) .close-menu { display: none; }

    #top-bar .open-menu a:hover {
        text-decoration: none;
    }
}

@media (max-width: 767px) {
    #side-bar {
        background-color: rgba(34, 32, 46, 0.75);
    }
}

/* 顶栏 */
#top-bar {
    background: #ddd;
    height: 2rem;
    color: #000;
    z-index: unset;
}

#top-bar > div[class*="top-bar"] {
    position: relative;
    z-index: unset;
}

#top-bar div[class*="top-bar"] > ul {
    justify-content: flex-start;
}

#top-bar ul li ul a {
    color: #000 !important;
}

#top-bar ul li ul a:hover {
    background: none !important;
}
#top-bar :is(.top-bar, .mobile-top-bar) > ul > li > a {
    position: relative;
    z-index: 0;
}

/* 顶栏动画 来自玄武岩 */

#top-bar div[class*=top-bar]>ul>li>a::after, #top-bar div[class*=top-bar]>ul>li>a::before {
    content: '';
    display: block;
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    z-index: -1;
    background: #a01;
    transition: height .1s linear .03s;
}

#top-bar div[class*=top-bar]>ul>li>a::after {
    background: #000;
}

#top-bar div[class*=top-bar]>ul>li>a::before {
    background: #a01;
}

#top-bar div[class*=top-bar]>ul>li.sfhover>a::after, #top-bar div[class*=top-bar]>ul>li.sfhover>a::before, #top-bar div[class*=top-bar]>ul>li:focus-within>a::after, #top-bar div[class*=top-bar]>ul>li:focus-within>a::before, #top-bar div[class*=top-bar]>ul>li>a:focus::after, #top-bar div[class*=top-bar]>ul>li>a:focus::before, #top-bar div[class*=top-bar]>ul>li>a:hover::after, #top-bar div[class*=top-bar]>ul>li>a:hover::before {
    height: 100%;
}

#top-bar div[class*=top-bar]>ul>li.sfhover>a::before, #top-bar div[class*=top-bar]>ul>li:focus-within>a::before, #top-bar div[class*=top-bar]>ul>li>a:focus::before, #top-bar div[class*=top-bar]>ul>li>a:hover::before {
    transition: height .15s linear 0s;
}

#top-bar div[class*=top-bar]>ul>li.sfhover>a::after, #top-bar div[class*=top-bar]>ul>li:focus-within>a::after, #top-bar div[class*=top-bar]>ul>li>a:focus::after, #top-bar div[class*=top-bar]>ul>li>a:hover::after {
    transition: height .12s linear .03s;
}

#top-bar div[class*=top-bar] ul li ul li a::before {
    content: '';
    display: block;
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: 0;
    width: 0;
    height: 100%;
    z-index: -1;
    background-color: #a01;
    transition: width .15s linear 0s;
}

#top-bar div[class*=top-bar] ul li ul li a:hover::before {
    width: 100%;
}
#top-bar ul li ul li a {
    transition: color .15s linear 0s;
}

#top-bar ul li ul li:hover a {
    color: #fff !important;
}

#top-bar :is(.top-bar, .mobile-top-bar) ul li:is(.sfhover, :hover, :focus-within) ul {
    pointer-events: auto;
    opacity: 1;
    transition: .5s opacity, height ease;
    height: auto;
}

#top-bar :is(.top-bar, .mobile-top-bar) ul li ul {
    height: 0;
    transition: .5s height ease;
    border: none;
    box-shadow: none;
    border-left: var(--divborder) #000;

}
/* 侧边栏 */
/* source: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1 */
#top-bar .open-menu a {
        position: fixed;
        top: 0.5em;
        left: 0.5em;
        z-index: 5;
        font-family: 'Nanum Gothic', san-serif;
        font-size: 30px;
        font-weight: 700;
        width: 30px;
        height: 30px;
        line-height: 0.9em;
        text-align: center;
        background-color: #000;
        color: #fff;
        pointer-events: auto;
        float: left;

}

@media not all and (max-width: 767px) {

    #top-bar .mobile-top-bar {
        display: block;
        pointer-events: none;
    }

    #top-bar .mobile-top-bar li {
        display: none;
    }

    #main-content {
        max-width: 44.5rem;
        margin: 0 auto;
        padding: 0;
        transition: max-width 0.2s ease-in-out;
    }

    #side-bar {
        display: block;
        position: fixed;
        top: 0;
        left: -18rem;
        width: 15.25rem;
        height: 100%;
        margin: 0;
        overflow-x: hidden;
        overflow-y: auto;
        z-index: 10;
        padding: 1em 1em 0 1em;
        background-color: rgba(0,0,0,0.1);
        transition: left 0.4s ease-in-out;
        border: 1px solid #fff;
        scrollbar-width: thin;
    }

    #side-bar:target {
        left: 0;
    }
    #side-bar:focus-within {
        left: 0;
    }

    #side-bar:target .close-menu {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-left: 17rem;
        opacity: 0;
        z-index: -1;
        visibility: visible;
    }
    #side-bar:not(:target) .close-menu { display: none; }

    #top-bar .open-menu a:hover {
        text-decoration: none;
    }
}

/* 侧边栏修改 */
#side-bar {
    background-color: #f0f0f0 !important;
}

#side-bar .side-block {
    padding: 1em;
    border: none;
    border-left: var(--divborder) #000;
    border-radius: 0;
    box-shadow: none;
    background: #e0e0e0;
    margin-bottom: 15px;
}

#side-bar .side-block.admin, #side-bar .side-block.license {
    background: #e0e0e0 !important;
}

#side-bar .heading {
    border-bottom: solid 1px #bbb;
    color: #333;
}

#side-bar div.menu-item {
    color: transparent;
}

#side-bar div.menu-item img {
    display: none;
}

#side-bar .collapsible-block-unfolded-link:hover, #side-bar .collapsible-block-unfolded-link:focus, #side-bar .collapsible-block-folded:hover, #side-bar .collapsible-block-folded:focus {
    background-color: #e0e0e0;
    transition: .25s background-color ease;
}

#side-bar .collapsible-block-unfolded-link a, #side-bar .collapsible-block-folded a, #side-bar .collapsible-block-unfolded-link .collapsible-block-link, #side-bar .collapsible-block-folded a, #side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover {
    color: #333;
}

#side-bar .collapsible-block-unfolded-link {
    border-bottom: solid 1px #bbb;
}

#side-bar .collapsible-block-folded {
    background: #f0f0f0;
    font-size: 8pt;
    border-bottom: 1px solid #bbb;
}

#side-bar .collapsible-block-unfolded a.collapsible-block-link::before, #side-bar .collapsible-block-folded::before {
    display: none;
}

@media (max-width: 767px) {
    #side-bar:target .close-menu {
        background: none;
    }
}

/* 用户信息 */
#odialog-container {
    position: fixed !important;
    backdrop-filter: blur(0.2rem);
    webkit-backdrop-filter: blur(0.2rem);
}

.owindow {
    display: grid !important;
    grid-template-areas:
        "title title2"
        "modal-body modal-body";
    grid-template-rows: 2rem auto;
    grid-template-columns: auto 3.75rem;
    border: none;
}

#odialog-container .title {
    background-color: #333;
    color: #fff;
    grid-area: title;
    height: 100%;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    padding: 0 0 0 1em;
}

#odialog-container .content.modal-body {
    grid-area: modal-body;
}

.content.modal-body img {
    max-width: 2.5rem;
    margin: 0 0 .6em;
    margin-top: .6em;
}

table.table {
    display: block;
}

#odialog-container .button-bar {
    padding: 0 1em;
    padding: 0;
    height: 100%;
    margin: 0;
    grid-area: title2;
    float: right;
    display: inline-flex;
    justify-content: flex-end;
    align-items: stretch;
    background: #ddd;
}

#odialog-container .button-bar a {
    margin: 0;
    padding: 0;
    text-decoration: none;
    background-color: #ddd;
    border: 0;
    color: transparent;
    display: flex;
    align-items: center;
    flex: 1;
    flex-wrap: wrap;
    justify-content: center;
    height: 100%;
}

#odialog-container .content.modal-body div {
    width: 100%;
}

#odialog-container .content.modal-body div div {
    display: block;
    width: 100%;
}

#odialog-container .content.modal-body div div a.btn.btn-danger.btn-small.btn-sm {
    display: flex;
}

a.btn.btn-danger.btn-small.btn-sm::before {
    content: "";
    flex-grow: 1;
    height: 0.15em;
    margin: auto 0.5em 0.5em auto;
    background-color: #ddd;
}

#odialog-container .button-bar a::before {
    content: "\f00d";
    color: #000;
    text-align: center;
    position: absolute;
    font-size: 150%;
    margin: 0.95em;
    font-family: Noto Sans SC, FontAwesome;
}

#odialog-container .button-bar a.btn.btn-default::before {
    color: #a83e4c;
}

#odialog-container .button-bar a.btn.btn-primary::before {
    content: "\f00c";
    color: #4a6d42;
}

#odialog-container .button-bar a.btn.btn-default.button.button-yes\,-revert::before {
    content: "";
    content: "\f00c";
    color: #4a6d42;
}

#odialog-container .button-bar a#edit-force-remove-lock::before {
    content: "\f044";
    color: #4a6d42;
}

#odialog-container .button-bar a#edit-recheck-lock::before {
    content: "\f2f9";
    color: #222;
}

#odialog-container .content.modal-body h1 {
    font-size: 135%;
    display: block;
    align-items: center;
    border-bottom: 0.15em solid #ddd;
    margin-right: 0.5em;
    padding-bottom: 0.5em;
}

#odialog-container .content.modal-body p {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    align-content: center;
}

/* 标题 */
#page-title, .meta-title {
    color: #333;
    font-weight: 600;
}
#page-title, .meta-title {
    border-color: #eee;
    border-bottom: 1px solid #ddd;
}

/* 正文 */
body {
    font-family: Noto Sans SC, sans-serif;
}

@media not all and (max-width: 767px) {
    #main-content {
        max-width: 61.25rem;
        margin: 0 auto;
        padding: 0;
        transition: max-width 0.2s ease-in-out;
    }
}

.collapsible-block-folded {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    background: #f0f0f0;
}

.collapsible-block-folded::before {
    content: "+";
    color: #a01;
    border-left: var(--divborder);
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.collapsible-block-unfolded a.collapsible-block-link::before {
    content: "-";
    color: #a01;
    border-left: var(--divborder);
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.collapsible-block-unfolded {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.collapsible-block {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.collapsible-block-unfolded-link {
    background: #f0f0f0;
}

.collapsible-block-unfolded-link:hover, .collapsible-block-unfolded-link:focus, .collapsible-block-folded:hover, .collapsible-block-folded:focus {
    background-color: #e5e5e5;
    transition: .25s background-color ease;
}

.collapsible-block-unfolded-link, .collapsible-block-folded {
    transition: .25s background-color ease;
}

#toc {
    margin: 1em auto 1em 0;
    padding: 0em 0.5em;
    border: 1px dashed gray;
    background-color: #eee;
    display: table;
    border: none;
    border-left: var(--divborder) #000;
}

/* Tab */

.yui-navset.yui-navset-top>ul.yui-nav li:is(:hover,:focus-within)::before {
  width: 100%;
}

.yui-navset.yui-navset-top>ul.yui-nav li a {
    display: flex;
    width: 100%;
    height: 100%;
    border: none;
    border-left: var(--divborder) #000;
    background: rgba(200, 200, 200, 0.15);
    color: #000;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    text-align: center;
    padding: 0.5em 1em;
    box-sizing: border-box;
    font-size: 110%;
    font-weight: 500;
    transition: all 0.25s ease-out;
}

.yui-navset.yui-navset-top>ul.yui-nav li a em {
  display: inline;
  border: none;
  padding: 0;
  position: static;
}

.yui-nav, .yui-nav li {
    position: relative;
}

.yui-navset.yui-navset-top .yui-nav li.selected::before, .yui-navset.yui-navset-top .yui-nav li:hover::before {
    width: 100%;
}

.yui-navset.yui-navset-top .yui-nav li::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 0;
    height: 100%;
    background-color: #f0f0f0;
    transition: all 0.25s ease-out;
}

.yui-navset .yui-nav {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
}

.yui-navset .yui-content, .yui-navset .yui-navset-top .yui-content {
    border: transparent;
    border-left: var(--divborder) #000;
    padding: 0.25em 0.5em;
}

.yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
    border-color: transparent;
}

.yui-navset {
    z-index: 0;
}

table.wiki-content-table th {
    border: 0.1em solid #222;
    padding: 0.3em 0.7em;
    background-color: #222;
    color: #eee;
}

table.wiki-content-table td {
    border: 0.1em solid #bbb;
    padding: 0.3em 0.7em;
}

/* 小标题 */
h1, h2, h3, h4, h5, h6 {
    color: #000;
}

/* 评分模块 */
div.page-rate-widget-box, div.rate-box-with-credit-button {
    background-color: #ddd !important;
    border: transparent;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0.25em;
    font-size: 110%;
    border-left: var(--divborder) #000;
}

.creditButtonStandalone p a {
    background-color: #ddd !important;
    border: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0.5em;
    font-size: 110%;
    color: #000 !important;
    border-left: var(--divborder) #000 !important;
    float: right;
    transition: .45s color ease;
}

div.rate-box-with-credit-button .page-rate-widget-box {
    border-color: transparent;
}

.page-rate-widget-box :is(.rateup, .ratedown) a {
    margin: 0;
    color: #000;
    background-color: transparent;
}

div.page-rate-widget-box .rate-points {
    padding: 0 .675em;
    color: #000;
}

div.page-rate-widget-box .cancel a {
    color: #000;
}

div.creditButton p a {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .925em;
    width: 1.375em;
    height: 100%;
    color: #000;
    padding: 0;
    padding-top: .1425em;
    border: 0;
    border-inline-start: none;
    box-sizing: border-box;
    margin: 0;
}

.page-rate-widget-box .rateup a:is(:hover,:focus) {
    color: green;
    border-color: green;
    background-color: transparent;
}

.page-rate-widget-box .ratedown a:is(:hover,:focus) {
    color: red;
    border-color: red;
    background-color: transparent;
}

div.page-rate-widget-box .cancel a:is(:hover,:focus) {
    color: orange;
    border-color: orange;
}

.creditButtonStandalone p a:is(:hover, :focus) {
    color: #fff !important;
}

div.page-rate-widget-box :is(.rateup, .ratedown, .cancel) a {
    transition: .5s border-color, color ease;
    border-bottom: 1px solid #bbb;
}

div.creditButton p a {
    transition: .45s color ease;
}

/* 著作信息栏 */

:is(#u-credit-view, #u-credit-otherwise) {
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(0.2rem);
    -webkit-backdrop-filter: blur(0.2rem);
    transition: opacity 0.1s linear;
}

#u-credit-otherwise .modalbox h2, #u-credit-view .modalbox h2  {
    color: #f0f0f0;
    font-weight: 600;
    font-family: Noto Sans SC;
}

iframe.close-credits {
    display: contents;
}

a.back {
    display: none !important;
}

.modalbox hr {
    display: none;
}

#u-credit-otherwise .modalbox {
    background: #fefefe;
    background: linear-gradient(#333 3rem, #f0f0f0 1rem, #f0f0f0) !important;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0.1em;
}

#u-credit-view .modalbox  {
    background: #fefefe;
    background: linear-gradient(#333 3rem, #f0f0f0 1rem, #f0f0f0) !important;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0.1em;
}

.credit.first, .credit.otherwise {
    padding-top: 1em;
}

/* 图片块 */
.scp-image-block.block-center {
    margin-right: auto;
    margin-left: auto;
    border: none;
    border-bottom: 2px solid #333;
    padding-left: 0em;
    background: transparent;
}

.scp-image-block img {
    width: 100% !important;
}

/* Divs */
.code {
    border: transparent;
    border-left: 5px dashed #333;
    background: #ddd;
}

div.blockquote {
    border: none;
    background-color: transparent;
    padding: 0.5em;
    margin: 1em;
    border-left: var(--divborder) #000;
    margin-right: 0;
    margin-left: 0;
    padding-top: 0.1em;
    padding-bottom: 0.1em;
}

blockquote {
    border: none;
    border-left: var(--divborder) #000;
    padding: 0.5em;
    display: block;
    margin-inline-start: 0;
    margin-inline-end: 0;
    unicode-bidi: isolate;
    padding-top: 0.1em;
    padding-bottom: 0.1em;
}

div.wiki-note {
    width: auto;
    margin: 0.5em 5em;
    border: none;
    border-right: 2px solid #000;
    border-left: 2px solid #000;
    text-align: center;
    background: #f0f0f0;
    padding: 0.5em;
}

.scp-blockquote, .description-blockquote, .diy-blockquote {
    padding-right: 1em;
    margin: 1em;
    margin-right: 0;
    margin-left: 0;
    border-left: var(--divborder) #000;
    padding-bottom: 0.1em;
}

.scp-blockquote p, .description-blockquote p, .diy-blockquote p {
    padding-left: 0.5em;
    padding-right: 0.5em;
}

.scp-blockquote::before, .description-blockquote::before, .diy-blockquote::before {
    display: block;
    background: #ddd;
    width: 100%;
    font-weight: 600;
    font-size: 110%;
    padding: 0.5em;
    font-family: Noto Sans SC, FontAwesome;
}

.scp-blockquote::before {
    content: "\f023  特殊收容措施";
}

.description-blockquote::before {
    content: "\f1c2   描述";
}

.diy-blockquote::before {
    content: "\f07b  " attr(data-title);
}

/* 更更更更好的脚注 */
/* source: https://fendsfox.wikidot.com/component:betterbetterfootnote */

div.hovertip div.content div[class] div[class*="-heading"] {
    background-color: #333;
    color: #eee;
}

/* 脚注 */

.footnotes-footer .title {
    margin-bottom: 0.5em;
    margin-left: -10px;
    margin-top: -0.5em;
    font-size: 130%;
    font-weight: bold;
    background: #333;
    display: inline-block;
    color: #eee;
    padding-right: 0.2em;
    border-left: var(--divborder) #000;
}

.footnotes-footer {
    margin: 0;
    margin-top: 1em;
    padding: 0.5em 0;
    border-left: var(--divborder) #333;
    padding-top: 0;
    background: #f0f0f0;
    padding-left: 5px;
    font-weight: 500;
}

.footnotes-footer a {
    font-weight: 600;
}

/* Wikiwalk */
.footer-wikiwalk-nav {
    text-align: center;
}

/* Tag */

.page-tags {
    margin: 0;
    padding: 0;
    border: none;
    border-top: none;
    margin-top: 2.5em;
    margin-bottom: -0.5em;
}

.page-tags::before {
    content: "标签";
    display: block;
    border-bottom: 0.1em solid #bbb;
    font-weight: 600;
}

#main-content .page-tags span {
    border: none;
    border-left: var(--divborder) #ddd;
    padding: 0.5em;
    margin: 0.25em;
    font-size: 85%;
    margin-left: 0;
    background: #eee;
    transition: .25s background-color ease;
}

#main-content .page-tags span:is(:hover, :focus) {
    background-color: #eee;
    border-color: #d0d0d0;
    transition: all .25s ease;
}
#main-content .page-tags span {
    border: none;
    border-left: var(--divborder) #ddd;
    padding: 0.25em;
    margin: 0.25em;
    font-size: 85%;
    margin-left: 0;
    background: #f0f0f0;
    transition: all .25s ease;
}

/* 页面信息 */

div#page-options-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: auto auto auto auto auto;
    justify-content: space-between;
    grid-template-areas:
        "title title"
        "page-info watch-options"
        "edit-options edit-options"
        "edit-options2 edit-options2";
}

#page-info {
    text-align: start;
    margin: 0;
    margin-bottom: 0.5em;
}

#page-options-container::before {
    content: "页面信息";
    display: block;
    border-bottom: 0.1em solid #bbb;
    font-weight: 600;
    grid-area: title;
}

#page-info {
    grid-area: page-info;
    font-size: 100%
}

.page-watch-options {
    text-align: end;
    grid-area: watch-options;
    font-size: 100%;
}

@media (max-width: 767px) {
  #page-info, .page-watch-options {
      text-align: left;
      font-size: 60%;

  }

  div#page-options-container {
      grid-template-areas:
      "title title"
      "page-info page-info"
      "watch-options watch-options"
      "edit-options edit-options"
      "edit-options2 edit-options2";
  }
}

.page-options-bottom {
    grid-area: edit-options;
}

div#page-options-bottom-2 {
    grid-area: edit-options2;
}

/* 编辑栏 */

.page-options-bottom {
    text-align: center;
    background: #eee;
    border-left: var(--divborder) #000;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template:
        "… . . more"
        "… . . more";
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 5rem;
}

.page-options-bottom a {
    margin: 0.25em;
    padding: 0.2em;
    color: #000;
    border-bottom: 0.01em solid #ddd;
    text-decoration: unset;
    transition: 0.25s all ease;
}

.page-options-bottom a:hover {
    color: #b01;
    border-color: #b01;
}

.page-options-bottom a#more-options-button {
    background: #ddd;
    border: none;
}

.page-options-bottom a#more-options-button, .page-options-bottom a#delete-button {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-area: more;
    border: none;
    font-weight: 500;
}

.page-options-bottom a#more-options-button:hover {
    background-color: #222;
    color: #eee;
}

.page-options-bottom a#delete-button:hover {
    background: #ff3030;
    color: #eee;
}

.page-options-bottom a#delete-button {
    background: rgb(255, 48, 48, .205);
    color: #ff3030;
}

/* 底栏 适配移动端 */
@media (max-width: 767px) {
    .page-options-bottom {
        grid-template-areas:
        ". ."
        ". ."
        ". ."
        ". ."
        ". ."
        "more more";
        grid-template-columns: 1fr 1fr;
    }
    .page-options-bottom a#more-options-button, .page-options-bottom a#delete-button {
        padding: 0.25em;
    }
}

/* 底部信息块 */
#footer {
    font-size: 100%;
    background: #eee;
    color: #000;
    margin-top: 1em;
    padding: 0.2em;
    height: 2.5rem;
    align-items: center;
    border-top: 0.2em solid #ddd;
}

#footer a, #top-bar a {
    color: #000;
}

#footer .options a {
    border-inline-start: none;
}

#footer .options {
    border-left: 1px solid #aaa;
}

/* 授权协议信息块 */
#license-area {
    background: #eee;
}

#license-area::before {
    content: " ";
    width: 100%;
    display: block;
    border-bottom: 0.2em solid #ddd;
    margin-bottom: 1rem;
}

/* 编辑栏 */
#odialog-container .owindow.osuccess#owindow-1 {
    display: block !important;
}

@media (max-width: 479px) {
    #edit-page-title {
        max-width: 65%;
    }
}

#action-area textarea#edit-page-textarea {
    font-family: 'Andale Mono', 'Courier New', Courier;
}

Footnotes
  1. 1.邪恶。
  2. 2.真的有61个,不信你数数看。
  3. 3.<tt>等宽字</tt>
  4. 4.Safe Euclid Explained Thaumiel Neutralized Keter
页面版本:⁨0⁩, 最后编辑于: ⁨2024/10/25 16:41:29⁩ (⁨⁨691⁩ 日前⁩), 现时评分: 33