インクブロットテーマ
このページはカスタムテーマページです。
Wiki内で使用されているカスタムテーマのためのページです。
運用について、詳しくはcategory-policy・custom-theme-policyを参照してください。
評価: 0+–x
blank.png

クレジット

タイトル: Croqstyle CSS
作者: ©︎CroquemboucheCroquembouche
作成年: 2021
訳者: nebula2700nebula2700

評価: 0+–x

これは何

ページの機能を改良するCSSを集めたものであり、非常に便利なため、CroquemboucheCroquembouche自身が多くのページで使用しています。

このコンポーネントは本当に軽微な変更を行うもので、執筆や、(私1がよくしている)コンポーネント/テーマの記述をしやすくします。これはあくまで文章を書きやすくするものであり、ページの見た目などを変えるものではありません。

私は、翻訳者がこのコンポーネントを気に入っていて、尚且つ使いたいわけでもなければ、このコンポーネントを使った記事において、その翻訳版でもこのコンポーネントが使われているとは思っていません。

このコンポーネントが他のコンポーネントやテーマと被ることはおそらくないだろうし、もし被ってしまってもそこまで問題ではないだろうと思っています。

使い方

どんなウィキでも:

[[include :scp-jp:component:croqstyle]]

このコンポーネントは、他のコンポーネントで使用されることを想定して設計されています。他のコンポーネントで使用する場合は、必ずそのコンポーネントの[[iftags]]ブロックの中に上記のコードを追加してください。これは、そのコンポーネントの使用者がCroqstyleの使用を強制されないようにするために重要なことです。

関連しているコンポーネント

スタイリングユーザーコンポーネント(数箇所を変更します):

スタイリングテーマ(見た目を細かく変更します):

CSS変更

適度なサイズの脚注

脚注の幅が100万マイルになるのを防ぎ2、実際に読みやすくします。

.hovertip { max-width: 400px; }

等幅編集/コード

編集テキストボックスを等幅にし、全ての等幅テキストのフォントを通常よりも明らかに優れたFira Codeに変更します。

@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; }

テレタイプのバックグラウンド

<tt>要素({{text}})に薄い灰色の背景を追加し、コードスニペットをより目立たせます。

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;
}

もうでかい顔には困らない

誰かのアバター画像にカーソルを合わせたときに、アバターの画像が大きく表示されないようにしました。あれは本当にくだらなくて、何より邪魔でした。大きなバージョンを見たいなら、クリックすれば良い話ですよね？

.avatar-hover { display: none !important; }

いくらでも改行すればいい

nobreakクラスを待つdiv内のテキストはどんな文字の間でも改行されます。3

.nobreak { word-break: break-all; }

コードの色

自分のターミナルのコードの色分けを変数として追加します。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.

また、[[div class="code terminal"]]として偽のコードブロックに.terminalクラスを追加することで、黒い背景の擬似ターミナルとして使うことができます。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;
}

デバッグモード

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; }

テーマのレビュー
CroquemboucheCroquemboucheより
5分で読了可

pancakes.png
評価: 0+–x
blank.png

クレジット

タイトル: インクブロットテーマ(Waldon Studio テーマ)
原題: Inkblot Theme (Waldon Studio Theme)
著作権者: CroquemboucheCroquembouche
翻訳責任者: takion00takion00
作成年: 2020
翻訳年: 2026
初訳時参照リビジョン: rev.59
元記事リンク: InkblotTheme

評価: 0+–x

これは以下のものについてのページです。

  1. インクブロットテーマのソース
  2. Waldon Studioの執筆ガイド
  3. 長い形式のテキストでこのテーマがどのように見えるかを示すためのデモ

インクブロットテーマはWaldon Studioが書いたアンブローズレストランのレビューまたは、準要注意団体のアンブロオーズのためにデザインされたテーマです。しかしどんな場合でもこのテーマを使用することが可能です。

使用方法は以下の通りです。

+ 簡易コピー&ペースト

Sigma-9トグルサイドバーコンポーネントを一緒に使用する場合：

