SCP-6641

SCP-6641
作者：NDHeckfire
发布于 2022 年 1 月 19 日

SCP-6641
By: EvkesraRe
Published on 12 Feb 2022 07:10

What this is

A bunch of miscellaneous CSS 'improvements' that I, Croquembouche, use on a bunch of pages because I think it makes them easier to deal with.

The changes this component makes are bunch of really trivial modifications to ease the writing experience and to make documenting components/themes a bit easier (which I do a lot). It doesn't change anything about the page visually for the reader — the changes are for the writer.

I wouldn't expect translations of articles that use this component to also use this component, unless the translator likes it and would want to use it anyway.

This component probably won't conflict with other components or themes, and even if it does, it probably won't matter too much.

Usage

On any wiki:

[[include :scp-wiki:component:croqstyle]]

This component is designed to be used on other components. When using on another component, be sure to add this inside the component's [[iftags]] block, so that users of your component are not forced into also using Croqstyle.

Related components

Other personal styling components (which change just a couple things):

• RSO Component — Rounderhouse

Personal styling themes (which are visual overhauls):

• Magnus Web Format — DrMagnus
• Flopstyle CSS — Lt Flops
• Blankstyle CSS — HarryBlank
• Placestyle CSS — Placeholder McD
• Jakstyle — JakdragonX

CSS changes

Reasonably-sized footnotes

Stops footnotes from being a million miles wide, so that you can actually read them.

.hovertip { max-width: 400px; }

Monospace edit/code

Makes the edit textbox monospace, and also changes all monospace text to Fira Code, the obviously superior monospace font.

@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; }

Teletype backgrounds

Adds a light grey background to <tt> elements ({{text}}), so code snippets stand out more.

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;
}

No more bigfaces

Stops big pictures from appearing when you hover over someone's avatar image, because they're stupid and really annoying and you can just click on them if you want to see the big version.

.avatar-hover { display: none !important; }

Breaky breaky

Any text inside a div with class nobreak has line-wrapping happen between every letter.

.nobreak { word-break: break-all; }

Code colours

Add my terminal's code colours as variables. Maybe I'll change this to a more common terminal theme like Monokai or something at some point, but for now it's just my personal theme, which is derived from Tomorrow Night Eighties.

Also, adding the .terminal class to a fake code block as [[div class="code terminal"]] gives it a sort of pseudo-terminal look with a dark background. Doesn't work with [[code]], because Wikidot inserts a bunch of syntax highlighting that you can't change yourself without a bunch of CSS. Use it for non-[[code]] code snippets only.

Quick tool to colourise a 'standard' Wikidot component usage example with the above vars: link

: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

Draw lines around anything inside .debug-mode. The colour of the lines is red but defers to CSS variable --debug-colour.

You can also add div.debug-info.over and div.debug-info.under inside an element to annotate the debug boxes — though you'll need to make sure to leave enough vertical space that the annotation doesn't overlap the thing above or below it.

…like this!

.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; }

