SPC-993:小丑鲨巴伯
SPC-993:小丑鲨巴伯
By: Blinder4Blinder4
Published on 17 Oct 2022 05:20
评分: +2+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;
}
 
@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;
    }
    }
}

中央情报协调和项目行动指挥部(CICAPOCO)的通知

spcheader.png

如果中心工作人员想观看小丑鲨巴伯的旧剧集,可以参观Arena-19娱乐区域以提高士气。

感谢您的忠诚。

——Nathan Jones,CICAPOCO委员长

搜寻,殴打,征服。

项目编号: SPC-993[ARCHIVED] STATUS: 不活跃

鲨鱼殴打性能:[无效化]


SPC-993是一个反鲨鱼组织的宣传计划,本中心用它来向10岁以下的儿童灌输相关思想。它负责向儿童教授拳击和异式武术,并根据本中心的行事宗旨对他们进行培训。

10岁以上的SPC-993观众会在观看时体验到娱乐、愉悦和满足的感觉。这不被认为是直接观看的结果:这些是观看鲨鱼拳击术的常见副作用。


项目组成


BobbletheClownShark.png

SPC-993一集中的静止图像:“巴伯被龙虾它的甲壳同伙们无情辱骂”。

SPC-993由单一的组成成分构成:小丑鲨,一个儿童动画电视节目,最初由FINIMATION工作室从1949年开始制作。

SPC-993扮演一位股票经纪人和放债人,即一个带有可行走尾鳍的沙虎鲨(/锥齿鲨/)的日常活动。其中情节涉及巴伯参与保险欺诈和其他商业诈骗,但未成功,并在被发现后成为暴力的受害者。

由于本中心施压,巴伯对暴力虐待没有表现出不良反应,在大多数场景中都能看到他咧嘴大笑。尽管受伤,但他仍然坚持了下来。对巴伯造成的所有伤害1都在剧集和场景的过渡之间愈合。2


强化概要


本中心于1953年收购了FINIMATION工作室,并努力修改该系列,以展示巴伯对不同人类和水生实体的滑稽虐待。

通过使用元叙事技术(在☽☽☽倡议会的帮助下),本中心的打手能够在武力威胁下胁迫巴伯并说服他合作。在1953年至1969年间,416部小丑鲨动画短片在许多联合电视台播出。该节目是一部教育喜剧,教孩子们正确的战斗方式,锻炼肌肉,并参与鲨鱼拳击,通常由巴伯本人讲述。


部署记录 | 片段摘要


剧集标题 内容
“巴伯冒充是美国国税局人员” 剧集发生在一个大型呼叫中心,巴伯通过电话与几个人交流。他与一位老妇人交谈,试图说服她说出其信用卡信息。这名女子通过电话接收器打了他一拳,打断了几颗牙齿。办公室经理注意到他的骗局企图,说服一群愤怒的同事在背景音乐Benny Hillary Play播放时围殴了巴伯。
“巴伯被白鲸殴打,而亚哈船长袖手旁观” 剧集发生在被放逐者图书馆3巴伯偷走了名为写给蠢蛋们的庞氏骗局教程并立即被捕。这一集涉及一名图书管理员从他们的原始出版物中收集小说和漫画书中的人物,之后他们对巴伯进行体罚。此情节持续了三个小时4,而巴伯不受控制地大笑。
“我烧掉了巴伯的吐司面包” 这一集(由我执导、制作并由我主演)讲述了巴伯在我的主人睡觉时进入我的厨房。在浪费了几分钟试图闯入我主人的保险箱后,他洗劫了他们的冰箱,并将两片全麦面包放入我的插槽中。我烧掉了他的吐司,并将焦糊的面包片发射进他的喉咙里。但我好像听到他在大笑?下一个片段中,我在他洗澡的时候通着电跳进了浴缸。

爬吧,宝贝,给爷爬。
“老师说:打巴伯!” 剧集发生在一节女子空手道课上。该课程包括热身,招式演示和陪练课程,所有这些都由巴伯讲述,他既是班长又是拳击袋。在整个课程中,23名参与者密谋攻击巴伯,导致他和女孩们之间进行了10分钟的对决。一次攻击中,橙带的克里斯汀•库克(8岁)打中了巴伯的鼻子。这次攻击的力量使他以1.5马赫的速度飞过结构梁和承重墙,将建筑物夷为平地。

在这一集的制作过程中,没有儿童受到伤害。

1969年,SPC-993所有播出的剧集都发出了由巴伯在多年的折磨后制作的“鲨鱼危害”5。受危险影响的10岁以下的观众对鲨鱼感到极度愤怒,并寻找打击他们的方法。幸运的是,这种强烈的反应在播放结束后就停止了——不过,愤怒的感觉仍然存在。

小丑鲨被从广播中取消,该节目的所有副本都被烧毁。SPC-993的主副本仍保存在亚洲海关总商会档案馆。


注意: SPC-993文档更新! 是否浏览?

Y / N

输入: Y_

做得很好,看到这里了吗?

继续看下去不然你就是条狗鱼!

[以上语句为自动传输信息,请勿回复]


更新内容


2017年2月,SPC-993的所有剧集同时被修改,全部虚构角色都被编辑移除。第二天,由备受赞誉的鲨鱼电视企业家和泥城居民 理查德•克拉维斯•查佩尔 主持的异闻类电视节目查佩尔秀在每天播出12小时的低成本CGI重启节目小丑鲨

重启节目的内容主要为巴伯讲述鲨鱼可以而且应该在陆地上做的行为,例如驾驶皮卡车,教授形意舞蹈课,参加国会竞选,以及[已编辑——仅限重量级拳击手查阅] 拥抱可爱的狗勾们. [/已编辑]





注意:站点的打手们


小丑鲨巴伯正处于卡哇邦嘎!!!等级的危险之中!

我们需要你们的帮助,使他从可怕的威胁中逃离出来。要做到这一点,我们需要一位有着钢铁般拳头的战士。为了证明你的价值,你需要做的就是100个俯卧撑,100个仰卧起坐和100个深蹲,然后喝一杯花生酱和香蕉巧克力蛋白奶昔。但你必须快点,这样巴伯才能重新广播并教孩子们空手道!

阅读本文档后,请立刻向您的健身中心报告。你会在哪里得到一杯美味的长岛冰茶。抓 紧 时 间!


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