SCP-CN-1542
SCP-CN-1542
By: YlumwlneYlumwlne
Published on 29 Nov 2019 04:36
评分: +57+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; }
/* 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-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;
    }
    }
}

评分: +57+x

SCP-CN-1542
Author:
Black_scarBlack_scar&
YlumwlneYlumwlne
Published on 29 Nov 2019 04:36

项目编号:項目編號:SCP-CN-1542

等级-等級-

收容等级:收容等級:KETER

扰动等级:擾動等級:EKHI


负责站点負責站點


N/A

站点主管站點主管


N/A

首席研究员首席研究員


Dr.Yuan

指派特遣队指派特遣隊


丁寅-03、丁寅-07、Eta-11

项目编号:項目編號:SCP-CN-1542

等级-等級-

收容
等级:
收容
等級:
KETER

扰动
等级:
擾動
等級:
EKHI


负责站点負責站點


N/A

站点主管站點主管


N/A

首席研究员首席研究員


Dr.Yuan

指派特遣队指派特遣隊


丁寅-03、丁寅-07、Eta-11


song.jpg

研究员███对事件#CN-1542-A-153中获得的家庭录像进行分析得到的乐谱,异常部分已遮挡

特殊收容措施:SCP-CN-1542无法被完全收容。要求MTF-丁寅-03(“另眼”)持续监控互联网上与庆生相关的音/视频记录,并借助“Birth-B-03”程序,对其按事件SCP-CN-1542-A发生可能性大小进行分析与筛选。MTF-丁寅-07(“白驹”)各分小组随时待命,一旦事件SCP-CN-1542-A发生,迅速对现场及周围人员进行C级记忆清除,必要时可消灭部分未知是否已受该事件影响的平民。

若事件SCP-CN-1542-A影响1000人以上,或影响范围扩散到半径5千米,则协议“天聋地哑”生效以防止可能导致的AK级情景发生。此时应立即申请调用MTF-Eta-11(“残忍野兽”)派遣现场,联合事件发生地附近武装性机动特遣队迅速对该地进行封锁,并进行暂时性的无差别声音抹除以防止事件的进一步扩散。

描述:SCP-CN-1542是一类歌曲的总称。表面上看,SCP-CN-1542全部属于歌曲Happy birthday to you1的不同版本,其歌词语种包括英语、汉语、俄语、法语、日语、阿拉伯语及西班牙语等19种语言,且种类仍在增加。SCP-CN-1542的共同点是均在特定位置附近出现了相似的不和谐的变调。

项目的异常性质在于,当SCP-CN-1542被人类群体合唱时,会对歌唱者(称为SCP-CN-1542-1)及其他听众(称为SCP-CN-1542-2)造成某种认知危害,从而引发异常现象SCP-CN-1542-A。已知SCP-CN-1542的合唱录音同样具有此效果。

SCP-CN-1542-A按时间顺序分为以下三个阶段:

  1. 第一阶段:
    • SCP-CN-1542-1不断重复歌唱SCP-CN-1542,并出现对食物的轻微认知失常。
    • SCP-CN-1542-2出现较为强烈的跟唱欲望,并在阶段结束时全部转化为SCP-CN-1542-1。
    • 若SCP-CN-1542-1中存在生日2为当天的个体(优先称为SCP-CN-1542-3),则进行下一阶段。
  2. 第二阶段:
    • SCP-CN-1542-3恢复正常意识,并失去运动功能。
    • SCP-CN-1542-1尝试用手指抹下SCP-CN-1542-3的部分身体组织,且其肢体末端会产生某种未知物理现象使得这一行为易于进行。随后SCP-CN-1542-1会尝试将手中的身体组织涂抹在彼此的身体之上3。期间SCP-CN-1542-3会表现出极大的痛苦与恐慌,SCP-CN-1542-1则表现出愉快的情绪与对SCP-CN-1542-3反应的无意识。该过程持续时间从15分钟到1小时不等。
    • 少部分情况下,部分SCP-CN-1542-1将会在这一过程中短暂地恢复正常意识。
  3. 第三阶段:
    • SCP-CN-1542-1尝试将SCP-CN-1542-3的身体尽可能地等分并将其吞食,此时SCP-CN-1542-3在绝大多数情况下仍处于意识清醒状态。

SCP-CN-1542-A结束后,SCP-CN-1542-1将恢复正常意识。


附录


音频文件#CN-1542-A-42-2:

以下为事故#CN-1542-A-42中回收的音频文件。为便于查阅以及安全起见,档案部已对录音进行剪辑。

音频记录#CN-1542-A-71-3:

录音回收于事件CN-1542-A-71中,受害者的录音设备内。由于本案例较为典型,故置于录音档案首条。


日期:24/11/19█

地点:中国辽宁省大连市██区

人物:李元峰(CN-1542-A-71-A01),胡柳(-A02),夏文(-A03),姜李萍(-B01),以及7名其余人员。以上人员下文中均以编号指代,详细对应名单见附表CN-1542-A-71-9。


[记录开始,00:00]

[按键声]

-A01:都跟你说了,我这人五音不全。

-A02:问题是就你会弹吉他,就当给姜姐当小丑,算祝寿节目了。

-A01:别别别,你要不还是就让我说两句得了。

-A02:不是你让我帮忙打听姜姐生日的吗,搞出这个什么、啊,浪漫生日会,现在又怂了?

-A01:不是,我是真的不——

-A02:你不行是吧?我告诉你,这次你不行也得行!喂!姜姐!李元峰他有事要和你说!

-A01:*小声且急促* 我[脏话编辑],不是你[脏话编辑]干什么呢胡柳!

-B01:*轻笑声* 小李,你这抱着吉他是要干什么呀?

-A01:呃,姜姐这不是过生日嘛。我,我想给你唱首歌,祝你生日快乐。

[起哄声,B01笑声]

-A02:得嘞!老夏,关灯!咱们大家一起跟着唱啊,预备——


[03:59至10:09歌声部分已编辑]


-A02:停一停大家,不要唱了!今天我在这里,祝咱们姜姐和我的好哥们小李……

[背景合唱声持续消音中]

-A02:大家停一停,让我说两句。哎,老夏给我拿点吃的过来。

[背景合唱声持续消音中]

-A02:*哼唱* 祝你生……呸!这破玩意儿能吃吗?再给我——等一下,我还没说完……

[背景合唱声持续消音中]

-A02:[歌声已编辑]


[11:38至48:09歌声部分已编辑]


[背景合唱声持续消音中]

-B01:先停一下,我感觉我好像,好像突然动不了了——

[跌落声,推测为B01]

-A02:*笑声*……生日快乐!我想再次祝姜姐……

-B01:你们要干嘛?!不要,放开我你们这群疯啊啊啊啊——

[B01尖叫声]

-A02:*笑声* 身体健康……

[嘈杂的脚步声,嬉笑声,B01尖叫声]

-A02:*笑声* ……万事如意。

[B01尖叫声]

-A02:还有,我……姜姐?

[B01尖叫声转为哀嚎]

-A02:你们,你们干什么——

[推搡声]

-A02:我,我刚才,你们,我——

[撕扯声,嬉笑声]

-A02:……我脸上,我手上这是——

[A02尖叫声]

-A02:*呕吐声*我[脏话编辑],我——

[骨骼碎裂声,B01尖叫声开始嘶哑]

[短暂停顿]

-A02:抱歉,刚才稍微有点不舒服。不用管,咱们继续玩,继续玩啊!


[66:38至87:09均为充斥着尖叫声、哭喊声以及撞击声的无意义段落]


-A07:可算是切开了。

-A04:给,这份是老胡的。

-A07:哎哎不行,这块要留给人家姜姐的。这块给你。

[餐具敲击声]

-A02:唉,我不知道为啥刚才肚子不舒服,你们先吃。

-A01:哈哈,那就只能怪你没口福了,再给我一块——

[打嗝声,笑声]

-A02:都顾着吃了,这录音机也一直没人关啊。

[按键声]

[记录结束,91:04]

研究文件#CN-1542-B-1:

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