/* 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;
        border: 0.2em solid #888;
        background-color: #fff;
        border-radius: 3em;
        color: #888;
        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: 708px;
        margin: 0 auto;
        padding: 0;
        transition: max-width 0.2s ease-in-out;
    }
 
    #side-bar {
        display: block;
        position: fixed;
        top: 0;
        left: -20em;
        width: 17.75em;
        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;
 
        scrollbar-width: thin;
    }
 
    #side-bar:target {
        left: 0;
    }
    #side-bar:focus-within:not(:target) {
        left: 0;
    }
 
    #side-bar:target .close-menu {
        display: block;
        position: fixed;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        margin-left: 19.75em;
        opacity: 0;
        z-index: -1;
        visibility: visible;
    }
    #side-bar:not(:target) .close-menu { display: none; }
 
    #top-bar .open-menu a:hover {
        text-decoration: none;
    }
 
    /* FIREFOX-SPECIFIC COMPATIBILITY METHOD */
    @supports (-moz-appearance:none) {
    #top-bar .open-menu a {
        pointer-events: none;
    }
    #side-bar:not(:target) .close-menu {
        display: block;
        pointer-events: none;
        user-select: none;
    }
 
    /* This pseudo-element is meant to overlay the regular sidebar button
    so the fixed positioning (top, left, right and/or bottom) has to match */
 
    #side-bar .close-menu::before {
        content: "";
        position: fixed;
        z-index: 5;
        display: block;
 
        top: 0.5em;
        left: 0.5em;
 
        border: 0.2em solid transparent;
        width: 30px;
        height: 30px;
        font-size: 30px;
        line-height: 0.9em;
 
        pointer-events: all;
        cursor: pointer;
    }
    #side-bar:focus-within {
        left: 0;
    }
    #side-bar:focus-within .close-menu::before {
        pointer-events: none;
    }
    }
}

▷ Show Code ◁

@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap);
 
/* Centered Header Sigma-9
 * [2021 Wikidot Component]
 * By Lt Flops (CC BY-SA 3.0)
 * Forked from:
   * Penumbra Theme by EstrellaYoshte
 * Also based on:
   * Centered Header BHL by Woedenaz
**/
 
/* ---- VARS ---- */
 :root{
     --titleColor: hsl(0, 0%, 95%);
     --subtitleColor: hsl(60, 62%, 85%);
     --lgurl: url(https://scp-wiki.wdfiles.com/local--files/component%3Acentered-header-sigma-9/logo.svg);
}
 
/* ---- SITE BANNER ---- */
 #header,
 div#header{
     background-image: none;
}
 
 #header::before{
     position: absolute;
     width: 100%;
     height: 100%;
     content: "";
 
     background-image: var(--lgurl);
     background-position: center top;
     background-repeat: no-repeat;
     background-size: auto 10.55em;
     opacity: .33;
}
 
 #header h1,
 #header h2{
     float: none;
     margin-left: 0;
 
     text-align: center;
}
 
 #header h1 span,
 #header h2 span{
   /* Hide the Existing Text */
     display: none;
}
 
 #header h1 a::before,
 #header h2::before{
   /* Style the New Text */
     font-family: "Montserrat", "Arial", sans-serif;
     text-shadow: none;
}
 
 #header h1 a::before{
     position: relative;
     bottom: .15em;
 
     color: var(--titleColor);
 
     font-size: 115%;
     font-weight: 700;
}
 
 #header h2::before{
     position: relative;
     top: .1em;
 
     color: var(--subtitleColor);
 
     font-size: 130%;
     font-weight: 600;
}
 
 #header h1 a::before{
   /* Set the New Text's Content From Variable */
     content: var(--header-title, "SCP FOUNDATION");
}
 
 #header h2::before{
     content: var(--header-subtitle, "SECURE - CONTAIN - PROTECT");
}
 
/* ---- SEARCH ---- */
 #search-top-box{
     top: 1em;
     right: 0;
}
 
 #search-top-box-form input.button{
     margin-right: 0;
}
 
 #search-top-box-input,
 #search-top-box-input:hover,
 #search-top-box-input:focus,
 #search-top-box-form input[type=submit],
 #search-top-box-form input[type=submit]:hover,
 #search-top-box-form input[type=submit]:focus{
     border-radius: 0;
     box-shadow: none;
 
     font-size: 100%;
}
 
/* ---- TOP BAR ---- */
 #top-bar{
     right: 0;
     display: flex;
     justify-content: center;
}
 
 #top-bar ul li ul{
     border-bottom: 1px solid hsl(0, 0%, 40%);
     box-shadow: none;
}
 
/* ---- LOGIN ---- */
 #login-status{
     top: 1.1em;
     right: initial;
 
     color: hsl(0, 0%, 87%);
}
 
 #account-topbutton{
     border-color: hsl(0, 0%, 87%);
 
     font-size: 100%;
}
 