+ トグルサイドバーを設置する際の追加手順

このテーマのほかのアクセントカラーのプレビュー：

/* Import fonts */
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Prata&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;600&display=swap');
 
/* Set the font size back to normal */
#page-content { font-size: 1rem; }
body { font-family: 'Libre Baskerville', serif; }
 
/* Hide the page title. I'll make my own damned title */
#page-title { display: none; }
 
/* - == === CUSTOM SYNTAX === == - */
 
/* The inkblot header contains the title and the info box thingy */
.inkblot-header {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
  margin: 1rem 0 3rem;
  width: 100%;
  left: 0;
  max-width: none !important; /* override #page-content div */
}
@media (min-width: 768px) {
  /* On desktop, header expands over the top of the sidebar */
  .inkblot-header {
    width: calc(100% + 18 * 0.82rem);
    left: calc(-18 * 0.82rem);
  }
}
 
/* The inkblot title is a grid */
.inkblot-title {
  flex: 1 1 0;
  font-size: min(4rem, 10vw);
  font-family: 'Prata', serif;
  display: inline-grid;
  grid-template-areas:
    "one two"
    "three four";
  grid-gap: 0.1em;
  max-width: 100%;
  position: relative;
  margin: 1rem;
}
.inkblot-title::before {
  content: "";
  border-radius: 74% 26% 27% 77% / 74% 38% 73% 38%;
  background-color: var(--inkblot-accent, transparent);
  position: absolute;
  height: 40%; width: 100%; top: 50%; left: 50%;
  transform: translate(-50%, -50%) skewY(-6deg);
  max-width: min(50vw, 80%);
}
.inkblot-title > * { z-index: 1; white-space: nowrap; }
.inkblot-title .title-1 { grid-area: one; place-self: start end; }
.inkblot-title .title-2 { grid-area: two; place-self: start start; }
.inkblot-title .title-3 { grid-area: three; place-self: start end; }
.inkblot-title .title-4 { grid-area: four; place-self: start start; }
.inkblot-title p { margin: 0; line-height: 1em; text-align: center; }
/* Italics encroach to the right a bit, so push them back */
.inkblot-title > em, .inkblot-title .title-1 em, .inkblot-title .title-3 em {
  position: relative;
  left: -0.1em;
}
 
@media (max-width: 767px) {
  .inkblot-title {
    flex-basis: 100%;
  }
}
 
/* The info box is itself a flex container */
.inkblot-info {
  flex: 1 1 0;
  text-align: center;
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  align-items: center;
}
.inkblot-info > p {
  min-width: 12.5rem;
}
/* On desktop, if the header overflows onto two rows, it will overlap the sidebar.
 * The max-width of the info thingy is reduced so it won't be wider than #page-content.
 * justify-content:flex-end on .inkblot-header pushes it to the right.
 * !important to override wikidot's default max-width on everything
 */
@media (min-width: 768px) {
  .inkblot-info {
    max-width: calc(100% - 18 * 0.82rem) !important;
  }
}
 
/* The image should only be styled fancy inside the info section.
 * It could be easily modified to allow a fancy image outside of the info
 * section, but I don't want to do that, because this arrangement is necessary
 * for proper line-wrapping on mobile, and the misformatted image acts as a
 * good indicator that something has gone wrong.
 */
.inkblot-info .inkblot-image { flex: 0 1 10rem; min-width: 10rem; }
.inkblot-info .inkblot-image img {
  border-radius: 65% 35% 43% 57% / 41% 35% 65% 59%;
  box-shadow: 0.5rem 0 var(--inkblot-accent, transparent);
  /* The height is 8rem, but I want it slightly bigger */
  height: 10rem; width: 10rem;
  margin: -1rem 0;
}
 
