Paperstackテーマ
このページはカスタムテーマページです。
Wiki内で使用されているカスタムテーマのためのページです。
運用について、詳しくはカテゴリ運用ポリシーカスタムテーマに関するポリシーを参照してください。
lgtrans.png
評価: +34

アイテム番号:

9999

収容クラス:

THEME-IEL

test.png

"grid-item"ブロックに含まれる画像ブロック。幅は300pxを推奨します。

ここに短い文章

このテキストは、"textbox"ブロックに含まれています。画像ブロックを含む"grid-item"ブロックの後に使用して、左側の余白を埋めることを目的としています。テキストが重なってしまわないよう、ここに書く段落は短いものにしてください。

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

ここからは通常の(どのブロックにも含まれていない)テキストが始まります。 Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


このテーマは、Containment Breachのインターフェースに着想を得て、EstrellaYoshte EstrellaYoshte によって作成されました。このテーマを使用するには、次のテキストをページの最初に入力してください:

[[include :scp-jp:theme:paperstack]]

[[div class="logo"]]
[[image https://scp-jp.wdfiles.com/local--files/theme%3Apaperstack/lgtrans.png]]
[[/div]]

[[>]]
[[module Rate]]
[[/>]]

[[div class="header-container"]]
[[div class="text-item"]]
[[size 90%]]##grey|**アイテム番号:**##[[/size]]

[[size 220%]]**(番号)**[[/size]]
[[/div]]

[[div class="text-item"]]
[[size 90%]]##grey|**収容クラス:**##[[/size]]

[[size 220%]]**(クラス)**[[/size]]
[[/div]]

[[div class="grid-item"]]
[[include component:image-block name=画像URL|caption=画像キャプション|width=300px|align=center]]
[[/div]]
[[/div]]

[[div class="textbox"]]
ここに短い文章
[[/div]]

使用する"text-item"ブロックの数を増減させることもできます。(4つ以下にすることを推奨します)

[[include :scp-jp:theme:paperstack]]

[[div class="logo"]]
[[image https://scp-jp.wdfiles.com/local--files/theme%3Apaperstack/lgtrans.png]]
[[/div]]

[[>]]
[[module Rate]]
[[/>]]

[[div class="header-container"]]
[[div class="text-item"]]
ここに文章を入力
[[/div]]
[[/div]]

t1.png

1つだけ"text-item"ブロックを使用した例

t3.png

3つの"text-item"ブロックを使用した例

t4.png

4つの"text-item"ブロックを使用した例


"logo"ブロックの画像は任意に変更することができます。

ヘッダーのタイトルも、次のコードを使用して変更できます:

[[module css]]
:root {
--header-title: "ヘッダータイトル";
--header-subtitle: "サブタイトル";
}
[[/module]]


これはタブです。

おや、ここにも文章があります

不思議ですね。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは長いタブです。こんなに長い文章を含んでいます。

これは引用ブロックで。, 各行頭に"> "を置くことで作ることができます。
さらなる文字列


これは分割線

入れ子にされた引用ブロック

これは テーブルです
作り方は すでに
知っていますね?

見出しフォント: Sawarabi Gothic / Josefin Sans

本文フォント: Noto Sans JP / Oxygen

等幅フォント: Fira Code

ソースコード:

/*PaperstackTheme[2020WikidotTheme]ByEstrellaYoshteBased on:
 InkblotThemebyCroquemboucheWordProcessorThemebystormbreathModernThemebyAzamoSimpleYonderThemebyEstrellaYoshteEditedbyukwhatnforSCP-JP*/
 
/*JapaneseFont*/
@importurl('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;700&display=swap');
@importurl('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');
/*EnglishFont*/
@importurl('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&display=swap');
@importurl('https://fonts.googleapis.com/css2?family=Oxygen&display=swap');
@importurl(https://fonts.googleapis.com/css2?family=Fira+Code&display=swap);
 
#page-content{font-size:0.87rem;
}body{font-family: "Noto Sans JP", "Oxygen", sans-serif;
}body{color:black;
 background-image: linear-gradient(
 to bottom,
 #EFEFEF, #EFEFEF276px,
 #D3D3D3276px, #ffffff282px,
 #ffffff282px, #ffffff100%
 );
 background-repeat:no-repeat;
}#main-content{top: -1.6rem;
 padding:0.2em;
}.page-source, .codepre, .codep, .code, tt{font-family: "Fira Code", monospace;
}
 
/* ---- HEADER ---- */
 
div#container-wrap{background-image:none;
}div#header{background-image:none;
}#headerh1, #headerh2{margin-left:0;
 float:none;
 text-align:center;
}
 