/* ---- PAGE TITLE ---- */
 .meta-title,
 #page-title{
     text-align: center;
}
 
/* ---- BREADCRUMBS ---- */
 .pseudocrumbs,
 #breadcrumbs{
     text-align: center;
}
 
/* ---- MOBILE DISPLAY ---- */
 @media (max-width: 767px){
     #search-top-box{
          top: 1.85em;
          width: unset;
    }
 
     .mobile-top-bar{
          position: relative;
          left: 0;
          display: flex;
          justify-content: center;
    }
 
     #login-status{
          top: 0;
          right: 0;
    }
 
     #header .printuser{
          font-size: 0;
    }
 
     #header .printuser img.small{
          margin: 0;
 
          transform: translate(6px, 4px);
    }
 
     #my-account{
          display: none;
    }
 
     #account-topbutton{
          margin-left: 2px;
    }
}

---

项目编号：項目編號：SCP-6641

等级等級1

收容等级：收容等級：

euclid

次要等级：次要等級：

{$secondary-class}

扰动等级：擾動等級：

dark

风险等级：風險等級：

需谨慎

备忘录链接

---

负责站点	站点主管	首席研究员	指派特遣队
Site-400	Director Adam Desmond	N/A	N/A

---

特殊收容措施：已批准Orville博士继续于基金会进行长期工作。然而，其应被予以持续监视以记录SCP-6641-1的行动。

描述：SCP-6641为一异常现象的指称，目前影响着基金会高级研究员Ogden Orville，其于Site-400天文研究部门担任负责人。

上午7:00至下午11:00时分，每当Orville博士试图于任何地点入睡时，一条无毛且灰色皮肤的半实体手臂（称为SCP-6641-1）将出现于Orville博士的后背，并使用任何必要手段将其从睡眠中唤醒。

当SCP-6641-1成功唤醒Orville博士时，其将立即消失。

附录6641.1：SCP-6641-1出现记录

下为一些值得注意的SCP-6641-1出现事件：

日期与时间	地点	事件描述
2017年5月12日（下午12:54）	Site-400的个人休息室	在进行一个与异常无关的报告后，Orville博士于长椅上简单地入睡。随后SCP-6641-1出现并开始扇打他的脸，导致他立刻惊醒。
2017年5月14日（上午9:04）	Site-400的模因研究实验室外	在研究实验室外面的等候厅里，Orville博士在一长椅上打起瞌睡。SCP-6641-1出现并开始扇打他的脸，但未能将他唤醒。随后其紧抓Orville博士的头发并使劲拉扯。该行为使得Orville博士醒来并痛苦地喊叫。
2017年8月24日（下午6:53）	Site-400的多功能会堂	Orville博士参加了一个由Placeholder McDoctorate博士举办的讲座，关于外行星超形上学叙事。讲座进行30分钟后，Orville博士开始睡着，并导致了SCP-6641-1的出现。随后引起了Placeholder博士的注意，Placeholder博士向Orville博士靠近，试图叫醒他。这成功了，且SCP-6641-1在消失前竖起了中指。
2017年9月7日（下午3:53）	Site-400的个人休息室	详见附录6641.2

附录6641.2：事故日志

2017年9月9日，Orville博士偶然睡在Site-400人员休息室里的长椅上。需注意的是，其他基金会人员亦在该休息室中。下为该事件复原的视频记录：

视频日志6641.27

在场职员：

• Ogden Orville博士
• Bellatrix Fuller博士
• 研究员Kain Stalos
• Edan Lohlainn博士
• 探员Carlos Sierra
• Kyran Kelly博士

---

<记录开始>

视频显示，Orville博士正在睡觉，头靠在长椅的扶手上。其戴着一个摩托车头盔，可能是为了防止SCP-6641-1将其吵醒。基金会的其他职员正在吃饭或者互相谈话。

