rating: +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.


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(';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; }
rating: +2+x



Item #: Ah, let's begin from here: the Item Number. The item number is typically at the beginning, and is the easiest to overlook — this is understandable, as nothing has been written up to this point. It is simply a unified, common numbering system, carried over from the old days. What does it actually explain? Someone picked an empty slot from the list of numbers — and that's all. This is the smallest part of the entire document.

It's typically safe to skip over this part, as usually you will not miss any important information. However, in some cases, the story begins from the item number, filling this literary blank. For instance, articles like SCP-INTEGER, 𝒫 and SCP-𝕐 use a strange codename to replace the item number in tandem with other parts of the article, hinting at some situation or other. "This is something the Foundation does not understand", it says, "this is something the Foundation has not yet tamed. The Foundation cannot complacently lock us in a box labeled with SCP and a few digits as they usually do. We have outsmarted the Foundation, forced it to admit defeat for now."

We might realize that the item number is a metaphor for "containment"; looking back at 173's file, that cute little statue — we may perhaps be able to know them better. 173. This number implies that the sculpture is not the only item contained by the Foundation, not is it the last. When we first read 173's document, we still don't know what it is — we have only read the short first line. But the Foundation is telling us, telling everyone: we have given this item a number; not only have we given this item a number, one day, we will give all of them a number. We may even imagine the researcher or doctor behind the document, and imagine the humble yet proud expression on his face.

But I'm afraid 173's author may not have been thinking of literature — it is from the era when the Foundation had no time for the consideration of such details. He simply took a practical approach to deciding the format, and wrote the first object dossier in the history of the Foundation. However, even if the Foundation refuses to accept it, artists can use their acute senses to find the buried artistic value behind these documents. In reality, the Foundation has long embraced the uncommon art of the nonlinear narrative, to the point where its authors tend to forget this point. We shall elaborate more in the section on Special Containment Procedures.

Object Class: We cannot help but accept that GAW has reason to make fun of the Foundation. Safe — that is easy to understand. But suddenly — Euclid? Keter? It's hard to imagine Euclid the mathematician and Jewish mysticism having such an important meaning to a group as known for rigor and professionalism as the Foundation. But of course, this is the secret classification system of a secret organization, and it is not meant for others to understand. But compared to numbers or colors, which are more commonly seen, these kinds of names are overly specialized. We cannot imagine whether they are meant for practical use, or the invention of some geeky bookworm making an obscure reference.

However, no matter how strange or amusing these names may be, they are still object classes invented and used by a massive hidden organization. Even if it is not strictly practical, it is pragmatic. Does the Euclid class have any connection to geometry? Perhaps, when it was conceived, it already had some indistinct meaning, which solidified into a simple classification in the context of the Foundation. The Foundation does not shy away from using words from each and every religion — for instance, the aforementioned Keter is a Jewish term used in kabbalah, the highest Sephirah on the Tree of Life, meaning "crown", and Thaumiel, another Object Class used by the Foundation, comes from the Qliphoth, refined by later generations, and refers to twin demons eternally in opposition — the opposite of Keter, which symbolizes the oneness of God. Worth pondering, however, is that the meaning of Thaumiel is that something "is useful to the Foundation in containing or suppressing other anomalies' effects", in other words, Thaumiel refers to the weapons the Foundation has at their disposal, yet these weapons are given the mark of Moloch and Satan — they are sins on par with associating with the most evil false gods.

The Foundation's object classes, contrary to intuition, do not express how dangerous something is, but rather how difficult it is for the Foundation to contain it. The Foundation is not like the GOC or the UIU, classifying objects by danger. Here the Foundation has repeatedly shown its arrogance — members of the Foundation routinely explain that "nuclear warheads are Safe" to explain the Foundation's classification system. The Foundation does not care how dangerous an object is, only how hard it is to secure them, contain them, and protect the innocent. That is the Foundation's creed, and the source of their pride. Whether they associate with gods or demons has no meaning in their worldview. This is also why they have no qualms with such vocabulary — in order to face the anomalous world, they must accept the existence of gods and demons. This is one obvious difference between the Foundation and the GOC — the GOC does not accept, only resist.

Special Containment Procedures:S, C, and P. The name "SCP" comes from here. The unfortunate thing is this is the second easiest part to skip over. Besides those who are forced to write them, nobody pays it much mind, but if someone makes a mistake here, they receive scathing criticism. What is required here is a draft proposal based in the current situation. We all know that this kind of passage does not offer much literary value; it is typically tedious and boring, as it is born on the writing desk of a researcher forced to write it, often with coffee in hand. Hard-pressed to write, they dread having something they've overlooked pointed out to them. With only a desk lamp lighting their office and their desk covered with drafts filled with things they and their superior already know but must be written down due to protocol. They put out such effort only to be able to describe their object of study.

To those Foundation pedants who are shaking in their seats, almost unable to control their objections: I am not saying that these Special Containment Procedures are useless. I am simply more concerned with their literary value. For instance, as previously mentioned, they present a sort of non-linear narrative. Let us take SCP-1916, about ol' Wondertainment's moon rocks as an example:

Special Containment Procedures: All known instances of SCP-1916 are to be stored in a sealed crate in the secure warehouse at Site 85. Prominent signage is to be placed on and inside the crate indicating that SCP-1916 is non-edible. Mobile Task Force Xi-1964 (Slugworth's Sizzlers) are to monitor distributors and vendors of confections and confiscate any instances of SCP-1916 found in circulation.

All testing of SCP-1916 is to be conducted on D-class personnel who have been implanted with subdermal tracking devices. Outdoors testing is authorized at the remote facility adjacent to Site 85; in the event that an affected D-class breaches containment, use of surface-to-air weaponry to neutralize the test subject is authorized. Pending a full review of the results of Experiment 1916-6-1, all testing on SCP-1916-6 is prohibited.

Note that at this point, we have no idea what "SCP-1916" is. But once we reach the Special Containment Procedures, the topic changes and we are assumed to know about Experiment 1916-6-1 and SCP-1916-6. What a big jump. Our common sense tells us that this section should be after the Description, or even after the Addenda section. As a result, the reader is pulled into a summary right at the beginning, when they are not sure of what is being stated — a typical in medias res.

When artistic pieces use this technique, an exciting, dramatic scene is typically chosen to open the piece to catch the reader's attention. Unfortunately, the Foundation has no such requirements. "The typical Foundation member has horrible taste," as they rightly say. Their buildings do nothing to hide their construction of concrete and steel, and the hallways and labs are completely devoid of in-vogue wallpaper and carpets. This is reflected here in the positioning of the Special Containment Procedures.

"Nonlinear narrative?" the Foundation says. "Yes, dear artist, you may get that impression, but honestly, we don't care." Readers expecting the kind of reading experience one gets from the Iliad or Odyssey will typically be disappointed, and besides the mystery that will be immediately resolved in the Description, there seems to be nothing of value here. It seems to only be relevant to Foundation personnel and no one else. It is the Foundation's job to employ people who will carefully read and implement this boring procedure, and the poor reader is forced to read it either out of respect for literature, or out of worry that they will miss something. Of course, if this is your first SCP, you may learn from the containment procedure what the Foundation has done and how they did it. But if you are even remotely familiar with the Foundation's practices, you can't help but get bored. It typically doesn't provide any information the Description doesn't, and — for the vast majority of cases — there's no news here. Even the Foundation itself gets bored of it, often reducing the containment procedures to a few short sentences whenever possible. But they still draw up the full containment procedures — and that, trust me, is a literary disaster, and in some cases, a physical disaster.

Description: The story, the holy, great adventure. We have come to the description of the object — the core of the document, and the one everyone reads. Now we can take ourselves out of the story, sit on the sofa and enjoy the strange objects and fantastic characters. At times, we read about a worsening state of events and life-and-death situations. Perhaps cruel, but it is the privilege of the reader to experience all of this and more.

As I said, there are no writers in the foundation — just a bunch of geeks. But, also as I said, these scientists are passionate about their work with anomalies. They believe their work is meaningful, and pour their hearts and souls into it; whether intended, this is where the seeds of art begin to sprout. This kind of seed is far more tenacious than one can imagine, for it cares not for the quality or lack thereof of the soil; it merely requires love. The "clinical tone" not only meets the requirements of a description, but the requirements to be considered literature; the detailed addenda not only complete the archives, but flesh out the world, making it richer and more three-dimensional. The art has grown under the Foundation's pen, and yet they remain unaware of it.

The Foundation's expertise is in describing the fantastic and grotesque in short, concise, scientific words. Countless files form a dark, chaotic world filled with secrecy, in which professional, dispassionate researchers work, attracting many loyal fans for the Foundation. I think the Foundation must have been very confused by the situation — their sophisticated, scientific minds thought not of the world of art. They reacted with brutal force — and, as far as the results were concerned, accomplished nothing. They made themselves a laughingstock simply by overreacting.

The myriad objects the Foundation has contained come from all over the world. Not only are there myriad fantastic and bizarre anomalies, but also the fruits of research by various organizations — and my work, and the work of my colleagues, were often seized by them. They do plenty of research on these objects. Of course, that research typically doesn't include artistic analysis — but that doesn't stop them from being good enough creative material. In the eyes of an artist, it's hard not to see the Foundation as a kind of art gallery — and so the Foundation really shouldn't be surprised that people love their "containment". The iten number, object class and Special Contanment Procedures serve as an introduction, while the Description begins to tell a wonderful story. What did the Foundation encounter? A man-eating monster, or a man with four arms? Sometimes the Foundation meets a house where strange things happen, and we follow the quest to document the unraveling of the mystery, and other times, events slip into the realm of the absurd, and we follow the Foundation's confused words to determine the story. Whether intended or not, the Foundation has brought a literary enjoyment to the people, and its distinctive writing style is a breath of fresh air in the literary world. Even if it isn't appropriate, I suggest that the Foundation could embrace this instead of endless secrecy and censorship. Some people like the statue, or the guy with the beaked mask! Considering what they've done and how many people they've killed, it may seem strange — but as artists, we're all a bunch of freaks.

Addendum: In conclusion, I still know of a most unusual situation: the Foundation, for some reason or other, can't even maintain the most basic of file formats — as seen in this article. The Foundation, of course, doesn't like the feeling of not being in control, but as I said, it's important to learn to let go and relax.

Its anomalous properties (to use the Foundation's words) is as such: The description for this piece of paper can only exist if it is in the format presented in this paper. A simple nesting, the classic game of turning 2 into 1. I hope the Foundation takes this as simply an old man's long-winded little joke — you know, when you spend too much time with the playful girls, you can become fond of poking fun at people once in a while. As I write this article, I can't help but remember the times when I was a Clipper.

— The Critic



Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License