/*Movethesubtitledownasmidge*/
#headerh2{margin-top:0.45rem;
}
 
/*Hidetheexistingtext*/
#headerh1span, #headerh2span{font-size:0;
 display:none;
}
 
/*Stylethenewtext*/
#headerh1a::before, #headerh2::before{color:#333333;
 font-family: "Josefin Sans", sans-serif;
 text-shadow:none;
}
 
/*Setthenewtext'scontentfromvariable*/
#headerh1a::before{content: var(--header-title, "SCP FOUNDATION");
 font-weight:300;
 font-size:1.3em;
}#headerh2::before{content: var(--header-subtitle, "SECURE - CONTAIN - PROTECT");
 font-weight:600;
 font-size:1.22em;
}#login-status,
#login-statusa{color:#333333;
}#page-title{display:none;
}#footer, #footera{background:transparent;
 color:#333333;
}#search-top-box-input,
#search-top-box-input:hover,
#search-top-box-input:focus,
#search-top-box-forminput[type=submit],
#search-top-box-forminput[type=submit]:hover,
#search-top-box-forminput[type=submit]:focus{border:none;
 background:#333333;
 box-shadow:none;
 border-radius:0px;
 color:#efefef;
}#search-top-boxinput.empty{color:#999999;
}#search-top-box{top:2.3rem !important;
 right:8px;
}
 
/* ---- TOPBAR ---- */
 
#top-bar{display: flex;
 justify-content:center;
 right:0;
 top:7.9rem;
}#top-bar, #top-bara{color:#333333;
}
 
/* ---- SIDEBAR ---- */
 
#side-bar.side-block{border:transparent;
 border-radius:0;
 box-shadow:0px0px7px#999999;
 background:#ffffff;
}#side-bar.side-block.media > *{display: flex;
 justify-content: space-evenly;
}#top-bardiv.open-menua{border-radius:0;
 box-shadow:0px1px4px0 rgba(0, 0, 0, 0.2), 0px3px10px0 rgba(0, 0, 0, 0.19);
 border:1pxwhite;
}@media (max-width: 767px) {#main-content{padding:0;
 margin:05%;
 border-left:none;
 }#page-title{margin-top:0.7em;
 }#side-bar{background-color:#fff;
 }#side-bar:target{border:none;
 box-shadow:3px01px -2px rgba(0, 0, 0, 0.04), 1px05px0 rgba(0, 0, 0, 0.2);
 }#side-bar.close-menu{transition: width 0.5s ease-in-out 0.1s,
 opacity 1s ease-in-out 0s;
 display:block;
 position:fixed;
 width:100%;
 height:100%;
 top:0;
 right:0;
 background: rgba(0, 0, 0, 0.3);
 background-position:19em50%;
 z-index: -1;
 opacity:0;
 pointer-events:none;
 }#side-bar:target.close-menu{width: calc(100% - 19em);
 right:0;
 left:auto;
 opacity:1;
 pointer-events:auto;
 }#page-content > hr, #page-content > .list-pages-box > .list-pages-item > hr{margin:3em -5.5%;
 }#side-bar{top:0;
 }#side-bar.heading{padding-left:1em;
 margin-left: -1em;
 }#search-top-box{top:107px;
 }}
 
/* ---- TABS ---- */
 
/* ---- YUITABBASE ---- */
.yui-navset.yui-nava, .yui-navset.yui-navset-top.yui-nava{background-color:inherit;
 background-image:inherit}.yui-navset.yui-nava:hover, .yui-navset.yui-nava:focus{background:inherit;
 text-decoration:inherit}.yui-navset.yui-nav.selecteda, .yui-navset.yui-nav.selecteda:focus, .yui-navset.yui-nav.selecteda:hover{color:inherit;
 background:inherit}.yui-navset.yui-nav, .yui-navset.yui-navset-top.yui-nav{border-color:inherit}.yui-navsetli{line-height:inherit}
 
/* ---- YUITABCUSTOMIZATION ----*/
 
