The Fishing Council: Crossover Episode
The Fishing Council: Crossover Episode
Byㅤ DodoDevilDodoDevil
Published on 31 Jan 2022 18:10
rating: +26+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;
    }
    }
}

Crossover Episode

rating: +26+x

Lismer-1.jpg


Things were bustling at Site-184, and Greg Albsernester had a spring in his usually heavy step.

A recent planetary misalignment — or an administrative oversight — had resulted in the concurrent scheduling of a number of events. The launching of the SCPS Malsworth: a revolutionary new stealth corvette, had brought Naval, Research & Development, and Mobile Task Force representatives from across the breadth of the Foundation. Simultaneously, a lecture series delivered by the Department of Anomalous Art and Artefacts and a Multi-Site research project headed by Aquatic Anomalies ensured the site would be packed full of new and familiar faces in the coming weeks.

As a man known to thrive in chaos, the upcoming events had put the wind in Greg's sails.

This became clear to Emma and Sarah, when — as the two women were mid-lunch and mid-conversation — Greg thumped into the chair opposite them in the cafeteria.

"So, I've been thinking," he proclaimed, oblivious to the previous topic at hand. "With all these folk coming 'round from all over. We oughta make 'em feel welcome. Hows 'bout we take some of 'em out on the Mackeral and see if they care to share in the taste of the sea?"

Both women shared a glance, as they encouraged the other to respond. Emma broke first.

"Well that does sound fun, Greg" she began, diplomatically, "but chances are they're going to be busy. I know there's a lot else going on and—"

"Not to worry," the man responded. "Already sent out the RSVPs!"



It was a bright, cold day when they piled onto the fishing vessel. Greg had spoken to the regulars, kept tabs on who would and wouldn't be able to tag along, and ensured there were enough visitors to fill out their usual number — or close enough to it.

As they coasted out onto open water, Greg took a moment to walk along the deck, eventually stopping beside a dark-haired man leaning against the boat's railing. He traced the newcomer's gaze across to the still-docked SCPS Malsworth. "'A beauty, ain't 'er," Greg inquired, looking at the vessel. Its sleek, knife-like profile promised to dampen radar and gave the ship a dangerous predatory look; undercut slightly by the confusing array of lines and curves painted across the hull in an assortment of noticeably eye-catching colours.

"You've heard of Dazzel Camoflague?" Greg inquired, continuing on before the man had a moment to comment. "WW1, to hit a boat 'especially from a sub, you gotta know a few things: where you are and where you're going, and where they are and where they're going. Well, one of those things is easier to exploit: you make it so they can't tell which way you're going nor how fast you'll get there, and hitting you's a touch harder — it's the ship's own movement that does it."

"Now, what they're hitting you with and how it's getting there today may be different. But they still got to know where you are, and that goes double for us when we need to slip in and out like thieves. So, the question is, how do you stop them from finding 'ya?"

Greg watched as an ember of recognition ignited within the man beside him, tentatively wavering until it caught the fuel of certainty. A gloved hand grasped the railing as he leaned forward, amber eyes flickering with excited disbelief. "They're runes: thaumaturgical symbols for concealment!" Dr. Daniel Asheworth exclaimed, "But how does —" He paused for a moment, considering the potential application and limitations of such magics at that scale; it would require some sort of catalyst to sustain its operation, something readily available and easy to manipulate. "The salt," Asheworth identified. "The vessel moving at speed would displace enough seawater — aerate it, which could be used as a matrix to encompass the ship, you wouldn't need an experience thaumaturge on board, just someone familiar enough to ensure it was working properly."

"And thus hidden from the sight of men and god," Greg clapped Asheworth on the back.


Lismer-2.jpg


They had travelled for a while before Greg dropped anchor, declared that fishing time was upon them, and passed out the rods. Emma cast hers out while their guide was preoccupied assisting some of the newcomers with the finer points of bait and tackle.

"You're Art and Artefacts, right?" the bearded figure asked as he approached her, seeming a little unsteady as the boat bobbed in the surf. Emma recognized the man from a previous day's panel. She tried to recall the details as she responded — it had been on navigational equipment during the Age of Sail, but the man came in as a specialist on something related: optics, she wanted to say.

Her theory was confirmed as Dr. Harold R. Blank introduced himself and continued to make conversation. "I had been looking through the on-site archives and had a question about the provenance; a lot of the works come from an M. Hubbard, but the paperwork's sparse at best. I was wondering if you knew more about that?"