SCP-6641-1出现于Orville博士身后。一开始，它轻轻敲击Orville博士的头盔，随后用力拍打其面罩。但Orville博士仍在睡觉。这引起了Kelly博士的注意。

Kelly博士：嘿伙计们，快看。（指着SCP-6641-1）。这家伙又在Orville旁边了。

Lohlainn博士：哦不。我可怜的Orville。我们要……做点什么吗？

探员Sierra起身离开椅子，慢慢地接近SCP-6641-1和Orville博士。

探员Sierra：我就直说了，我对你打扰我朋友的行为感到厌恶。你就不能离远点，好让Orville休息会，啊？他已经忙了一整天了，你就不能让他打个盹吗？

SCP-6641-1逼近探员Sierra地脸并用力一弹。探员Sierra痛苦地倒在地上。

探员Sierra：靠，他妈的！

Kelly博士：见鬼！额你还好吗，Carl？

探员Sierra：没什么大问题。快来帮我抓住这傻逼玩意。

Fulller博士：大伙们，我想我们只要坐着——

Kelly博士跑向SCP-6641-1并抓住其上臂。试着将其撂到地上，但SCP-6641-1的双指戳中Kelly博士的双眼。他痛苦地喊叫着，眼泪在脸上滑落。

探员Sierra：嘿，你个混蛋！

探员Sierra拔出其手枪，但立刻被SCP-6641-1缴械。手枪落在地上，SCP-6641-1掐住探员Sierra的脖子并将其举高，试图让其无法呼吸。

Fulller博士：我的妈呀。Edan！Kain！快找人来帮忙，带点有用的东西来！

Lohlainn博士和研究员Stalos迅速离开休息室。Fuller博士捡起Sierra的手枪，检查弹夹并后退了几步，将枪口对准SCP-6641-1。

Kelly博士：别，Fuller！你不——

Fuller博士扣下扳机。子弹击中SCP-6641-1的手腕，随即传来一阵未知来源的哀嚎声。SCP-6641-1扔下探员Sierra，并冲向Fuller博士，中弹伤口处渗出未知黑色物质。

SCP-6641-1抓住Fuller博士的脖子并将其举高，随后将其摔在地面上。Lohlainn博士和研究员Stalos回到了休息室，前者手握大型消防斧。研究员Stalos注意到了SCP-6641-1并一把夺过Lohlainn博士手里的斧子。他将SCP-6641-1与Orville博士背部相连的肢体砍断。

随后再次传来一阵哀嚎，研究员Stalos继续砍其下肢。20秒后，完全将SCP-6641-1从Orville博士身上切断。正当Orville博士将醒来之时，SCP-6641-1遗骸渐渐消失。

Orville博士：（打哈欠）哎哟，做了个怪梦。等会。（看向手表）哦天呐！我睡着了！我竟然睡着了，那混蛋手臂没来烦我！天呐，太棒了。感谢老天，我猜它肯定自己滚蛋了。伙计们，你们绝对不会信——哇哦。这他妈的发生了啥？

探员Sierra：愿你好梦，Orville。

<记录结束>

---

站点警卫人员随后到达现场，并及时救治Fuller博士、Kelly博士和探员Sierra。然而，所有参与此事的基金会职员（除Orville博士）都受到了谴责，为其在未经同意与批准的情况下参与异常事件。

2017年9月7日，SCP-6641被重新分级为无效化。

‡ 授权 / 引用

请按如下方式引用此页：

“SCP-6641”，作者 NDHeckfire，来自 SCP 维基。原文链接：https://www.scpwiki.com/scp-6641。译者 EvkesraRe，来自 SCP-CN 维基。译文链接：http://scp-wiki-cn.wikidot.com/scp-6641。遵循 CC-BY-SA 协议。

更多详情请参阅授权指南。
授权信息

更多维基文档信息，请见版权信息总览。