.yui-navset.yui-nav,
.yui-navset.yui-navset-top.yui-nav{display: flex;
 flex-wrap: wrap;
 width: calc(100% - .125rem);
 margin:0auto;
 border-color:#333333;
 box-shadow:none;
}.yui-navset.yui-nava, /* ---- LinkModifier ---- */
.yui-navset.yui-navset-top.yui-nava{color:#333333;
 /* ---- TabBackgroundColour | [UNSELECTED] ---- */
 background-color:#efefef;
 border: unset;
 box-shadow:none;
 box-shadow:none;
}.yui-navset.yui-nava:hover,
.yui-navset.yui-nava:focus{color:#ffffff;
 /* ---- TabBackgroundColour | [HOVER] ---- */
 background-color:#333333;
}.yui-navset.yui-navli, /* ---- ListitemModifier ---- */
.yui-navset.yui-navset-top.yui-navli{position:relative;
 display: flex;
 flex-grow:2;
 max-width:100%;
 margin:0;
 padding:0;
 color:#ffffff;
 background-color:#ffffff;
 border-color:transparent;
 box-shadow:none;
}.yui-navset.yui-navlia,
.yui-navset-top.yui-navlia,
.yui-navset-bottom.yui-navlia{display: flex;
 align-items:center;
 justify-content:center;
 width:100%;
}.yui-navset.yui-navliem{border: unset;
}.yui-navset.yui-navaem,
.yui-navset.yui-navset-top.yui-navaem{padding:.35em.75em;
 
 text-overflow: ellipsis;
 overflow:hidden;
 white-space:nowrap;
}.yui-navset.yui-nav.selected, /* ---- SelectionModifier ---- */
.yui-navset.yui-navset-top.yui-nav.selected{flex-grow:2;
 margin:0;
 padding:0;
 /* ---- TabBackgroundColour | [SELECTED] ---- */
 background-color:#333333;
}.yui-navset.yui-nav.selecteda,
.yui-navset.yui-nav.selectedaem{border:none;
}.yui-navset.yui-nav.selecteda{width:100%;
 color:#ffffff;
}.yui-navset.yui-nav.selecteda:focus,
.yui-navset.yui-nav.selecteda:active{color:#ffffff;
 background-color:#333333;
}.yui-navset.yui-content{background-color:#ffffff;
 box-shadow:0px0px4px#999999;
}.yui-navset.yui-content,
.yui-navset.yui-navset-top.yui-content{padding:.5em;
 border:none;
}
 
/* ---- INFOBAR ---- */
body{
 --barColour:#333333;
}.info-container.collapsible-block-content{padding:0.5em30px;
}.info-container.collapsible-block-content.wiki-content-table{width:100%;
}
 
/* ---- INFOPANE ---- */
 
#page-content.creditRate{margin: unset;
 margin-bottom:4px;
}#page-content.rate-box-with-credit-button{background-color:#ffffff;
 border:solid1px#ffffff;
 box-shadow:0px0px7px#999999;
 border-radius:0;
}#page-content.rate-box-with-credit-button.fa-info{border:none;
 color:#333333;
}#page-content.rate-box-with-credit-button.fa-info:hover{background:#333333;
 color:#ffffff;
}.rate-box-with-credit-button.cancel{border:solid1px#ffffff;
}
 
/* ---- PAGERATING ---- */
 
.page-rate-widget-box{box-shadow:0px0px7px#999999;
 margin: unset;
 margin-bottom:4px;
 border-radius:0;
 font-family: "Oxygen", sans-serif;
}div.page-rate-widget-box.rate-points{background-color:#ffffff;
 color:#333333 !important;
 border:solid1px#ffffff;
 border-radius:0;
}.page-rate-widget-box.rateup,
.page-rate-widget-box.ratedown{background-color:#ffffff;
 border-top:solid1px#ffffff;
 border-bottom:solid1px#ffffff;
}.page-rate-widget-box.rateupa,
.page-rate-widget-box.ratedowna{background:transparent;
 color:#333333;
}.page-rate-widget-box.rateupa:hover,
.page-rate-widget-box.ratedowna:hover{background:#333333;
 color:#ffffff;
}.page-rate-widget-box.cancel{background:transparent;
 background-color:#ffffff;
 border:solid1px#ffffff;
 border-radius:0;
}.page-rate-widget-box.cancela{color:#333333;
}.page-rate-widget-box.cancela:hover{background:#333333;
 color:#ffffff;
 border-radius:0;
}
 
/* ---- PAGEELEMENTS ---- */
 