Emma nodded, placing her fishing rod in the bracket beside her. She hadn't been stationed at Site-184 for long, but when such a large portion of their documentation came from one source, it was a quick inquiry to come to mind. "Halifax had quite a large outpost for the Commission on Unusual Cargo, it was their primary port of calling for some time towards the late 18th century. When they closed up shop, all their record-keeping: ledgers, bills of sale, journals — got shunted into the house of a known associate. That was M. Hubbard, we suspect she was a thaumaturge, although they'd have used the term 'witch.'"

"They'd likely still be with her descendants if it weren't for the explosion," Emma continued. Harry filled in the blanks as she talked: 1917, two ships collided in the harbour, the materials being carried for the war effort ignited, causing the largest man-made explosion at the time. The shockwave flattened most of Halifax and the nearby communities.

They had passed by the entrance to Halifax's Harbour earlier — Greg mentioned they were taking a scenic route — and Harry pictured the effects of an equivalent detonation today: the taller buildings by the seafront would shelter the shockwave somewhat, wouldn't they? What about the twin bridges, would they have crumbled into themselves? Caught in his thoughts, he nearly missed Emma's continued explanation.

"Foundation used helping with the clean-up as cover to investigate a few spots in town, among them had been M. Hubbard's home. We took all those old archives off her hands," Emma concluded.

"So, she died and we descended on her like vultures, typical," Harry scoffed.

"Not quite, Old Hubbard was, by all accounts, sitting alive and well when the Foundation showed up. Apparently, she was in her rocking chair, sipping tea with boxes of paper stacked up, the four walls of her house blown to splinters. She told the Foundation she had business in Europe and asked them to look after the assortment. That's where we got SCP-6529 from."

"Huh," Harry remarked. "So what about all those wooden model ships you've got locked up. Are those anomalously or historically significant?" he asked, raising an eyebrow.

"Hey," Emma retorted, "if they're good enough for your Ontarian Art Gallery, they're good enough for us here."



The day was beginning to slip into the afternoon as they made their way back to the site. Spirits were high and the idle chatter gave appropriate cover for more meaningful conversation, for those so inclined.

Charles slid onto the bench beside his boss, noticing his superior's disinterested gaze: one hand loosely grasping the fishing rod as the other stroked a dark goatee — a sign, Charles had learned, that meant things weren't going well.

"So," he tossed out the bait, "seems as though something's on your mind. Everything okay, sir?"

"Sorry, Charles," Dr. Cole Thereven muttered as he raised his hand to adjust his glasses. "Things have been a little bit shit lately. Travelling to Poland every other week's exhausting — did you hear someone stole my car while I was gone?" Charles had, but figured it was best to give the man time to vent. "And they don't even know where it went! Security says it just up-and-vanished! How the hell does a 2019 Nissan Sentra get stolen from the indoor parking lot of a Foundation facility!" Charles knew he had judged correctly when Cole sighed, slipped his glasses back into place, and turned to other matters at hand. "So, how's it going with the whale?"

Charles laid out an update, exaggerating slightly on his success learning Russian. The need of a translator was an unfortunate stumbling stone, but not one too challenging to overcome. And Henry Ivanon had been pleasant to work with so far. Dr. Thereven nodded slightly as he listened.

"And you trust the rest of them to go along with it?" He inquired when Charles had finished speaking.

"I do, sir. I'm thinking I'll play it off as a fun trip — throw in a little fishing. The only thing you haven't cleared me on is where exactly we're headed to."

Dr. Cole Thereven took a moment before responding. He had begun this chase long ago, and the weight of the past ached in his stomach. He looked at Charles, seeing a younger version of himself: full of eager hope, unaware of the curse that laid before him. The place Cole sought was known publically to have claimed the lives of six men before, but Dr. Thereven knew the true count was thirteen indeed. And it had taken all but the souls from many others; failed expeditions and excavations had sunken the finances and livelihoods of many whose paths he now tread.

However, those men and women weren't Dr. Cole Thereven, and they hadn't had the expertise and knowledge of the Dept. of Anomalous Communications and Relations behind them. Nor had they, he assured himself, understood what they were seeking; they went looking for gold and jewels, not the true treasure that had been buried and lost to time: knowledge, communication. Things Cole had learned were true power. He composed himself before he issued his two-word answer — a declaration of purpose and resolve:

"Oak Island."


Lismer-3.jpg

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