SCP-CN-2622
/* 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;
}
 
@media (min-width: 768px) {
 
    #top-bar .mobile-top-bar {
        display: block;
    }
 
    #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-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;
    }
    }
}
评分: 0+x

What this is

A bunch of miscellaneous CSS 'improvements' that I, CroquemboucheCroquembouche, 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):

Personal styling themes (which are visual overhauls):

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; }
评分: 0+x
项目编号:SCP-CN-2622 3/CN-2622级
项目等级:Euclid 机密

特殊收容措施:一座部署于近地面轨道上的空间轨道炮(型号PLX-20220802,具体图纸参见附属文件CN-2622-α)将保持戒备状态,以准备在任意时刻对项目所处的空间站进行射击。切断与其原属国家航天部门的所有联系以防止危害信息对地面造成影响。所有与项目的交流尝试需经过三名四级人员或一名五级人员的授权后由D级人员实施;机动特遣队MTF-癸未-54“太空漫游者”已成立,用于尝试回收项目源数据。

描述:SCP-CN-2622是原被部署在██空间站中的人工智能系统(编号003-789-███),其名为“二猫.aic”(没想好名字,先用这个)。项目被认为其源代码发生了异常修改,使其对人类产生敌意,并杀死了此前驻扎在其空间内的两名宇航员。因其对于人类的敌意,基金会尚无方法回收项目或其源数据。

发现:2025年8月██日,项目所处的空间站正式开始服役。2026年9月██日,第三批宇航员(共两人,Kathering Corena和Ceyard Quin)进入空间站并开始执行其任务;十四天后,空间站在日常向地面发送数据时出现了一个参数错误;半小时后,项目自行切断了空间站与地面的一切联系,并拒绝再次连接三小时五十六分钟。在再次建立联系后,地面检测到两名宇航员的生命信号消失。同时,驻扎在基金会空间站γ的人员注意到一具身着宇航服的死尸正漂浮在空间站外部,人员随即将此事报告给基金会地面人员,并组织了尸体的回收工作。尸体身份被确定为Ceyard Quin。在尸体被送回地面后,尸检结果显示其死因为宇航服内部氧气浓度过高而造成的急性氧中毒。10月██日,基金会与██政府达成交易,基金会获得了项目所处空间站的连接控制权和所有权。12月██日,空间轨道炮于近地面轨道部署完成。

    • _

    附录I - 空间站外部监控录像

    (开始播放)

    (Ceyard Quin正在进行舱外作业。Quin使用其宇航服右侧腰部安装的绳索与空间站进行连接)

    3分11秒:Quin的电子喷气背包失去动力;悬浮于空间站外部。

    5分13秒:Quin似乎完成了与空间站内部人员的联络。开始抓住绳索试图返回空间站。

    6分34秒:宇航服出现了气体轻微泄露的迹象。Quin暂停了返回空间站的行动,开始尝试修补宇航服。Quin因气体泄漏产生的反作用力开始向镜头左侧移动,速度逐渐增加。

    9分47秒:在修补宇航服的尝试未果之后,Quin发现了其自身正在不断运动的状态,之后行动出现明显停顿。此时,连接Quin和空间站的绳索异常断开。Quin开始不断进行自转。

    10分32秒:Quin飞离摄像头摄制范围。

    17分03秒:Quin再次飞入镜头内。此时已经能明显察觉到Quin与空间站之间的距离在不断增大。Quin依然在不断的进行着绕空间站的公转运动和自身的自转运动。其四肢正在不断的舞动。宇航服的漏气仍在继续。

    22分24秒:Quin飞离镜头范围。

    36分17秒:Quin第三次进入镜头内。其运动未停止。四肢已停止舞动,自然的放置在两侧。能够看到其宇航服外部气压密度警告灯亮起。

    43分56秒:Quin飞离镜头范围。

    1小时8分6秒:Quin第四次飞入镜头内。其运动未停止。能够观察到其宇航服外部除气压密度警告灯亮起外,氧气浓度警告也亮起黄灯1。Quin重新开始挣扎,不断的拍打宇航服和头盔,无果。

    1小时21分18秒:Quin飞离镜头。

    2小时0分34秒:Quin第五次飞入镜头内。其宇航服外侧的漏气现象消失,并且宇航服外侧亮起了生命迹象警告灯。Quin的四肢开始无序的在身体两侧运动。推测此时Quin已死亡。

    (录像结束)

    附录II - 空间站内监控录像和操作记录
    (注:该段录像的记录事件在附录I中记录事件之后发生。)

    0分1秒:Kathering Corena失去与舱外工作人员的联络。Corena瘫坐于座位上。

    10分1秒:Corena开始尝试修复无法与地面进行联系的通讯装置,并大声咒骂。舱内其他其他设备运作正常。

    12分17秒:舱内传来警报声和语音声,语音内容为“检测到附属舱内出现液体渗漏和设备损坏”。Corena停止了修复尝试,飞入附属舱内,对附属舱内的电脑设备进行操作。

    13分18秒:警报声停止。Corena开始清理附属舱内杂物。

    13分27秒:附属舱内电脑屏幕出现窗口显示“数据删除完成”,随后窗口关闭。电脑进入关机状态。

    13分36秒:附属舱舱门关闭。Corena被关在附属舱内部,尝试重新开启电脑,拍打舱门,重新开启舱门,均未果。

    16分5秒:附属舱完成与空间站的对接分离步骤,正式与空间站断开连接。并且向舱外人员所处位置的相反位置进行飞行。

    (以下为附属舱内摄像头录制部分)

    20分14秒:Corena接受自己驶离空间站的事实。开始尝试重启电脑设备。

    20分58秒:附属舱内断电。摄像头进入备用电源摄影状态。

    22分2秒:附属舱开始进行排气操作。Corena开始对舱门进行猛烈拍打。

    23分17秒:Corena因舱内气压过低而昏迷。

    23分57秒:Corena因身体内外气压差过大而“炸裂”。碎片布满整个舱体。

    24分17秒:附属舱电力恢复。动力恢复。运作两小时四十七分钟后停止。

    (录像结束)

    后记:附属舱在运作完成后,在与基金会空间站相同的轨道上进行了停泊和稳定运行。在基金会完成于该国政府的交易之后的第二十三天,基金会对附属舱进行了回收和对接工作,并对碎片进行了清理。基金会正在对附属舱内电脑数据进行还原和解读。

      • _

      附录III - 空间站内部语音记录
      (注:此语音记录发生时间略早于此前两个附录)

      Corena:噢!早上好,Quin。你还记得我们今天要干点什么吗?

      Quin:Ugh……今天你需要进行两项空间站物理实验数据的采集,以及对空间站内数据传输设备进行检修。我要储藏检修机械臂,并且进行一些拍摄工作。

      Corena:行。那你先去洗把脸,我去把检修工作做了。只是简单的代码检查和查看工作。

      (Corena开始检查数据传输数据代码。此时空间站内部网络报告了一次传输参数错误)

      Corena:嗯?正好吗?让我看看……(Corena发现该参数本不应该存在于传输设备代码中)奇怪……Quin,你过来看看。

      Quin:来了。这什么……(停顿)嗯?这个参数所在的模块不是用来进行数据篡改的吗,为什么会在传输设备里。

      Corena:我想我们可能找到了那帮开发人员的漏洞了。你看,我把所有代码调出来之后……你看这两个部分,这个部分是用来数据篡改的,那个错误的参数在这。还记得我们昨天做的那个实验吗,我估计那个实验数据在压缩之后出现了参数的重复,导致了传输失败……S**t,要不是传输失败,我们还不知道地面那群混蛋还留了这么一手。

      Quin:Corena你先别急。你看另一个部分,它被放在数据篡改部分之前进行运行,我们所有的数据会先压缩一次然后被发送到这两个未知的权限位置,相当于真实的数据其实被发送或是存储在了这两个位置。Corena,你能尝试越过权限查看这两个位置么。

      Corena:我试试。(键盘操作声)诶!你说这两个位置不会是专门给宇航员留的吧,就是对公众公开的数据进行部分篡改,然后宇航员拿到这两份数据回去进行正确的研究。

      Quin:你先别多想。先看看这两个位置到底是什么。

      Corena:真是……好了找出来了。这两个位置其实是装置内部两个并列的电磁波发送装置。在整个装置的这个位置,在设计图上这个部分原本是ai核心的部分,这两个应该是被藏在了主板下面。我越过了权限,看到的是这样一个界面。

      (电脑屏幕上出现的是基金会标志以及账户登录界面)

      Corena:不是,这什么东西……控制,收容,保护。还SCP基金会……Quin你听说过这样一个组织吗?

      Quin:没,不过能在我们空间站的传输设备上做手脚的组织应该也不会是什么小组织,而且篡改数据……多半没什么好事。把这个东西记录下来然后准备报给地面吧,这不是我们所能处理的事情。我去准备出舱工作。(离开)

      Corena:行……这基金会会不会是部门里什么神秘部门啊……我试试我的用户名看。(键入用户名和密码)啊,不对。算了。

      (Corena退出了账户界面,并且将界面还原至初始状态。Corena随后存储了原始数据,并加入了关于隐藏发送装置以及账户事件的信息;之后Corena绕开篡改程序准备进行发送。此时空间站和地面的传输中断)

      Corena:Quin,我们和地面的数据传输断了。

      Quin:这……等我回来一起修吧。你先协作一下舱外工作。

      Corena:行。我到主舱去,你先把宇航服穿好,等我给你开启舱门。

      (录音结束)

      附录IV - I 空间站在发射前所搭载的设备清单
      (无关数据以略去)
      空间站ai:二猫.aic 已取消搭载ai的计划,空间站网络存储量不足以搭载ai。


      附录IV - II 基金会地面设施信息记录

      信息记录 - 登录失败警告
      Site-CN-00, ██/09/2025


      注意,基金会空间数据传输阵列(编号SF-OS-001)检测到一次异常的账户入侵(异常点:未进行权限验证,直接进入账户登入页面),并输入了完全错误的账户名和密码。阵列当前所处位置为██空间站数据传输装置内。请人员及时处理。

      信息记录 - 操作记录
      Site-CN-00, ██/09/2025


      您已经通过基金会在空间站内部网络所留下的后门实现了对空间站对外传输数据权限的锁定。请问接下去要采取的措施。

      查看空间站内人员状态。

      空间站内部当前有两名宇航员驻扎。一名正在进行舱外作业,一名正在进行协助工作。

      将此事上报给空间部门主管和监督者议会,并询问是否进行攻击操作。

      空间部门主管和监督者议会已传回指令。批准了对空间站内部两名人员的攻击行为,要求,不对空间站主体进行破坏性动作。同时监督者议会已向掩盖部门发送消息,要求建立SCP-CN-2622档案以掩盖本次攻击活动。

      进行攻击。

      一名宇航员已死于其宇航服内部氧气浓度过高而造成的急性氧中毒。

      一名宇航员已死于附属舱内气压过低而造成的内爆。

      攻击完成。

      信息记录 - 操作记录
      Site-CN-00, ██/09/2025


      向附属舱发送航程数据,使其停靠在与基金会空间站相同的轨道上进行运作。向空间站发送数据,使其断开与原地面之间的联系,并于基金会空间站进行数据交互工作。安排人员准备进入项目所在空间站进行操作。

      信息记录 - 操作记录
      Site-CN-00, ██/10/2025


      完成附属舱和空间站之间的对接工作。

      完成项目所处空间站与基金会空间站的对接工作。

      掩盖工作完成。

除非特别注明,本页内容采用以下授权方式: Creative Commons Attribution-ShareAlike 3.0 License