/* The inksplot class makes anything blobby */
.inksplot {
  border-width: 0.5rem;
  border-style: solid;
  border-color: var(--inkblot-accent); /* if no accent, will not override */
  padding: 2rem 4rem;
  margin: 1rem -3rem;
  border-radius: 38% 95% 94% 42% / 62% 56% 84% 75%;
}
/* On mobile, the inkblot is rectangular and boring to save space */
@media (max-width: 960px) and (min-width: 767px), (max-width: 650px) {
  .inksplot {
    padding: 1rem;
    border-radius: 5rem / 3rem;
    margin: 1rem -1rem;
  }
}
 
/* - == === DISTRIBUTED BLOBS === == - */
 
/* I want some blobs of colour down the page.
 * Thankfully, Wikidot gives me some extra dives to play with:
 * 6 in #container-wrap-wrap and 3 in #container.
 * They are #extra(c?)-div-[1-6]. That's a lot of selectors. */
 
#container-wrap-wrap, #container { position: relative; overflow: hidden; }
 
/* Based on CSS by Murray Smith (CC BY-SA 3.0)
 * https://stackoverflow.com/a/14451916/4958427 */
 
[id^=extra][id*=-div-] {
  position: absolute;
  z-index: -1;
  pointer-events: none;
  --content-width: min(1040px, 100vw);
  --content-margin: calc(50vw - var(--content-width) / 2);
  --blob-width: 30rem;
  --blob-radius: calc(var(--blob-width) * 0.67);
  background-color: var(--inkblot-accent, transparent);
  top: var(--top-offset);
  transform: rotate(var(--rotation))
             translate(calc(var(--sin-rotation) * 0.866 * var(--blob-radius) / 2),
                       calc(-1 * var(--cos-rotation) * 0.866 * var(--blob-radius) / 2))
             skewX(-30deg)
             scale(1, 0.866);
}
[id^=extra][id*=-div-]:before,
[id^=extra][id*=-div-]:after {
  content: '';
  position: absolute;
  background-color: inherit;
}
[id^=extra][id*=-div-],
[id^=extra][id*=-div-]:before,
[id^=extra][id*=-div-]:after {
  width: var(--blob-width); height: var(--blob-width);
  border-top-right-radius: 95%;
}
[id^=extra][id*=-div-]:before {
  transform: rotate(-135deg) skewX(-45deg) scale(1.414, 0.707) translate(0,-50%);
}
[id^=extra][id*=-div-]:after {
  transform: rotate(135deg) skewY(-45deg) scale(0.707, 1.414) translate(50%);
}
 
/* A lot of maths went into this.
 * To centre a triangle onto its container, it needs the following translation:
 * where A is the angle of rotation:
 * x:
 *   sin(N)
 *   * 0.866 (scale offset)
 *   * radius
 *   / 2
 * y:
 *   -1
 *   * cos(N)
 *   * 0.866 (scale offset)
 *   * radius
 *   / 2
 * Triangles have an order of symmetry around 120deg, so any angles above that are pointless.
 */
#extra-div-1,
#extra-div-3,
#extra-div-5,
#extrac-div-1,
#extrac-div-3 {
  right: calc(var(--blob-radius) * -2 + var(--content-margin));
}
#extra-div-2,
#extra-div-4,
#extra-div-6,
#extrac-div-2 {
  left: calc(var(--blob-radius) * -2 + var(--content-margin));
}
#extra-div-1 {
  --blob-width: 30rem;
  --top-offset: 500px;
  --rotation: 53.33deg; --sin-rotation: 0.802; --cos-rotation: 0.597;
}
#extra-div-2 {
  --blob-width: 30rem;
  --top-offset: 1300px;
  --rotation: 40deg; --sin-rotation: 0.642; --cos-rotation: 0.766;
}
#extra-div-3 {
  --blob-width: 20rem;
  --top-offset: 2100px;
  --rotation: 66.66deg; --sin-rotation: 0.918; --cos-rotation: 0.396;
}
#extra-div-4 {
  --blob-width: 15rem;
  --top-offset: 2900px;
  --rotation: 13.33deg; --sin-rotation: 0.231; --cos-rotation: 0.973;
}
#extra-div-5 {
  --blob-width: 40rem;
  --top-offset: 3700px;
  --rotation: 26.66deg; --sin-rotation: 0.448; --cos-rotation: 0.893;
}
#extra-div-6 {
  --blob-width: 25rem;
  --top-offset: 4500px;
  --rotation: 106.66deg; --sin-rotation: 0.958; --cos-rotation: -0.286;
}
#extrac-div-1 {
  --blob-width: 15rem;
  --top-offset: 5300px;
  --rotation: 93.33deg; --sin-rotation: 0.998; --cos-rotation: -0.058;
}
#extrac-div-2 {
  --blob-width: 10rem;
  --top-offset: 6100px;
  --rotation: 120deg; --sin-rotation: 0.855; --cos-rotation: -0.500;
}
#extrac-div-3 {
  --blob-width: 7rem;
  --top-offset: 6900px;
  --rotation: 80deg; --sin-rotation: 0.984; --cos-rotation: 0.173;
}
 
