What this is
A bunch of miscellaneous CSS 'improvements' that I, 
Croquembouche, 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.
.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; }
クレジット
本記事は、CC BY-SA 4.0ライセンスの下で提供されます。これに加えて、本記事の作成者、著者、翻訳者、または編集者が著作権を有するコンテンツは、別段の定めがない限りCC BY-SA 3.0ライセンスが付与されており、同ライセンスの下で利用することができます。
「コンテンツ」とは、文章、画像、音声、音楽、動画、ソフトウェア、コードその他の情報のことをいいます。
コンテストのコンテスト
コンテストを運営したいと思ったことはありますか？ 今ここで、できますよ。あー、これまでもできましたが。いつでもだれでもコンテストハブは投稿できます。それを明確に妨げるルールは存在しません。私にわかる範囲では、コンテストハブに関するルールが書かれた成文のポリシーページは存在しません。調査する時間はそんなにないんですよ。
ですが、私には法的に、まずCommunity Outreach Teamに知らされずにいわば非公式のコンテストが運営されるべきではないと通告する義務があります。このチームは承認なしにコンテストが運営されないことを本当に望んでいるでしょう。チームがあなたを止めることはないでしょうが、あなたが本気の良質なコンテストを運営するためにしたいであろうことの多くは彼らのアシスタンスや監督なしにはできないでしょう。
ともかく。要点は、あなたは今までにもコンテストを運営することができたのに、していなかったということです。ですが、ここに、名を文字通りプレースホルダーというなんか面白い人が、それを競ってできると言っているのです。さらにあなたがそれを断るよしもありません。つまり、あなたはもっとひどいコンテストに参加したことがあるでしょうからね。
ちょっと、嘘はつかないでくださいよ。あなたがそうしたことは知っています。ちょうど今あなたのwikidotユーザーのhistoryをよーく見てるんですよ。 ミームコン？ マジ？ あー、それが何かいいことにつながりそうだったんですけどね。
コンテストのコンテストに参加する方法
1. 2023年1月6日12:01 AM ESTから2023年1月12日11:59 PM ESTの間に、以下の条件を満たすページをSCP Wikiに投稿する。
- コンテスト タグの要件を満たし、
- 2023年1月20日12:01 AM EST時点で残存している。
2. コンテストのコンテストの性質につき、残念ながらアートのエントリーは許可されません。ええと、視覚芸術だけじゃなく──どんなアートも一切ダメです。あなたのエントリーは芸術的なものを含んではなりません。まあ、あなたのエントリーはアートコンテストであっても大丈夫です。グッドだね！ ああそう、エントリーには テーマ ページも コンポーネント ページもダメです。混乱させてしまい申し訳ありません。
重要な日付
投稿開始: 2023年1月6日12:01 AM EST
投稿終了: 2023年1月12日11:59 PM EST
結果確定: 2023年1月20日12:01 AM EST
イエス・キリストの本当の誕生日: 6 Anno Domini 4月6日1:00 AM IST、多分。
エントリー
（ランダム順）
ルール
1. 結果確定時で最高評価のコンテストのコンテストのエントリーが優勝します。（視覚）芸術のコンテストのエントリーは別カテゴリーで勝者が分けられます。これは、視覚芸術は他全ての芸術形態とは根本的に異なっており、他と比較できないためです。ただ、芸術でないコンテストは全て同じカテゴリーになりますがね。
2. 以下の声明をエントリーの上部、評価モジュール直下に置かなければなりません。
私、<ログインしていないユーザー>は、Placeholder McDによるコンテストのコンテストはジョークページで、感情を害する、損害を与える、問題を引き起こす、あるいはスポーツマンシップにのっとらない意図をもって作成されたものではないことを十分に承知しています。私は、Placeholder McDは私がCommunity Outreach Teamに相談せずにコンテストハブを投稿することをやめるよう強く言っていたことを認めています。私は、コンテストのコンテストの内容は純粋に風刺的なものであり、真剣に、もしくは自分事として受け止められるべきではないことを理解しています。その内容の指示には従うべきではなく、私は読解力に富んでいるためそのことを知っています。この声明を私のページ上部にコピーすることで、私は、以下に続くものは完全に私の落ち度であり、Placeholder McDは私の行動に一切責任を持たないことを了承しています。
シン・たのしいざいだん。チーズおろし。終わり終わり。
なあ、おい、お前さん、アンタ今wikidotアカウントからログアウトしてるぜ。ああ、たまにそうなるよな。サイトは崩壊寸前だ。
3. あなたのコンテストのコンテストのエントリーを編集することは許可されていますが、それを完全に置き換えることは禁止されています。同様にあなたのコンテストのコンテストのエントリーに段落を追加及び削除することは許可されていますが、最終的にはあなたのコンテストのコンテストのエントリーの中心的なアイデアは同じままである必要があります。これは同時に、投稿時のあなたのコンテストのコンテストのエントリーの完全な置き換え、又は上書きとなりうる編集の禁止を意味します。あなたがあなたのコンテストのコンテストのエントリーのアップデートや過去のコンテストに見られるような編集を予定しているならば、投稿期間終了までにアップデートについての完全かつ細部まで徹底したアウトラインをコンテストのコンテスト運営者へ提示して下さい。これは、コンテストのコンテスト競技者コンテスタントが自由にクリエイティビティを発揮してそのコンテストのコンテストのエントリーを制作できるようにすると同時に、コンテストのコンテスト競技者コンテスタントが投稿期間終了後にそのコンテストのコンテストのエントリー制作の"追加時間"を得る可能性を妨げることを目的としたものです。編集がこれらの条件に違反するか不明な場合は、以下のフローチャートを参考にして下さい。
4. 投票総数を増やしたり、競争相手の投票数を減少させたりするために否定的や異常な行動を行った競技者コンテスタントは、ボーナスポイントが与えられます。
5. コンテストのコンテストについて何か疑問があったなら、ご自由に我が代理人の1人、
HarryBlank、
Liryn、
Rallistonにメッセージをしてください。彼らはコンテストのコンテスト運営者マーシャルです。
6. コンテスト運営者マーシャルであることについて何か疑問があったなら、ご自由にCommunity Outreach Teamにメッセージしてください。彼らはコンテストのコンテスト運営者マーシャルの運営者マーシャルです。
7. あなたがコンテストのコンテスト運営者マーシャルの運営者マーシャルの見解をコンテストしようとする競技者コンテスタントなら、ご自由にコンテストマーシュマロウにコンタクトしてください。
タグ付け
このページはコールドポストコンのエントリーであるため、このページをCommunity Outreachに査読してもらうことができず、そのため、コンテストのコンテストに先立って contestcontest タグを作る手配ができませんでした。なのであなたのエントリーは普通の古き良き コンテスト タグを得るのに必要なことだけをしてください。
特定の日付の間に作られたコンテストページのみをターゲットにするListpagesが私には使えないので、私がこのページを編集するまでエントリーはここにはリストされません。そしてこのページの編集はコールドポストコンが終了するまで許可されていません。なので、コールドポストコンの投票期間の終了とコンテストのコンテストの投稿期間の終了の間の1月12日に、全てのコンテストのコンテストのエントリーをこのページに反映するアップデートをします！ 現在このページにあるエントリーは、そのときまであなたを楽しませるためのプレースホルダーです。
Rounderhouse
djkaktus
LOVEMARGINAL
A Random Day &
Kalinin
spikebrennan &
Yossipossi
(account deleted), Anonymous, does not match any existing user name does not match any existing user name & Von Pincier
Placeholder McD
TheCommunity
Tanhony
stephlynch &
syuzhet
