The Fishing Council: The Bigger Fish
The Fishing Council: The Bigger Fish
Byㅤ DodoDevilDodoDevil
Published on 20 Jan 2022 03:54
rating: +25+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; }
/* source: */
#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;
    @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;

The Bigger Fish

rating: +25+x


Dr. Henry Ivanon hated the ocean.

He disliked its uncertain, rolling form; the way it dominates one's vision and recedes indefinitely beyond the curve of the earth. He found it cruel and uncomforting, much preferring the solid, stable, and reliable ground beneath his feet.

He could tolerate airplanes: on an airplane, one could convince themselves they weren't hurtling through the sky at mind-melting speeds, you could imagine yourself on a nice safe train or bus. The movement: the experience of acceleration was similar enough he found. Not so for boats: the rocking motion and the blue expanse that surrounded the ludicrous boat-goer mocked such attempts to ignore one's predicament. The ocean demanded recognition through the senses: the brine that caught in the nose, the crashing waves in the ear, the ever-present unease of movement along decks that could only ever be imperfect, uncanny doppelgangers of solid ground.

The last time he had been on a boat: a trip to British Columbia's Gulf Islands, he had spent the duration alternatively panicking and vomiting; neither experience were ones he was keen on repeating, as he had made clear to those ocean-fond fools he often crossed paths with at Site-184.

As such, he was extremely alarmed at the request the younger man before him — who introduced himself as Charles Cohen, of the Dept. of Anomalous Communications and Relations — had made.

"You're telling me you're going to talk to a whale, but you need my help because you can't talk to it in Russian?" He asked, incredulously.

Henry looked at the man, aghast, waiting for an answer.

"I mean, that's technically true — but you've got to consider why. I've been in touch with the people assigned to SCP-5597, and apparently the animal isn't vocalizing the way they'd expect. The sounds it's been making, well our best guess is it's the closest thing a whale can get to speaking Russian. Putting together the software to slow down and raise the pitch is easy — as is reversing that process via a microphone and speaker — but we still need someone who can actually understand what it's saying. And that's you!" Charles responded, smiling and accentuating his point with a pair of finger guns.

Henry was about to tell the man off, until the memory of his promise to Tasha Lebedev returned to him. He, on behalf of the Foundation, had promised to look after her and her children. He still got updates on how they were doing in Toronto. By all accounts, they'd integrated into 21st-century Canadian culture quite well — especially the children, but kids are adaptive like that.

Well, he realized, not all the children had. And it was that nagging guilt that led him to, despite the painful memories of the ocean, agree to Charle's proposition.

As he walked down to the dock, Henry's gaze settled upon the small, somewhat aged fishing boat and the two women attaching what appeared to be a complex speaker system to its side. One of them looked up and waved to him as he approached.

"Hi, I'm looking for Charles, Charles Cohen" he inquired tentatively, glancing around. "He wanted my help on some project, but I think I might have the wrong boat."

"You're in the right place!" a voice boomed as the vessel's cabin flew open. An imposing figure of a man stepped forward: a bushy salt and pepper beard seemed to float over the chunky cable-knit sweater he wore. Almost hidden behind his breadth was the skinnier shape of Charles, who gave another rehearsed smile to Dr. Ivanov.

The woman nearest to him finished tying a rope, "Aquatic Anomalies is short on boats at the moment, a lot of research projects going on. There's been an atypical algae bloom, some odd starfish behaviour along the coast, and reports that an iceberg with a live Mosasaurus swimming around in it is about to drift past St. John's." "Yes," she clarified, "swimming in the iceberg. I'm Sarah, by the way. "That's Emma," the other woman waved, "and you've already met Greg."

Henry's gaze unwillingly drifted as he introduced himself, settling on the flotilla of imposing, grey-hulled, very sea-worthy seeming vessels moored in the nearby, much larger, dock complex.