h1,
h2,
h3,
h4,
h5,
h6{color:#333333;
 font-family: "Sawarabi Gothic", "Josefin Sans", sans-serif;
 font-weight:bold;
}blockquote,
div.blockquote,
#toc,
.code{background-color:#F8F8F8;
 border:solid1px#F8F8F8;
 box-shadow:0px0px4px#999999;
}.scp-image-block{border:solid8px#ffffff;
 box-shadow:0px0px5px#999999;
 box-sizing: border-box;
}.scp-image-block.scp-image-caption{background-color:#ffffff;
 border-top:solid4px#ffffff;
 color:black;
}#page-content.wiki-content-tabletrth{border:solid1px#999999;
 background-color:#efefef;
 /*setborderfortabletitle*/
}#page-content.wiki-content-tabletrtd{border:solid1px#999999;
 /*setborderfortablecontent*/
}
 
/*-- tags --*/
 
#main-content.page-tagsspan{max-width:100%;
}#main-content.page-tagsa{height:0.9rem;
 line-height:0.9rem;
 font-size:0.76rem;
 background-color:#FDFDFD;
 border-radius:0.6rem 0.12rem;
 margin:.25rem .2rem;
 .5rem .2rem;
 padding:0.2rem 0.42rem 0.25rem 0.46rem;
 box-shadow:0.6px0.6px1.9px0.8px rgba(0, 0, 0, 0.27);
}#main-content.page-tagsa:before{content: "•";
 font-size:1.1rem;
 float:left;
 position:relative;
 top: -0.19rem;
 left: -0.24rem;
 color:#ffffff;
 background-color:#B8B8B8;
 color:transparent;
 text-shadow:1px1px0.7px rgba(255, 255, 255, 0.82);
 -webkit-background-clip:text;
 -moz-background-clip:text;
 background-clip:text;
}
 
/* ---- CUSTOMSYNTAX ---- */
 
.header-container{display: flex;
 justify-content: flex-end;
 align-items:center;
 flex-wrap: wrap;
 position:relative;
 justify-content: space-around;
 align-content: space-between;
 width:100%;
 left:0;
 align-items: flex-start;
 row-gap:2px;
}.text-item{flex-grow:1;
 max-width:25%;
 text-align:center;
}.grid-item{flex-grow:1;
 min-width:25%;
 text-align:center;
 margin:8px6px;
}@media (max-width: 1200px) {.grid-item{min-width:50%;
 }}.logo{position:absolute;
 width:180px;
 top: -154px;
 left: -17em;
 z-index: -1;
}@media (max-width: 767px) {.logo{width:36%;
 top: -9.7em;
 left:32%;
 }}.textbox{position:absolute;
 width:42%;
 top:7.5rem;
}@media (max-width: 960px) and (min-width: 767px), (max-width: 666px) {.textbox{position:relative;
 width:100%;
 top:0;
 }}
 
/*CreditModule対応 byukwhatn*/
.creditRate.creditModule.creditButton{background-color:white;
 border: unset;
 border-radius:0px;
 margin-left:5px;
 height:100%;
}.creditRate.creditModule.creditButtona{height:100%;
 line-height:20px;
}
Footnotes
. これは脚注です。
ページリビジョン: 5, 最終更新: 07 Mar 2023 12:38
特に指定がない限り、このサイトのすべてのコンテンツはクリエイティブ・コモンズ 表示 - 継承3.0ライセンス の元で利用可能です。
ページを編集するにはこのボタンをクリックしてください。
セクションごとの編集を切り替えるにはこのボタンをクリックしてください(ページにセクションが設定されている必要があります)。有効になった場合はセクションに"編集"ボタンが設置されます。
ページのソース全体を編集せずに、コンテンツを追加します。
このページが過去にどのように変化したかを調べることができます。
このページについて話をしたいときは、これを使うのが一番簡単な方法です。
このページに添付されたファイルの閲覧や管理を行うことができます。
サイトの管理についての便利なツール。
このページの名前(それに伴いURLやページのカテゴリも)を変更します。
編集せずにこのページのソースコードを閲覧します。
親ページを設定/閲覧できます(パンくずリストの作成やサイトの構造化に用いられます)
管理者にページの違反を通知する。
何か思い通りにいかないことがありますか? 何ができるか調べましょう。
Wikidot.comのシステム概要とヘルプセクションです。
Wikidot 利用規約 ― 何ができるか、何をすべきでないか etc.
Wikidot.com プライバシーポリシー

AltStyle によって変換されたページ (->オリジナル) /