[[iftags +组件]]
这是什么
我用户 'Croquembouche' 不存在用在一大堆页面上的一大堆各种各样的CSS“改进”,因为我觉得这样就能使其更容易处理。
该组件做出了很多非常细碎的改动以使得写作体验更加舒服且能够使制作组件/版式更加容易一点(也就是我经常干的事)。它不会对读者来说在视觉上改变页面中的任何东西——这些改动是为作者服务的。
我不期望用了这个组件的文章的翻译版也会用到这个组件,除非那个翻译者也喜欢这个组件而且也想用这个组件之类的。
这个组件可能不会与其它组件或版式冲突,且即使会冲突,也可能不会有什么影响。
用法
在任意维基上:
[[include :scp-wiki:component:croqstyle]]
该组件被设计于与其它组件一同使用,所以-=-是用来隐藏该文档的。在另一个组件内使用时,请确保将该组件放在[[iftags]]块内,这样你的组件的用户就不会强制同样使用 Croq 风格。
相关组件
其它个人自定义组件(只会改变一点点东西):
- RSO组件 — 用户 'Rounderhouse' 不存在
个人自定义版式(在视觉上有大的变化):
CSS修改
大小合理的脚注
不让脚注达到一百万里那么宽,让你能确实地阅读脚注。
.hovertip { max-width: 400px; }等宽字体编辑/代码
使编辑文本框内字体等宽,且将所有等宽字文本改为Fira Code,也是个明显很优秀的等宽字字体。
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap');
:root { --mono-font: "Fira Code", Cousine, monospace; }
#edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); }
.code pre * { white-space: pre; }
.code *, .pre * { font-feature-settings: unset; }电传打字机背景
给<tt>元素加上亮灰色的背景({{文本}}),使得代码片段更为突出。
tt {
background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4);
font-size: 85%;
padding: 0.2em 0.4em;
margin: 0;
border-radius: 6px;
}不要大脸
禁用悬停于某人的头像的时候出现的大图片,因为这图片又蠢又真的很烦人,想看大头像版本的话直接点击一下就行了。
.avatar-hover { display: none !important; }碎裂碎裂
任何在带有nobreak类的div中的文本可以在字母间自动换行。
.nobreak { word-break: break-all; }代码颜色
将我终端中的代码颜色加为变量。可能我会在什么时候把它改成比如Monokai或者别的更加常见的终端主题,但是现在暂时这还是我的个人主题,是从Tomorrow Night Eighties中衍生而来的。
还有,将.terminal类像[[div class="code terminal"]]一样添加到假代码方块中可以让它有一个有点伪终端样的暗色背景。不能用在[[code]]中,因为Wikidot嵌入了一大堆语法来使其高亮,不用一大堆CSS是改不动的。只能用在非[[code]]的代码片段中。
:root {
--c-bg: #393939;
--c-syntax: #e0e0e0;
--c-comment: #999999;
--c-error: #f2777a;
--c-value: #f99157;
--c-symbol: #ffcc66;
--c-string: #99cc99;
--c-operator: #66cccc;
--c-builtin: #70a7df;
--c-keyword: #cc99cc;
}
.terminal, .terminal > .code {
color: var(--c-syntax);
background: var(--c-bg);
border: 0.4rem solid var(--c-comment);
border-radius: 1rem;
}调试模式
将位于.debug-mode中的任何东西周围画上线。线的颜色是红色的但是遵从CSS变量--debug-colour。
你还可以将div.debug-info.over与div.debug-info.under添加到某个元素中以给调试框加注释——虽然你得确保有留下足够的垂直空间,让注释不会与其上方或下方的东西重叠。
.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after {
outline: 1px solid var(--debug-colour, red);
position: relative;
}
.debug-info {
position: absolute;
left: 50%;
transform: translateX(-50%);
font-family: 'Fira Code', monospace;
font-size: 1rem;
white-space: nowrap;
}
.debug-info.over { top: -2.5rem; }
.debug-info.under { bottom: -2.5rem; }
.debug-info p { margin: 0; }
这是什么?
这是由 用户 'Eltrac' 不存在 制作的伪链接预览组件(Fake Popup Preview),意在模仿维基百科的导航预览功能。使用者只要将鼠标放在一个超链接上,就能够看到作者预先设置好的有关这个链接页面的介绍。
该组件会在链接后生成一个? 与普通链接做区分。在小屏幕设备下,尤其是只能通过触屏点击的移动设备,需要点击这个按钮才不会在查看内容时跳转到链接对应页面。
效果演示
把鼠标移到下面的链接上试试!
Level C-599 被认为是 C 层群的第 599 层。与 类似,目前尚未有确切证据证实该层级在物质层面上存在,但它真实地位于许多人的梦境与幻想之中。
使用方法
首先,在页面顶部插入以下代码。
[[include :backrooms-wiki-cn:component:popup]]
在需要使用的位置复制粘贴以下代码并修改即可。
链接前的文字[[span class="popup"]][[[链接|链接文字]]][[span class="popup-content"]][[image 图片链接]][[span]]预览文字[[/span]][[/span]][[/span]]链接后的文字。
对于没有图片的伪预览,可以使用这个代码。
链接前的文字[[span class="popup text-only"]][[[链接|链接文字]]][[span class="popup-content"]]预览文字[[/span]][[/span]]链接后的文字。
若需要修改伪预览块的颜色,使用这个代码。如果只是想要简单兼容基于黑色标记笔制作的版式,直接复制一下代码即可,无需更改。
[[module CSS]]
:root {
--popup-bg: var(--pale-gray-monochrome); /* 修改背景色 */
--popup-text: var(--black-monochrome); /* 修改文字颜色 */
}
[[/module]]如果不喜欢链接后面的问号,可以用这个代码隐藏。
[[module CSS]]
@media screen and (min-width:768px) {
.popup::after { display: none }
}
[[/module]]
特别说明
如果你发现你添加了伪链接预览的某一段落失去了上下边距,比如出现了这样的情况:
下水道系统不同于与它重名的 ,系一极为特殊的隐秘层级。
描述:
......
在不使用伪链接预览的情况下是这样:
下水道系统不同于与它重名的 Level 34,系一极为特殊的隐秘层级。
描述:
......
这是因为某个漏洞导致 Wikidot 没有给使用了伪链接预览的段落添加 p 标签,而没有 p 标签就没有上下边距。要解决这个问题,我们就需要手动添加边距。
如果遭遇了这种情况,给对应的段落加上 popup-fix 类。
[[div class="popup-fix"]]
......
[[/div]]
[[iftags +组件]]
这是什么
我用户 'Croquembouche' 不存在用在一大堆页面上的一大堆各种各样的CSS“改进”,因为我觉得这样就能使其更容易处理。
该组件做出了很多非常细碎的改动以使得写作体验更加舒服且能够使制作组件/版式更加容易一点(也就是我经常干的事)。它不会对读者来说在视觉上改变页面中的任何东西——这些改动是为作者服务的。
我不期望用了这个组件的文章的翻译版也会用到这个组件,除非那个翻译者也喜欢这个组件而且也想用这个组件之类的。
这个组件可能不会与其它组件或版式冲突,且即使会冲突,也可能不会有什么影响。
用法
在任意维基上:
[[include :scp-wiki:component:croqstyle]]
该组件被设计于与其它组件一同使用,所以-=-是用来隐藏该文档的。在另一个组件内使用时,请确保将该组件放在[[iftags]]块内,这样你的组件的用户就不会强制同样使用 Croq 风格。
相关组件
其它个人自定义组件(只会改变一点点东西):
- RSO组件 — 用户 'Rounderhouse' 不存在
个人自定义版式(在视觉上有大的变化):
CSS修改
大小合理的脚注
不让脚注达到一百万里那么宽,让你能确实地阅读脚注。
.hovertip { max-width: 400px; }等宽字体编辑/代码
使编辑文本框内字体等宽,且将所有等宽字文本改为Fira Code,也是个明显很优秀的等宽字字体。
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap');
:root { --mono-font: "Fira Code", Cousine, monospace; }
#edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); }
.code pre * { white-space: pre; }
.code *, .pre * { font-feature-settings: unset; }电传打字机背景
给<tt>元素加上亮灰色的背景({{文本}}),使得代码片段更为突出。
tt {
background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4);
font-size: 85%;
padding: 0.2em 0.4em;
margin: 0;
border-radius: 6px;
}不要大脸
禁用悬停于某人的头像的时候出现的大图片,因为这图片又蠢又真的很烦人,想看大头像版本的话直接点击一下就行了。
.avatar-hover { display: none !important; }碎裂碎裂
任何在带有nobreak类的div中的文本可以在字母间自动换行。
.nobreak { word-break: break-all; }代码颜色
将我终端中的代码颜色加为变量。可能我会在什么时候把它改成比如Monokai或者别的更加常见的终端主题,但是现在暂时这还是我的个人主题,是从Tomorrow Night Eighties中衍生而来的。
还有,将.terminal类像[[div class="code terminal"]]一样添加到假代码方块中可以让它有一个有点伪终端样的暗色背景。不能用在[[code]]中,因为Wikidot嵌入了一大堆语法来使其高亮,不用一大堆CSS是改不动的。只能用在非[[code]]的代码片段中。
:root {
--c-bg: #393939;
--c-syntax: #e0e0e0;
--c-comment: #999999;
--c-error: #f2777a;
--c-value: #f99157;
--c-symbol: #ffcc66;
--c-string: #99cc99;
--c-operator: #66cccc;
--c-builtin: #70a7df;
--c-keyword: #cc99cc;
}
.terminal, .terminal > .code {
color: var(--c-syntax);
background: var(--c-bg);
border: 0.4rem solid var(--c-comment);
border-radius: 1rem;
}调试模式
将位于.debug-mode中的任何东西周围画上线。线的颜色是红色的但是遵从CSS变量--debug-colour。
你还可以将div.debug-info.over与div.debug-info.under添加到某个元素中以给调试框加注释——虽然你得确保有留下足够的垂直空间,让注释不会与其上方或下方的东西重叠。
.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after {
outline: 1px solid var(--debug-colour, red);
position: relative;
}
.debug-info {
position: absolute;
left: 50%;
transform: translateX(-50%);
font-family: 'Fira Code', monospace;
font-size: 1rem;
white-space: nowrap;
}
.debug-info.over { top: -2.5rem; }
.debug-info.under { bottom: -2.5rem; }
.debug-info p { margin: 0; }
著作信息
展开侧边栏组件
作者:用户 'Mercuresphere' 不存在
欢迎您来我的作者页看看我的其他作品。
这是什么?
这个组件可以改变侧栏的显示状态,使其变为默认展开。
此组件可以与黑标切换侧边栏组件联合使用,以取得与网站的移动端版本类似的外观。
使用方法:
若需使用本组件,请在你页面的任意位置插入以下代码:
[[include :backrooms-wiki-cn:component:unfold-sidebar]]
/* Unfold Sidebar */
/* By Mercuresphere */
:root {
--toggle-button-bg: rgb(var(--swatch-menubg-color));
--toggle-border-color: rgb(var(--swatch-border-color));
--toggle-border-width: 0.25rem;
--toggle-icon-color: rgb(var(--sidebar-links-text));
--toggle-roundness: 50%;
}
@media only screen and (min-width: 769px) {
#content-wrap {
max-width: unset;
display: grid;
position: static;
grid-template-columns: calc(var(--sidebar-width-on-desktop)) calc(50% - var(--body-width-on-desktop)/2 - var(--sidebar-width-on-desktop)*3/2) 1fr calc(50% - var(--body-width-on-desktop)/2 - var(--sidebar-width-on-desktop)/2);
grid-template-areas: "side-bar . content";
grid-area: content-wrap;
flex-grow: 2;
flex-direction: column;
margin: 0 auto;
width: 100%;
height: auto;
min-height: calc(100vh - var(--final-header-height-on-desktop));
}
#main-content {
position: unset;
max-height: unset;
display: grid;
grid-template-rows: auto;
grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
grid-template-areas:
"action-area-top"
"page-title"
"breadcrumbs"
"page-content"
"page-tags"
"page-info-break"
"page-options"
"action-area-btm";
grid-area: content;
flex-basis: var(--body-width-on-desktop);
margin: 0 auto;
background-color: transparent;
padding: 2rem 1rem;
width: calc(100% - 3rem);
max-width: var(--body-width-on-desktop);
}
#side-bar {
transform: unset;
transform: unset;
transition: unset;
width: unset;
min-width: unset;
grid-area: unset;
padding-right: unset;
top: unset;
max-height: unset;
position: unset;
left: unset;
padding-left: unset;
scrollbar-width: unset;
overscroll-behavior: unset;
scrollbar-color: unset;
direction: rtl;
height: calc(100vh + 2rem);
background-color: rgba(var(--swatch-menubg-color, 255, 255, 255), 1);
}
#side-bar::-webkit-scrollbar-thumb {
background-color: rgba(170, 170, 170, 1);
}
#side-bar:hover::-webkit-scrollbar-track {
background: rgba(var(--swatch-tertiary-color), .05);
}
#side-bar:hover, #side-bar:active {
padding-right: unset;
margin-right: unset;
transform: unset;
transform: unset;
overflow-y: unset;
scrollbar-color: unset;
}
#side-bar:focus-within {
padding-right: unset;
margin-right: unset;
transform: unset;
transform: unset;
overflow-y: unset;
scrollbar-color: unset;
}
#main-content::after {
content: unset;
position: unset;
display: unset;
align-items: unset;
justify-content: unset;
width: unset;
height: unset;
max-height: unset;
top: unset;
transition: unset;
left: unset;
background: unset;
background-repeat: unset;
background-position: unset;
background-attachment: unset;
background-size: unset;
pointer-events: unset;
}
#side-bar:hover+#main-content::after, #side-bar:active+#main-content::after {
left: unset;
left: unset;
background-position: unset;
background-position: unset;
transition: unset;
opacity: unset;
width: unset;
font-size: unset;
}
#side-bar:focus-within+#main-content::after {
left: unset;
left: unset;
background-position: unset;
background-position: unset;
transition: unset;
opacity: unset;
width: unset;
font-size: unset;
}
#main-content::before {
--not-ie: unset;
content: unset;
background-color: unset;
background-color: unset;
position: unset;
position: unset;
top: unset;
top: unset;
left: unset;
transform: unset;
transform: unset;
width: unset;
width: unset;
height: unset;
height: unset;
transition: unset;
opacity: unset;
pointer-events: unset;
z-index: unset;
margin-bottom: unset;
margin-bottom: unset;
}
#side-bar:hover+#main-content::before, #side-bar:active+#main-content::before {
transform: unset;
opacity: unset;
}
#side-bar:focus-within+#main-content::before {
transform: unset;
opacity: unset;
}
#side-bar .side-block {
margin-top: unset;
background-color: unset;
border-radius: unset;
border-left-width: unset;
border-right-width: unset;
direction: ltr;
}
@supports (-ms-ime-align: auto) {
#side-bar {
overflow-y: unset;
overflow-x: unset;
transform: unset;
}
#side-bar:hover, #side-bar:active {
overflow-y: unset;
transform: unset;
margin-left: unset;
}
#side-bar:focus-within {
overflow-y: unset;
transform: unset;
margin-left: unset;
}
#main-content::before {
left: unset;
transform: unset;
}
}
}
描述
Level R-920是后室R层群的第920层,其于2009年被一名探员在一次行动中偶然发现。目前,并未发现该层级的边界。
Level R-920是一片天空,其与前厅上空8300~11200m的区域类似。不同的是,该层级保持着19~21℃的恒温以及正常的1倍大气压强。该层级存在24小时的昼夜更替及中等偏弱的紫外线强度。
Level R-920的天空中飘浮着无数的云层,其成分由水滴及冰晶组成。与普通云层不同的是,该层级的云层密度约为1943kg/㎥,基本与轻质混凝土相当,这使得该层级的云层变得可踩踏。因此,加上如上文所提的宜居条件,在该层级内居住被认为是可能且现实的。对于该层级的云层为何可以飘浮的问题,目前尚无定论。
目前发现,在该层级中的流浪者貌似不会受到任何摔落伤害;且流浪者无论从何处跌落,其最终总会精准地落在一片云层上方。
于Level R-920中,云层的种类是极其繁多的。以下是目前所记录到的部分云层种类:
乳状云
湿润的暖空气上升,受到冷却而在某个温度,往往也是在某个特定的高度凝结成小水滴。当水滴形成后,这些空气也就变成不透光的云。
然而在某些情况下,它会发展成含有大水滴或冰粒的云胞,这些大水滴及冰粒在降落蒸发过程中,流失大量的热,并牵引出旺盛的沉降气流。这样的云胞最可能发生在雷雨的扰流区附近,例如出现在铁砧云端。形成的乳状云,在阳光的侧照下尤其引人注目。
乳状云是由紊流空气形成的浮力小球。与普通的平底云不同,它们有异常明确的形状。虽然在成形后只能维持数分钟,但是每块云朵可以延伸至约1.6km远。
滚轴云
滚轴云是水平的管形状云,它们的出现通常预示着暴风雨的到来,极少情况下也出现在暴风雨即将结束的时候。
当暴风雨临近时,寒冷的向下气流扩展开来就会形成滚轴云。这种快速下沉气团能够袭击陆地表面,它所形成的强烈空气流能够抵达非常远的距离。该冷气流将滑落在热气流层下面,然后被暴风的垂直上升气流抽吸起来,之后滚轴云将冷凝热气流中的蒸汽形成云层。最终,滚轴云将与暴风的主体云层相脱离。
滚轴云理论上是较为危险的,曾测量到滚轴云产生的上升气流和下沉气流速度每分钟超过1500m。但经实验发现,该现象并不会对流浪者产生任何伤害。
当稳定的空气受到干扰时,会产生波浪云,导致空气沿着干扰移动。这种干扰通常是在来自移动的冷干燥空气与相对稳定的温暖潮湿空气区域碰撞时产生的。如果稳定的空气层是潮湿的,当空气向上流动时,则在顶部形成云。当空气向下流动时,则云层蒸发。云的交替缺失和存在是产生波浪效果的原因。
积雨云
积雨云,云体浓厚而庞大,垂直发展极其旺盛,。云顶由冰晶组成,有白色毛丝般光泽的丝缕结构,常呈铁砧状或马鬃状,云底阴暗混乱,起伏明显,有时呈悬球状结构。积雨云即可产生于气团内部,也可形成在锋面上。顶部开始冻结,轮廓模糊,有纤维结构,底部十分阴暗,常有雨幡及碎雨云。
积雨云内上升气流非常强烈,垂直速度可达20m/s至30m/s,最大可达60m/s,相较于台风风速更大。在如此强烈的上升气流中,水滴不断增大,含水量也明显增大。如果水汽供应十分充足并源源不断,那么,这种剧烈的上升气流也就托不住不断增大的水滴,于是便会落下形成暴雨。
形成积雨云的3个必要条件:
- 大量的不稳定能量。要产生对流天气,首先大气层结不稳定,在储存有大量不稳定能量的大气中,一旦受到足够的冲击力,不稳定能量就会释放出来,变为空气上升运动的动能。
- 充足的水汽。充沛的水汽也是形成雷暴的必要条件,如果没有充沛的水汽,即使发生了对流,也不可能产生高大的雷暴云。所以,雷暴云多出现在水汽充沛的时间或地区。
- 足够的冲击力。大气中不稳定能量和水汽的存在,具备了发生雷暴的可能。要使可能变为现实,还需要有足以使空气上升,到达自由对流高度以上的冲击力,这样不稳定能量才能释放出来,上升气流才能强烈发展,形成雷暴云。
较庆幸的是,该现象并不会对流浪者产生任何实质性伤害。
糙面云
糙面云,即层积云在强气流天气的作用下,堆积到极限发生褶皱,外貌变得极为恐怖的一种现象,是波状层积云进一步发展的极端状况。有着强烈的扭曲和波动,这是糙面云的一个特征。糙面云的出现往往代表了恶劣天气即将结束。
目前,对于糙面云的目击记录仍较少。
除上述外,在Level R-920内仍发现了极多其它天气现象,部分内容如下:
日晕
日晕是一种大气光学现象,是由日光通过卷层云时,受到冰晶的折射或反射而形成的。当光线射入卷层云中的冰晶后,经过两次折射,分散成不同方向的各色光。
它的形成与高云有关。有卷层云时,天空中会飘浮着无数冰晶。在太阳周围且与太阳在同一圈上的冰晶,能将同一种颜色的光折射到人的眼睛里形成内红外紫的晕环,天空中有冰晶组成的卷层云时,往往在太阳周围出现一个或两个以上以太阳为中心、内红外紫的彩色光环,有时还会出现很多彩色或白色的光点和光弧,这些光环、光点和光弧统称为冰晕。
幻日
“幻日”现象一般会出现在早晨5时30分至6时之间或者上午9时左右,傍晚同样也会出现。但一般不会出现在正午,因为正午太阳直射,不满足折射的条件。且中午的太阳光线相对过于强烈,即便有这个现象,肉眼也不可能观测到。
出现“幻日”现象需要满足非常严苛的条件。首先要有卷层云,有云才会形成冰晶;其次云层要薄,透光率要好,这样才能把太阳光折射出来;还有很重要的一点,就是太阳与冰晶以及观察者之间的角度要正好,稍微偏一点就无法观察到。因此,“幻日”这种大气光学现象极为罕见。
目前,并没有记录到幻日的照片。
因篇幅有限,仅展示如上天气现象。目前,在Level R-920中仍在不断发现新的天气现象,若有新发现,请迅速告知档案部。
基地、前哨和社区
在Level R-920内,建立了相当大数量的前哨站。目前,仅是记录在案的前哨站,就多达673个,其中可对该层级做出较大改变的也多达27个。为防止该层级内的前哨对层级环境做出改变,经多组织的联合商讨,已全方面禁止向该层级中排放过多有害物质;目前对于该层级的环境问题已经得到了极大的改善。
入口与出口
入口
- 在任意室外层级切入一片云,可进入该层级。
- 在登上一片可踩踏的云层即可切入该层级。
出口
- 于空中持续下坠一段时间可切入。
- 在云层中找到一座木质的桥并登上它可返回。
页面版本:3,最后编辑:2023年9月8日 18:01(UTC+08:00)