Greg laughed as he noticed, a resonating booming laugh, "navy' ain't too keen on helping us little folk out with something like this. Don't worry, you'll be safe. We're about ready to cast-off anyhow."

Henry's silent protesting of this fact was cut short when, having fished whatever nautically-significant thing she appeared to be occupied with, Emma turned towards him, asking "So, what's the deal with this whale anyway?"

"Oh," he responded, momentarily forgetting the disquieting sensation broiling in his stomach. "As far as we understand it, during the Second World War, a Russian family: a mother and her children were fleeing. They managed to make a deal with a group that smuggled them into the bodies of some whales that washed ashore here a while back, we aren't clear on how the timing worked. They were all in shock and I was the only one who could speak to them — they're doing quite well now!" he added, genuinely happy.

"So this whale is…" Emma trailed off.

"It — he was their guide, her eldest son. Another cost of their escape, I —" Before the weight of the admission settled on him, Henry was shifted off balance. They were off, the solid land slipping further and further away; he stifled a small cry in his throat.

Eventually, Henry's white-knuckled grip on the seat's armrests relaxed enough that he could pay attention to what little chatter was being had — Sarah and Emma were sharing some fishing story with Charles — although he hadn't caught much of it. "Tracker says we're on top of 'em" Greg called out from the cabin, and Henry turned to look just in time to watch a massive form breach the surface of the water beside them. It took him a moment to understand what he saw: from what appeared to be an explosion of water, the monolithic grey-blue body rocketed forward, twisting with surprising agility mid-air — a massive eye: expressive, almost human-like, caught his gaze — before the creature crashed into the surf, spraying the vessel and its passengers in a fine mist. Then, silence.

As the moment of reverence passed, the crew began setting up the complex arrangement of wires, microphones, speakers, and computer hardware. It seems like only a moment before Henry found himself seated before the computer screen, presented with numerous flashing dials and blinking lights, an uncomfortable headset thrust upon his head, and a microphone placed towards him.

The sounds were otherworldly at first, deep and rhythmic, slow and purposeful. As Charles adjusted the dials, however, a voice emerged — startling him with its identifiable, oddly familiar, resonance.

Hello? Hello?

He nervously leaned forward towards the microphone, answering back in Russian:

Hello! We can hear you. Can you hear us?

The response was immediate, full of excitement, and weighted with a deep longing at last obtained:

You can hear me! You can hear me! Hello, Hello! It's been so long!

Henry couldn't stop the joy from infiltrating his voice:

Yes Peter, we're very glad to hear from you!

A moment passed:

Peter, how did you — how could you? My mother! Do, do you know her? Is she okay! And my siblings: Kostya, Irina, Katja — are they safe?

Henry had to pause for a moment, preventing his voice from cracking:

I have met them, Peter. She — Tasha, wanted you to know how proud she is of you, you kept them safe Peter they're all safe now.

The response was one he suspected, but was unprepared for all the same:

Can I speak to them? Please?

Henry took another steadying breath before responding. Knowing he was likely lying:

I'm sorry, they aren't with me now. We'll try to figure out a way for them to speak to you. In the meantime Peter, some friends of mine have some questions to ask you, would that be alright?

Time passes slowly and yet rapidly. Dr. Ivanon relayed Charle's questions to Peter about his condition, why they needed him to stay away from other humans, and explanation as to how their organization would take care of him — as well as Sarah's inquiries into the local marine life. He could tell the creature was grateful for the conversation, even if Peter didn't fully grasp what was going on or who these people were. Before they left, he assured the whale — promised the person it was, that he would return, that no one would abandon him.

He didn't think about the ocean as he made the promise, and it wouldn't have changed anything if he had.


On their way back to Site-184, Dr. Ivanov realized there was something that eluded him still.

"Mr. Cohen, I never thought to ask, but what brought you here. SCP-5597's been contained for a while, what changed?"

The man turned his attention to Henry, there was something different in the intensity of his gaze as he responded, "I take it you've heard about the Russians and the belugas, haven't you?"

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