/* - == === HEADER === == - */
 
/* Replace the header background */
/* 324px is twice the height of the default header */
div#container-wrap { background: url(https://scp-wiki.wdfiles.com/local--files/theme%3Ainkblot/review-header.svg) top left/100% 648px no-repeat; }
 
#header { background: radial-gradient(circle at left 75px top 90px, var(--inkblot-accent, transparent) 42px, transparent 42.5px); }
 
/* Replace the header text */
/* Centre the text into the middle of the header */
#header h1, #header h2 { margin-left: 0; float: none; text-align: center; }
/* Move the subtitle down a smidge */
#header h2 { margin-top: 0.3rem; }
/* Hide the existing text */
#header h1 span, #header h2 span { font-size: 0; }
/* Style the new text */
#header h1 a::before, #header h2::before {
  color: #333;
  font-family: 'Montserrat', sans-serif;
  text-shadow: none;
}
/* Set the new text's content from variable */
#header h1 a::before {
  content: var(--header-title, "WALDON STUDIO");
  font-weight: 300;
}
#header h2::before {
  content: var(--header-subtitle, "connoisseurs of the unknown");
  font-weight: 600;
}
 
/* Hide the search box and tuck the button next to the login */
#search-top-box { top: 10px; transform: translateY(-7%); }
#search-top-box-form > input[type=text] { display: none; }
#search-top-box-form > input[type=submit] {
  background:
    url('https://scp-wiki.wdfiles.com/local--files/theme%3Ainkblot/search-solid.svg') 50%/0.8rem no-repeat,
    var(--inkblot-accent, transparent)
    !important /* don't revert on mouseover */;
  border: none;
  border-radius: 50%;
  font-size: 0;
  height: 1.5rem; width: 1.5rem;
}
#login-status { right: calc(10px + 2rem); color: #333a; }
#login-status a { color: #b01a; }
 
/* - == === LINKS === == - */
 
/* Make links be a darkened version of the accent colour. If not set, the accent colour is assumed to be red because that ends up looking similar to baseline Sigma links. */
a, a:visited, #side-bar a, #interwiki a {
  color: color-mix(in srgb, black 25%, var(--inkblot-accent, red));
 
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 0.25rem;
}
:is(#side-bar a, #interwiki a):not(:hover) {
  text-decoration: none;
}
:is(a, a:visited, #side-bar a, #interwiki a):hover {
  text-decoration-style: solid;
}
 
/* - == === TOPBAR === == - */
 
#top-bar { display: flex; justify-content: center; right: 0; }
#top-bar a { color: #333d; }
 
/* - == === SIDEBAR === == - */
 
/* Move the side bar down, out of the way of the inkblot header */
@media (min-width: 768px) {
  #side-bar { top: 12rem; }
}
 
/* Make the sidebar look pretty */
/* Keep the side block colours - I like them */
#side-bar .side-block,
#interwiki .side-block {
  border: none;
  border-radius: 0.5rem;
  box-shadow: none;
}
 
