By: NDHeckfireNDHeckfire
Published on 26 Mar 2023 14:00
rating: +46+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: +46+x

Item#: SCP-7872
Containment Class:
Secondary Class:
Disruption Class:
Risk Class:

Assigned Site Site Director Research Head Assigned Task Force
Site-400 Director Adam Desmond N/A N/A


An empty room. This is to show that SCP-7872 doesn't have a photograph due to his nonexistence.

SPECIAL CONTAINMENT PROCEDURES: With approval from the current site director, the following message is to be broadcasted as least three times a day via Site-400's on-site PA system:

This is a daily reminder to all personnel that there is no individual named Kristoffer Rosheen currently employed by the Foundation.

Posters and notices are to be regularly printed and put up by personnel who do not acknowledge the existence of SCP-7872 to remind other personnel that he does not, in fact, exist. Discussions regarding the existence (or more accurately, nonexistence) of SCP-7872 are allowed to be held privately, though individuals will ultimately conclude that SCP-7872 does not exist at some point.

DESCRIPTION: SCP-7872 is the designation given to Senior Researcher Kristoffer Rosheen, who does not exist. The Department of Pathological and Biohazardous Research has not acknowledged the existence of SCP-7872, and as such it is entirely impossible for SCP-7872 to be a Caucasian male of Dutch-Scottish descent, with green eyes and blond hair.

Despite prolonged observation, all faint footsteps and muffled whispers reported by personnel are not caused by SCP-7872, as once again, he does not exist. While the source of these noises are still as-of-yet unexplained, it is with utmost certainty that it isn't SCP-7872's doing, as that would be illogical (because he does not exist).

Further information regarding SCP-7872 is unavailable, for obvious reasons (that being his nonexistence).

ADDENDUM 7872-1: Most Recent Discussion Associated with SCP-7872

Date: 03/10/2018

Personnel Present:

  • Agent Carlos Sierra
  • Junior Researcher David Kobolsky

<Begin Log>

Footage shows Agent Carlos Sierra sitting alone by himself in the breakroom, his mobile phone in hand. The door to the breakroom opens, as Junior Researcher David Kobolsky enters. He looks around briefly before speaking.

Rs. Kobolsky: Oh, uhh…

Agt. Sierra: (looking up) 'Sup, man.

Rs. Kobolsky: Hey. (fidgets) Umm, is this the breakroom?

Agt. Sierra: Yup. It's a bit desolate this time a year. Most people go to the cafeteria.

Rs. Kobolsky: Ah, okay. Sorry, I'm new here.

Agt. Sierra: Oh yeah? (stands up and extends his hand) The name's Carl. Anomaly Investigations.

Rs. Kobolsky: (shaking Agent Sierra's hand) Dave. Memetic and Countermemetic Research. I, uhh, got retransferred here a couple of days ago. From 43.

Both individuals sit down.

Agt. Sierra: 43, huh? Must've really fucked up if you got yourself retransferred from a place like that. (laughs) I'm just messing with ya. You probably can turn water into weed or some shit like that, am I right?

Rs. Kobolsky: (chuckles nervously) Heh, yeah… (clears throat) Hey, you look like you know your stuff. Can I, uhh, ask you a question?

Agt. Sierra: Sure, man. Ask me anything.

Rs. Kobolsky: Right, right. It's got something to do with a PA broadcast I heard. (sniffles) Well, twice, actually. One in the morning, and another one on the way here. It's something along the lines of: "There is no individual named… Christopher Rosheen in the Foundation"? What's, uhh, what's that about?

Agt. Sierra: Ah, yeah yeah yeah. I know what you're talking about. Don't worry about it though. It's just protocol. For that one scip. Uhh… 7872, I think? I guess they haven't put up the new posters yet.

Jr. Researcher Kobolsky takes out his SCiPhone and accesses the search engine. After several seconds, he begins to read out loud.

Rs. Kobolsky: "…individuals will ultimately conclude that SCP-7872 does not exist." The heck?

Agt. Sierra: What's up?

Rs. Kobolsky: So, if I'm reading this correctly, we have to believe that this… Kristoffer Rosheen guy doesn't exist? Or we can question his existence, but eventually come to the conclusion he doesn't actually exist?

Agt. Sierra: (shrugs) Pretty much.

Rs. Kobolsky: But… I'm confused. The way the Description here is worded makes it seem like he exists. They even got the guy's supposed appearance.

Agt. Sierra: No, I don't think it says anything about that being his appearance. (looks over Jr. Researcher Kobolsky's shouldy) Yeah, over here. "It's entirely impossible for SCP-7872 to be a Caucasian male etcetera etcetera".

