范式重构 主题版式
2022年7月2日
修订 26
评分
20
↑ 20
↓ 0
支持率
100%
总票数 20
Wilson 95% 下界
83.9%
在相同票数下更稳健的支持率估计
争议指数
0.000
评分趋势
按周聚合 加载图表中...
最近修订
1 / 9
最近投票
1 / 2
2024-09-03
2024-09-03
2022-10-25
2022-07-31
2022-07-11
2022-07-05
2022-07-05
2022-07-04
2022-07-04
2022-07-03
相关页面
暂无推荐
页面源码
[[module css]]
@import url("https://scp-wiki-cn.wdfiles.com/local--code/theme%3Aparadigm-reconstruction/1");
[[/module]]
====
[[iftags +版式]]
[[module css]]
.scp-image-block.block-right {
margin: 1em 0 1.1em 2em;
}
.scp-image-block img {
min-width: 100%;
border: 0.5rem solid rgba(var(--pale-gray-monochrome));
box-sizing: border-box;
}
.colors_container {
width: 90%;
display: flex;
flex-direction: column;
margin: 0 auto;
font-weight: 700;
font-family: zuijinregular, serif;
}
.colors_container > .colors,
.colors_container > .subcolors {
width: 100%;
flex-shrink: 0;
display: flex;
flex-wrap: wrap;
}
.colors > .color,
.subcolors > .color {
display: flex;
flex-direction: row;
flex-grow: 2;
justify-content: center;
align-items: flex-end;
padding: 0.5rem;
margin: 0.5rem;
}
.colors > .color > .sub,
.subcolors > .color > .sub,
.colors > .color > .sub > .css-variable,
.subcolors > .color > .sub > .css-variable {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 100%;
}
.colors > .color {
height: 7rem;
flex-basis: calc((100%/2) - 2rem);
}
.colors > .color.one {
background-color: rgba(var(--gray-monochrome),1);
}
.colors > .color.two {
background-color: rgba(var(--bright-accent),1);
}
.subcolors > .color {
height: 4.3rem;
font-size: 75%;
text-align: center;
flex-basis: calc((100%/6) - 2rem);
}
.colors > .color.one,
.subcolors > .color.two,
.subcolors > .color.three,
.subcolors > .color.four,
.subcolors > .color.five,
.subcolors > .color.six {
color: rgba(var(--swatch-text-light),1);
}
.subcolors > .color.one {
background-color: rgba(var(--pale-gray-monochrome),1);
}
.subcolors > .color.two {
background-color: rgba(var(--light-gray-monochrome),1);
}
.subcolors > .color.three {
background-color: rgba(var(--dark-gray-monochrome),1);
}
.subcolors > .color.four {
background-color: rgba(var(--medium-accent),1);
}
.subcolors > .color.five {
background-color: rgba(var(--dark-accent),1);
}
.subcolors > .color.six {
background-color: rgba(var(--newpage-color),1);
}
.color > .sub > .css-variable {
font-size: 75%;
letter-spacing: 0.1em;
font-family: var(--body-font);
}
[[/module]]
[[div_ style="display:none"]]
[[embed]]
<iframe src="https://scp-wiki-cn.wdfiles.com/local--files/nav%3Aside/styleFrame.html?bhl" name="typeFrame"></iframe>
[[/embed]]
[[/div]]
[[>]]
[[module Rate]]
[[/>]]
[[include :scp-wiki-cn:credit:start]]
**作者：**[[*user Mercuresphere]]
版头图片：https://pixabay.com/images/id-3587491/
[[include :scp-wiki-cn:credit:end]]
[[=]]
+ 主题颜色
[[/=]]
[[div_ class="colors_container"]]
[[div_ class="colors"]]
[[div_ class="color one"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--gray-monochrome@@[[/span]][[span class="css-variable"]]@@(43, 14, 116)@@[[/span]]
[[/div]]
[[/div]]
[[div_ class="color two"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--bright-accent@@[[/span]][[span class="css-variable"]]@@(255, 219, 90)@@[[/span]]
[[/div]]
[[/div]]
[[/div]]
[[div_ class="subcolors"]]
[[div_ class="color one"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--pale-gray-monochrome@@[[/span]][[span class="css-variable"]]@@(233, 240, 255)@@[[/span]]
[[/div]]
[[/div]]
[[div_ class="color two"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--light-gray-monochrome@@[[/span]][[span class="css-variable"]]@@(91, 97, 138)@@[[/span]]
[[/div]]
[[/div]]
[[div_ class="color three"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--dark-gray-monochrome@@[[/span]][[span class="css-variable"]]@@(41, 26, 91)@@[[/span]]
[[/div]]
[[/div]]
[[div_ class="color four"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--medium-accent@@[[/span]][[span class="css-variable"]]@@(228, 180, 28)@@[[/span]]
[[/div]]
[[/div]]
[[div_ class="color five"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--dark-accent@@[[/span]][[span class="css-variable"]]@@(41, 26, 91)@@[[/span]]
[[/div]]
[[/div]]
[[div_ class="color six"]]
[[div_ class="color sub"]]
[[span class="css-variable"]]@@--newpage-color@@[[/span]][[span class="css-variable"]]@@(153, 0, 255)@@[[/span]]
[[/div]]
[[/div]]
[[/div]]
[[/div]]
+ 关于本页
这是[[*user Mercuresphere]]为图书馆典籍：[[[wanderers:paradigm-shift-hub| 范式转移]]]设计的版式。
此版式并非范式转移典籍专用，范式转移典籍的页面也不必须应用此版式。
在你的作品开头添加如下语法以应用此版式：
> @@[[include :scp-wiki-cn:theme:paradigm-reconstruction]]@@
+ 示例
可通过 5 个连字符“@@-----@@”创建水平分割线。若它未被放在其他部件（诸如引用块）中，则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。
-----
如果将“@@-----@@”放入类（class）为 “fancyhr” 的 div 元素中，则可以显示另一种水平线样式，如下所示：
> @@[[div_ class="fancyhr"]]@@
> @@-----@@
> @@[[/div]]@@
效果如下：
[[div_ class="fancyhr"]]
-----
[[/div]]
[[div_ class="fancyborder"]]
任何元素添加 “fancyborder” 类（class），即可显示特殊边框。例如，这是此方块的代码：
[[div_ class="code"]]
@@[[div_ class="fancyborder"]]@@
@@文字内容@@
@@[[/div]]@@
[[/div]]
[[/div]]
标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建
[[collapsible show="+ Titles" hide="- Titles"]]
+ 1 级标题
++ 2 级标题
+++ 3 级标题
++++ 4 级标题
+++++ 5 级标题
++++++ 6 级标题
[[/collapsible]]
@@ @@
[[tabview]]
[[tab 分页]]
此为分页（tab view）。
[[/tab]]
[[tab 分页]]
看，这有更多文字。
多么精巧绝伦。
[[/tab]]
[[tab 长 Tab]]
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
这是一个长的 tab，它有很多文字。
[[/tab]]
[[tab 空 tab]]
[[/tab]]
[[tab 空 tab]]
[[/tab]]
[[tab 空 tab]]
[[/tab]]
[[tab 空 tab]]
[[/tab]]
[[tab 空 tab]]
[[/tab]]
[[tab 空 tab]]
[[/tab]]
[[/tabview]]
> 这是一个引用块，在一行字的起始处加上“> ”来创建。
>
> 更多文字
> -----
> 一条分割线
>
>> 嵌套引用块[[footnote]] 一个脚注 [[/footnote]]
||~ 这是 ||~ 表格 ||
||你应该老早 || 就知道怎么 ||
||||做这个了吧 ||
[[=]]
正文字体为 Skolar Sans / 浏览器默认字体
[[span style="font-family: var(--header-font);"]]页眉字体为 Anonymous Pro / 王汉宗魏碑体。[[/span]]
[[span style="font-family: var(--title-font);"]]标题字体为 Zuijin / 王汉宗魏碑体。[[/span]]
[[span style="font-family: var(--mono-font);"]]等宽字为 Recursive / 仿宋及思源宋体。[[/span]]
[[/=]]
-----
[[collapsible show="+ 显示代码" hide="- 隐藏代码" hideLocation="both"]]
[[code type="css"]]
/* Paradigm Reconstruction Theme */
/* 2022 Wikidot Theme */
/* By Mercuresphere, based off Dustjacket by Woedenaz and Croquembouche */
/* Header background: https://pixabay.com/images/id-3587491 */
/* CC BY-SA 3.0 */
@import url("https://fastly.jsdelivr.net/gh/Crimone/crimson-anemone@2.3.16/dustjacket.css");
/* ----BEGIN---- */
:root {
/* S-CSS-P Integration */
/* If you're making a new CSS theme, please include the following three variables at minimum. */
--theme-base: "nuscp";
/* must be either "nuscp" or "sigma9" */
--theme-id: "paradigm-reconstruction";
/* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
--theme-name: "Paradigm Reconstruction Theme";
/* set this to your theme's full name */
/* ===STANDARD THEME COLORS=== */
--white-monochrome: 252, 252, 252;
--pale-gray-monochrome: 214, 245, 255;
--light-pale-gray-monochrome: 215, 255, 255;
--very-light-gray-monochrome: 220, 227, 229;
--light-gray-monochrome: 70, 157, 184;
--gray-monochrome: 5, 148, 192;
--dark-gray-monochrome: 0, 91, 119;
--gradient-header: url("https://evernight-aquarium.wdfiles.com/local--files/files/skydome-aquarium-header.jpg");
--header-background-image-size: auto var(--header-height-on-desktop);
--logo-image: none;
--pale-accent: 136, 198, 201;
--bright-alt-accent: 238, 238, 238;
--bright-accent: 176, 230, 247;
--medium-accent: 70, 157, 184;
--dark-accent: 0, 91, 119;
--newpage-color: 41, 128, 92;
--dark-medium-accent: 3, 105, 105;
--dark-bright-accent: 0, 36, 31;
--ui-button-hover-bg: var(--bright-accent);
--ui-button-hover-outline: var(--pale-gray-monochrome);
--swatch-primary: var(--bright-alt-accent);
--swatch-menutxt-light-color: var(--bright-alt-accent);
--rating-module-text-color: var(--bright-alt-accent);
--pager-link-hover: var(--pale-gray-monochrome);
}
:root:lang(cn) {
--header-title: "THE PARADIGM YOU HAVE SEARCHED FOR IS NOT IN SERVICE";
--body-font: Texturina, Optima, Segoe, Segoe UI, Candara, Calibri, Arial, sans-serif;
--header-font: "Anonymous Pro", 'HanWang WeiBeiMedium-Gb5', Consolas, 'Noto Serif SC', monospace;
--title-font: "EB Garamond", 'HanWang WeiBeiMedium-Gb5', 'kaiti', 'Noto Serif SC', Big Caslon, Book Antiqua, Palatino Linotype, 'Noto Serif SC', Georgia, serif;
--UI-font: "EB Garamond", Big Caslon, Book Antiqua, Palatino Linotype, 'Noto Serif SC', Georgia, serif;
--mono-font: Recursive, Consolas, monaco, '仿宋', 'Noto Serif SC', monospace;
}
#header h1 a, #header h1 a::before, #header h1 a::after {
font-size: 1.6rem;
}
#header h1 a::after {
display:none;
}
@media only screen and (min-width: 56.25rem) {
#container #header h1 a::before, #container #header h1 a::after {
--wght: 700;
}
}
@media only screen and (max-width: 767px) {
#header h1 a, #header h1 a::before, #header h1 a::after {
font-size: 1.1rem;
line-height: 1.1;
}
}
div#extra-div-1 {
background-position: center;
}
#content-wrap { position: relative; }
#content-wrap::before {
content: "";
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
background-repeat: repeat-x;
pointer-events: none;
background-image: url('https://scp-wiki.wdfiles.com/local--files/theme%3Aswirling-ashes/purple-smoke.png');
opacity: 0.2;
filter: hue-rotate(-84deg) saturate(1.477612) brightness(1.3036);
}
#page-title::before, .meta-title::before, #page-title::after, .meta-title::after {
background-color: rgb(var(--gray-monochrome));
background-image: none;
}
hr:not(.fancyhr hr) {
filter: hue-rotate(146deg) saturate(100%) brightness(0.75);
}
.fancyhr hr {
border-image-source: url("https://evernight-aquarium.wdfiles.com/local--files/files/wl_hr.png");
}
.fancyborder {
box-sizing: border-box;
padding: 2vw;
border: 2vw solid rgba(0, 0, 0, 0.5);
border-image: url("https://evernight-aquarium.wdfiles.com/local--files/files/wl_border.png") 600 round;
border-image-width: 6;
}
/* ===yui-tabs=== */
#main-content {
--tabs-bg: var(--swatch-secondary-color);
--tabs-txt: var(--swatch-text-tertiary-color);
--tabs-hover-bg: var(--gray-monochrome);
--tabs-hover-txt: var(--swatch-text-secondary-color);
--tabs-selected-bg: var(--dark-gray-monochrome);
--tabs-selected-txt: var(--swatch-text-secondary-color);
--tabs-selected-outline: var(--dark-gray-monochrome);
--tabs-bottom-border-color: var(--gray-monochrome);
--tabs-content-bg-color: var(--swatch-secondary-color), 0.25;
--tabs-content-border-color: var(--swatch-tertiary-color);
}
.yui-navset .yui-nav .selected {
background-color: rgb(var(--dark-gray-monochrome));
}
/* ===compatibility patch=== */
div.earthworm div.inner,
div.earthworm div.inner > div {
display: contents;
}
/* ===链接反色效果=== */
div.page-watch-options a, div.page-watch-options a:visited {
--hover-link-color: var(--dark-accent);
}
#breadcrumbs,.pseudocrumbs {
--swatch-text-secondary-color: var(--bright-alt-accent);
}
form#edit-page-form .edit-help-34>a:active, form#edit-page-form .edit-help-34>a:hover, form#edit-page-form .edit-help-34>a:focus-within {
--swatch-background: var(--dark-accent);
}
#action-area a[onclick*=deleteTag]:not(.btn):active, #action-area a[onclick*=deleteTag]:not(.btn):hover, #action-area a[onclick*=deleteTag]:not(.btn):focus-within {
--swatch-text-secondary-color: var(--dark-accent);
}
table.page-history tr:nth-of-type(2) td:not(:nth-of-type(7)):before {
--swatch-text-secondary-color: var(--dark-accent);
}
#header {
--login-myaccount-hover-color: var(--dark-accent);
--login-myaccount-underline-color: 0,0,0,0;
--login-myaccount-hover-bg-color: var(--bright-accent);
}
#footer {
--footer-link-hover-color: var(--dark-accent);
}
#license-area {
--license-link-hover-color: var(--dark-accent);
}
div[id*="page-options-bottom"]:not(.page-rate-widget-box):not(#search-top-box-form) > a.btn {
box-shadow: 0 0 0 0 rgb(var(--ui-button-hover-outline)),inset var(--icon-size) 0 0 0 rgb(var(--ui-icon-bg));
}
div[id*=page-options-bottom]>a:after {
background-color: rgb(var(--bright-accent));
}
#breadcrumbs a:before, #breadcrumbs a:visited:before, .pseudocrumbs a:before, .pseudocrumbs a:visited:before {
box-shadow: .0625rem .0625rem 0 0 rgba(var(--dark-gray-monochrome),1),.25rem .0625rem 0 0 rgba(255,255,255,.85),.25rem .0625rem 0 0 rgba(var(--dark-gray-monochrome),1),.3125rem .0625rem 0 0 rgba(var(--dark-gray-monochrome),1);
}
#breadcrumbs a:active:before, #breadcrumbs a:hover:before, .pseudocrumbs a:active:before, .pseudocrumbs a:hover:before {
background-color: rgb(var(--gray-monochrome));
box-shadow: 0 0 0 .25rem rgba(var(--gray-monochrome),1),0 0 0 0 rgba(var(--background-gradient-color),0),0 0 0 0 rgba(var(--swatch-background),0),0 0 0 0 rgba(var(--gray-monochrome),0)
}
#breadcrumbs a:focus-within:before,.pseudocrumbs a:focus-within:before {
background-color: rgb(var(--gray-monochrome));
box-shadow: 0 0 0 .25rem rgba(var(--gray-monochrome),1),0 0 0 0 rgba(var(--background-gradient-color),0),0 0 0 0 rgba(var(--swatch-background),0),0 0 0 0 rgba(var(--gray-monochrome),0)
}
#page-content .rate-box-with-credit-button > .creditButton > p > a:after {
background-color: rgba(var(--rating-module-button-cancel-color),1)
}
@media only screen and (max-width: 56.25rem) {
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
background-color: rgba(0, 0, 0, 0);
}
}
@media only screen and (max-width: 375px) {
div[id*=page-options-bottom] > a:after {
left: 0;
}
}
@media only screen and (max-width: 425px) {
div[id*=page-options-bottom] > a:after {
left: 0;
}
}
@media only screen and (max-width: 767px) {
#header h1 a::before, #header h1 a::after {
width: 95%;
left: calc(2.5%);
}
}
@media only screen and (max-width: 768px) {
#side-bar {
padding-left: 0px;
}
}
/* ===默认收起用户信息栏和搜索栏=== */
@media only screen and (min-width: 56.25rem) {
#search-top-box {
top: 2em;
right: 3%
}
#login-status {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
top: 2em;
right: calc(3% + var(--account-height) + .25em);
color: transparent;
pointer-events: none;
transition: color .2s cubic-bezier(.4,0,.2,1);
user-select: none
}
#login-status:active, #login-status:hover {
-webkit-user-select: initial;
-moz-user-select: initial;
-ms-user-select: initial;
color: rgb(var(--login-line-divider-color));
pointer-events: all;
user-select: auto
}
#login-status:focus-within {
-webkit-user-select: initial;
-moz-user-select: initial;
-ms-user-select: initial;
color: rgb(var(--login-line-divider-color));
pointer-events: all;
user-select: auto
}
#login-status:active #account-options, #login-status:hover #account-options {
pointer-events: all
}
#login-status:focus-within #account-options {
pointer-events: all
}
#login-status > :not(#account-topbutton):not([href*="account/messages"]) {
--clip-path: polygon(100% 0,100% 0,100% 100%,100% 100%);
-webkit-clip-path: var(--clip-path);
clip-path: var(--clip-path);
opacity: 0;
transition: box-shadow .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1),-webkit-text-decoration .2s cubic-bezier(.4,0,.2,1),-webkit-clip-path .2s cubic-bezier(.4,0,.2,1);
transition: box-shadow .2s cubic-bezier(.4,0,.2,1),text-decoration .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),clip-path .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1);
transition: box-shadow .2s cubic-bezier(.4,0,.2,1),text-decoration .2s cubic-bezier(.4,0,.2,1),color .2s cubic-bezier(.4,0,.2,1),clip-path .2s cubic-bezier(.4,0,.2,1),opacity .2s cubic-bezier(.4,0,.2,1),-webkit-text-decoration .2s cubic-bezier(.4,0,.2,1),-webkit-clip-path .2s cubic-bezier(.4,0,.2,1)
}
#login-status:active > :not(#account-topbutton):not([href*="account/messages"]), #login-status:hover > :not(#account-topbutton):not([href*="account/messages"]) {
--clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
-webkit-clip-path: var(--clip-path);
clip-path: var(--clip-path);
opacity: 1
}
#login-status:focus-within > :not(#account-topbutton):not([href*="account/messages"]) {
--clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
-webkit-clip-path: var(--clip-path);
clip-path: var(--clip-path);
opacity: 1
}
#login-status #account-topbutton {
margin-left: 0;
background-color: initial;
pointer-events: all;
transition: background-color .15s cubic-bezier(.4,0,.2,1),-webkit-clip-path .15s cubic-bezier(.4,0,.2,1);
transition: clip-path .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1);
transition: clip-path .15s cubic-bezier(.4,0,.2,1),background-color .15s cubic-bezier(.4,0,.2,1),-webkit-clip-path .15s cubic-bezier(.4,0,.2,1)
}
#login-status:hover #account-topbutton {
background-color: rgb(var(--login-arrow-color))
}
#login-status:before {
-webkit-mask-image: var(--user-account-mask);
-webkit-mask-size: calc(var(--account-height) - .5em);
-webkit-mask-position: center right;
-webkit-mask-repeat: no-repeat;
z-index: 2;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(var(--login-mobile-icon-color),0);
background-color: rgba(var(--login-mobile-icon-color),1);
content: "";
cursor: pointer;
mask-image: var(--user-account-mask);
mask-position: center right;
mask-repeat: no-repeat;
mask-size: calc(var(--account-height) - .5em);
pointer-events: all;
transition: background-color .15s cubic-bezier(.4,0,.2,1)
}
#login-status:hover:before {
background-color: rgba(var(--login-mobile-icon-hover-color),1)
}
#login-status:active:after, #login-status:active:before, #login-status:hover:after, #login-status:hover:before {
background-color: rgba(var(--login-mobile-icon-hover-bg-color),0);
cursor: auto;
pointer-events: none
}
#login-status:focus-within:after, #login-status:focus-within:before {
background-color: rgba(var(--login-mobile-icon-hover-bg-color),0);
cursor: auto;
pointer-events: none
}
#login-status #account-topbutton {
--clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
-webkit-clip-path: var(--clip-path);
background-color: rgba(var(--login-arrow-color),0);
clip-path: var(--clip-path)
}
#login-status:active #account-topbutton, #login-status:hover #account-topbutton {
--clip-path: polygon(30% 35%,70% 35%,50% 60%,50% 60%);
-webkit-clip-path: var(--clip-path);
background-color: rgb(var(--login-arrow-color));
clip-path: var(--clip-path)
}
#login-status:focus-within #account-topbutton {
--clip-path: polygon(30% 35%,70% 35%,50% 60%,50% 60%);
-webkit-clip-path: var(--clip-path);
background-color: rgb(var(--login-arrow-color));
clip-path: var(--clip-path)
}
#login-status #account-options {
margin: 0
}
#login-status a[href*="account/messages"] {
color: rgb(var(--login-myaccount-color));
pointer-events: all
}
}
@media only screen and (min-width: 980px) {
#search-top-box {
right: calc(3% + (-100vw + var(--header-width-on-desktop)) / 2);
}
#login-status {
right: calc(3% + var(--search-height) + .25em + (-100vw + var(--header-width-on-desktop)) / 2);
}
}
/* ----END---- */
[[/code]]
[[/collapsible]]
[[/iftags]]