#side-bar .heading,
#interwiki .heading {
  margin: 0.6rem 0 0.5rem;
  padding: 0;
  color: #000a;
  height: 1rem;
  display: flex;
  justify-content: space-around;
  align-items: center;
  border: none;
}
#side-bar .heading::before,
#side-bar .heading::after,
#interwiki .heading::before,
#interwiki .heading::after {
  content: "";
  height: 1px;
  box-sizing: border-box;
  border-bottom: 1px dotted #333;
  margin: 0.1rem 0.5rem 0;
  flex: 1 1 0;
}
#side-bar .menu-item > img,
#interwiki .menu-item > img {
  visibility: hidden;
}
 
#top-bar .open-menu a {
  border-radius: 1px;
  border: none;
  border-left: 0.25rem solid var(--inkblot-accent, #333);
  border-right: 1px dotted #333;
  text-decoration: none;
}
@media (max-width: 767px) {
  #side-bar {
    background-image:
      radial-gradient(
        circle at left 10% top 90%,
        var(--inkblot-accent, white) 25%,
        transparent 25%
      ),
      linear-gradient(-75deg, #ccc 30%, white 30%);
    border-right: 4px dotted #444 !important;
    background-clip: padding-box;
  }
}
 
/* - == === RATING MODULE === == - */
 
.page-rate-widget-box { box-shadow: none; }
.page-rate-widget-box {
  display: inline-flex;
  justify-content: flex-end;
  align-items: center;
  border-radius: 0;
  border-width: 1px 0;
  border-style: dotted;
  border-color: #333;
  padding: 0.1rem;
  margin-right: 3rem;
}
div.page-rate-widget-box .rate-points,
.page-rate-widget-box .cancel {
  background-color: transparent;
  border-radius: 0;
  border: none;
  color: #333;
}
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
  background-color: var(--inkblot-accent, transparent);
  border-radius: 50%;
  border: none;
  color: #333;
  height: 1.5rem; width: 1.5rem;
  position: relative;
  margin-left: 0.25rem;
}
.page-rate-widget-box .cancel {
  color: #333;
  height: 1.5rem; width: 1.5rem;
  position: relative;
}
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a,
.page-rate-widget-box .cancel a {
  position: absolute;
  display: block;
  top: 0; left: 0; height: 100%; width: 100%;
  text-align: center; line-height: 1.5rem;
  color: #333;
  padding: 0;
  margin: 0;
  font-weight: bold;
}
.page-rate-widget-box .cancel a { color: transparent; }
.page-rate-widget-box .cancel a::after {
  content: "⤬";
  position: absolute;
  color: #333;
  top: 0; left: 0; height: 100%; width: 100%;
}
.page-rate-widget-box .rateup a:hover { background-color: limegreen; }
.page-rate-widget-box .ratedown a:hover { background-color: tomato; }
.page-rate-widget-box .cancel a:hover {
  color: transparent;
  background-color: transparent;
  border-radius: 0;
}
 
/* Info module compatibility */
/* More specific because will probably be imported before the info module */
#main-content #page-content .rate-box-with-credit-button {
  background: none;
  border-radius: 0;
  box-shadow: none;
  border-width: 1px 0;
  border-style: dotted;
  border-color: #333;
  display: flex;
  align-items: center;
}
#main-content #page-content .rate-box-with-credit-button .page-rate-widget-box {
  border: none;
}
#main-content #page-content .rate-box-with-credit-button .page-rate-widget-box .creditButton {
  height: 1rem;
  width: 1rem;
  background-color: var(--inkblot-accent, transparent);
  border-radius: 50%;
  box-shadow: none;
}
#main-content #page-content .rate-box-with-credit-button .page-rate-widget-box .creditButton a {
  color: #333;
  border: none;
  line-height: 1rem;
  margin-left: 0;
}
 
#main-content #page-content .rate-box-with-credit-button .page-rate-widget-box span.cancel a { color: transparent; }
#main-content #page-content .rate-box-with-credit-button .page-rate-widget-box span.cancel a::after {
  content: "⤬";
  position: absolute;
  color: #333 !important;
  top: 0; left: 0; height: 100%; width: 100%;
}
 