Rs. Kobolsky: But… I don't know. It makes it seem like whoever wrote this just wants us to believe he doesn't exist.

Agt. Sierra: That's… the point…? Dude, you okay?

Rs. Kobolsky: No, I'm just saying- Wait, are we reading the same thing here? (looks back at his SCiPhone) Is there a locked addendum here or something?

Agt. Sierra: I doubt it. It's only Level 2 Restricted. The only people who can't access the scip are D-Classes and L-1 Janitorial staff.

Rs. Kobolsky: Yeah, but… Holy shit. This… this could be an antimeme! An "antimemetic anomaly"! Right?

Agt. Sierra: Read the file, man. It doesn't say anything about being antimemetic either.

Rs. Kobolsky: Yeah, but that's how antimemes work, right? The fact that you don't know it's antimemetic until it's too late?

Agt. Sierra: Then how would you know it's antimemetic?

Rs. Kobolsky: Well, I'm, y'know… (sighs) Crap.

Agt. Sierra: Exactly.

Rs. Kobolsky: It just… doesn't add up.

Agt. Sierra: Anomalies don't add up, man. That's why we call them anomalous. Look, I know how you feel. Really, I do. You're feeling new, and maybe out of your element. And you just wanna prove yourself, right?

Rs. Kobolsky: No, not at-

Agt. Sierra: C'mon, let's get something to drink at the cafeteria together. I'm sure they'll have something you Canadians like.

Agent Sierra stands up and motions for Jr. Researcher Kobolsky to do the same. He hesitates for a second, before putting away his SCiPhone and standing up also.

Rs. Kobolsky: A-alright.

They both exit the breakroom. Footage ends.

<End Log>

Surveillance Log 7872/3810-WH

Date: 05/10/2018

<Begin Log>

Footage begins by showing an empty white hallway. At the end of the hallway are a set of double doors that lead elsewhere. One of the doors opens, and Junior Researcher David Kobolsky enters the hallway. He looks around nervously before closing the door behind him.

Junior Researcher Kobolsky proceeds to slowly make his way towards the center of the hallway. A cold breeze suddenly blows past, causing Junior Researcher Kobolsky to hug himself in response. He shudders and rubs his nose several times.

Rs. Kobolsky: (calling out) Kris… Kristoffer Rosheen? Doctor Kristoffer Rosheen? (sniffles) Of the Department of Pathological and… uhh, Biohazardous Research? Are… you there?

There is no response. Instead, the only sounds audible are of the air conditioner at full capacity and the buzzing of fluorescent lights. Junior Researcher Kobolsky looks around nervously once again. He hugs himself even tighter.

Rs. Kobolsky: Hello? (sniffles) Anyone?

There is a sudden chiming noise, signalling the activation of Site-400's PA system. Junior Researcher Kobolsky, somewhat startled, looks intently in the direction of a nearby speaker.

PA System: This is a daily reminder to all personnel that there is no individual named Kristoffer Rosheen currently employed by the Foundation.

The chiming noise repeats, now signalling the deactivation of Site-400's PA system. Junior Researcher Kobolsky looks away from the speaker and down on the ground. He scratches the back of his head and rubs his nose, before looking directly at the surveillance camera currently recording this. He looks away and chuckles to himself.

Rs. Kobolsky: What the hell am I doing? (sniffles) I look so fucking stupid right now.

Another cold breeze blows past. Junior Researcher Kobolsky sniffles once again, and quickly covers his nose with the front of his elbow. He then sneezes.

SCP-7872: Bless you.

Rs. Kobolsky: Thanks.

Junior Researcher Kobolsky takes out a piece of napkin from his coat and wipes his nose with it. He proceeds to walk away out of frame, exiting the hallway. Footage ends.

<End Log>

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