#main-content #page-content .rate-box-with-credit-button .page-rate-widget-box span:is(.rateup,.ratedown) {
  background-color: var(--inkblot-accent, transparent);
  border-radius: 50%;
  border: none;
  color: #333;
  height: 1.5rem;
  width: 1.5rem;
  position: relative;
  margin: 0rem;
  margin-left: 0.25rem;
}
 
/* - == === IMAGE BLOCKS === == - */
 
.scp-image-block {
  border: none;
  border-top: 1px dotted #333;
  box-shadow: none;
}
.scp-image-block .scp-image-caption {
  background: none;
  border-top: solid 0.25rem var(--inkblot-accent, transparent);
  padding-top: 0.5rem;
  font-weight: normal;
}
.scp-image-block img {
  padding: 0.5rem;
  box-sizing: border-box;
}
@media (min-width: 768px) {
  .scp-image-block.block-left {
    margin-left: -100px;
  }
}
@media (min-width: 1250px) {
  .scp-image-block.block-right {
    margin-right: -100px;
  }
}
@media (max-width: 600px) {
  .scp-image-block.block-left, .scp-image-block.block-right {
    float: none; clear: both; margin-left: auto; margin-right: auto;
  }
}
 
/* Compatibility with Woedenaz' Image Features
 * http://scp-wiki.wikidot.com/component:image-features-source
 * Image Features other than hover-to-zoom may need more fixes
 */
.image-hover-enlarge img {
  box-shadow: none !important;
}
 
/* - == === OTHER STUFF === == - */
 
li, p {
  line-height: 1.6em;
  letter-spacing: 0.01em;
}
 
#page-content h1, #page-content h2, #page-content h3,
#page-content h4, #page-content h5, #page-content h6 {
  font-family: 'Libre Baskerville', serif;
  color: #333;
  margin: 1em 0 0.5em 0;
  letter-spacing: 0;
}
#page-content h1 {
  font-family: 'Prata', serif; font-size: 3rem; text-align: center;
}
#page-content h2 { font-size: 2rem; font-weight: bold; }
 
hr {
  margin: 3rem;
  height: 1rem;
  background: radial-gradient(circle at center, var(--inkblot-accent, transparent) 0.375rem, transparent calc(0.375rem + 0.5px));
  display: flex;
  justify-content: space-around;
  align-items: center;
}
hr::before, hr::after {
  content: "";
  height: 1px;
  box-sizing: border-box;
  border-bottom: 1px dotted #333;
  width: calc(50% - 3rem);
}
 
.page-tags span {
  border-top: 1px dotted #333;
}
 
.footnotes-footer {
  margin-top: 2rem;
}
 
#page-content {
  margin-bottom: 2rem;
}
 
#footer {
  background: transparent;
}
 
#footer a {
  color: black;
}
 
#breadcrumbs, .pseudocrumbs {
  display: flex;
  flex-direction: row-reverse;
  font-size: 0;
  margin-top: -1rem;
}
#breadcrumbs a, .pseudocrumbs a {
  font-size: 0.82rem;
  margin-left: 0.3rem;
}
#breadcrumbs a::before, .pseudocrumbs a::before {
  content: "«";
  margin-right: 0.3rem;
}
 
.licensebox {
  font-size: 0.82rem;
  font-family: verdana, arial, helvetica, sans-serif;
  margin: 1rem 0 -1.5rem;
}
 
span, a {
  word-break: normal;
}
 
blockquote, div.blockquote {
  border: none;
  border-left: thick solid var(--inkblot-accent, #eee);
  background: none;
}
Footnotes
enテーマ
ページリビジョン: 8, 最終更新: 21 Jul 2026 00:10
編集 評価 (0) タグ ディスカッション 履歴 ファイル 印刷 サイトツール + オプション
特に明記しない限り、このページのコンテンツは次のライセンスの下にあります: Creative Commons Attribution-ShareAlike 3.0 License