Rateモジュール:
Creditモジュール:
これは、PaperstackテーマをベースにEstrellaYoshte EstrellaYoshte によって作成されたテーマです。
このテーマを使用するには、次のテキストをページ最上部にコピーしてください:
[[include :scp-jp:theme:penumbra]]
[[include]]の後にCSSモジュールを配置することで、タイトル・サブタイトル・ヘッダーロゴ・アクセントカラーを変更することもできます:
:root {
--header-title: "サイトタイトル";
--header-subtitle: "サイトタブタイトル";
--lgurl: url("ロゴの画像ファイルのURL");
--accentColor: アクセントカラー;
}
デフォルトでは、アクセントカラーは#1EB5E8です。
画像
分割線はハイフンを5つ並べることで作成できます。引用ブロックなどの内部になければ、ページの横幅全体に広がります。このページでセクションを区切っているのが分割線です。
見出しは、1つから6つの"+"を行頭に挿入することで表示できます。
見出し1
見出し2
見出し3
見出し4
見出し5
見出し6
これはタブです
ここにもテキストが!
面白いですね。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは長いタブです。たくさんのテキストを書くこともできます。
これは引用ブロックです。"> "を各行の行頭に挿入することで作成できます。
続きのテキスト
これは分割線です
ネストされた引用ブロック
これが | テーブルです |
---|---|
使い方は | もう |
知っているでしょう? |
[[div class="darkbox"]]
[[div class="lightbox"]]
sideboxは次のようにセットアップできます:
[[div class="limit"]] <— sideboxを表示したいエリアの先頭に配置
[[div class="anchor"]] <— sideboxを置きたい場所に配置
[[div class="sidebox"]]
sidebox内のテキスト
[[/div]]
[[/div]]
sideboxの左に表示したいテキスト
[[/div]] <— sideboxを表示したいエリアの最後に配置
工夫次第で
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean non molestie nulla. Morbi vitae massa auctor, porta arcu eget, dictum tellus. Etiam scelerisque aliquam ipsum, ac convallis lorem scelerisque eget.
Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; In finibus purus non commodo porttitor. Integer sed felis dui. Nulla nec tincidunt velit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.
複数のsideboxを使うことも
Vivamus sapien sem, gravida non vulputate eu, vestibulum vel lacus. Nulla massa erat, sodales dignissim vehicula non, fringilla id ante. Morbi eleifend lacus non nisl finibus aliquam. Proin tristique, lacus eu varius porttitor, lorem justo ullamcorper massa, sed ultricies elit dolor vitae nisi. Fusce varius nec sapien malesuada luctus. Pellentesque efficitur porttitor turpis sit amet rhoncus.
Sed non sollicitudin nisl. Suspendisse finibus, est et venenatis placerat, diam lorem porttitor elit, ac sollicitudin arcu erat et orci. Curabitur erat mi, congue quis imperdiet ut, fringilla vitae sapien. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis nec ante pretium est commodo convallis id a sapien. Morbi sit amet ultricies urna.
できるというわけです。
Ut semper, tellus vel tristique convallis, nulla mi laoreet nisi, eu malesuada ipsum magna sed dolor. Pellentesque nec lorem eu ante tristique efficitur. Sed auctor tortor ipsum. Morbi laoreet interdum scelerisque. Vivamus id enim nisl. Donec vitae leo suscipit, venenatis tortor eget, laoreet diam.
Sed sollicitudin, arcu ut condimentum vulputate, dui diam convallis velit, vitae ultricies leo libero non metus. Vestibulum at aliquam nisi. Aenean molestie tortor orci, ac volutpat magna eleifend vitae. Morbi tristique risus tortor, feugiat efficitur augue imperdiet ut. Aliquam nec urna lacinia, pretium ligula ut, gravida ex.
limitブロックがないと、anchorブロックが指定した場所を離れてしまった時にページ全体に波及してしまいます。
sideboxは幅1290px以下のウィンドウ/スクリーンでは最小化されます。(Woedenaz Woedenaz が作ってくれました!)
ヘッダーフォントはJosefin Sans
bodyはRobotoです。
等幅フォントはFira Codeです。
ソースコード:
/* source: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1*/ #top-bar.open-menua{position:fixed; bottom:0.5em; left:0.5em; z-index:15; font-family: san-serif; font-size:30px; font-weight:700; width:30px; height:30px; line-height:0.9em; text-align:center; border:0.2emsolid#888 !important; background-color:#fff !important; border-radius:3em; color:#888 !important; text-decoration:none!important; }@media (min-width: 768px) {.mobile-top-bar{display:block; }.mobile-top-barli{display:none; }#main-content{max-width:708px; margin:0auto; padding:0; transition: max-width 0.2s ease-in-out; }#side-bar{display:block; position:fixed; top:0; left: -25em; width:17em; height:100%; background-color: rgb(184, 134, 134); overflow-y:auto; z-index:10; padding:1em1em01em; -webkit-transition:left0.5s ease-in-out 0.1s; -moz-transition:left0.5s ease-in-out 0.1s; -ms-transition:left0.5s ease-in-out 0.1s; -o-transition:left0.5s ease-in-out 0.1s; transition:left0.5s ease-in-out 0.1s; }#side-bar:after{content: ""; position:absolute; top:0; width:0; height:100%; background-color: rgba(0, 0, 0, 0.2); }#side-bar:target{display:block; left:0; width:17em; margin:0; border:1pxsolid#dedede; z-index:10; }#side-bar:target + #main-content{left:0; }#side-bar:target.close-menu{display:block; position:fixed; width:100%; height:100%; top:0; left:0; background: rgba(0,0,0,0.3) 1px1pxrepeat; z-index: -1; }}
/*PenumbraTheme[2020WikidotTheme]ByEstrellaYoshteBased on: PaperstackThemebyEstrellaYoshteAdAstraThemebyNatVoltaicandstormbreathInkblotThemebyCroquemboucheAndersonRoboticsThemebyCroquemboucheBHLStyleCollapsiblebyMonkatrazEditedforSCP-JPbyukwhatn*/ @importurl('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&display=swap'); @importurl('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); @importurl(https://fonts.googleapis.com/css2?family=Fira+Code&display=swap); #page-content{font-size:.9rem; }body{font-family: 'Roboto', sans-serif; color:#EDEDED; background-color:#2F333C; background-image: linear-gradient( to bottom, #21252E, #21252E90px, #21252E90px, #2F333C200px, #2F333C200px, #2F333C100%); background-repeat:no-repeat; }#main-content{top: -1.2rem; } /* ---- SCROLLBAR ---- */ ::-webkit-scrollbar{width:9px; background:transparent; } ::-webkit-scrollbar-track{background:#21252E; } ::-webkit-scrollbar-thumb{background:#ededed; border:none; } ::-webkit-scrollbar-thumb:hover{background: var(--accentColor); } /* ---- HEADER ---- */ div#container-wrap{background-image:none; }div#header{background-image:none; }div#extra-div-1{height:164px; width:100%; top:0; position:absolute; background: var(--lgurl); background-size: contain; background-repeat:no-repeat; background-position:50%50%; z-index: -1; }#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: var(--accentColor); 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{color:#ededed; }#login-statusa{color: var(--accentColor); }#login-statusula{color:#ededed; background:#21252E; }#login-statusula:hover{color: var(--accentColor); }#account-topbutton{border:solid1px var(--accentColor); }#footer, #footera{background:transparent; color:#ededed; }#license-area{color:#ededed; }#search-top-box{top:2.2rem!important; right:8px; }#search-top-box-form > input[type=submit]{border:solid1px#ededed; background:#21252E!important; box-shadow:none; border-radius:0; color:#ededed; transition: color 0.15s linear; }#search-top-box-forminput[type=submit]:hover{border:solid1px var(--accentColor); box-shadow:none; color: var(--accentColor); }#search-top-box-form > input[type=text]{display:none; } /* ---- TOPBAR ---- */ #top-bar{top:8.4rem; display: flex; justify-content:center; right:0; }#top-bar, #top-bara{color:#ededed; transition: color 0s; }#top-barulliul{border-color: var(--accentColor); overflow:hidden; }#top-barulli.sfhoverullia, #top-barulli:hoverullia{border-top-color:#2F333C; }#top-barulli.sfhovera, #top-barulli:hovera{background:#21252E; color:#ededed; }#top-barulli.sfhovera:hover, #top-barulli:hovera:hover{background:#21252E; /*topbarhoverbackgroundcolor*/ color: var(--accentColor); transition: color 0.1s linear; } /* ---- SIDEBAR ---- */ div#side-bar{background:#21252E; clear:both; padding:.8em; border-radius:0; box-shadow:none; overflow-x:hidden; }#side-bar.heading{color:#ededed; font-family: 'Josefin Sans', sans-serif; font-size:0.94rem; border-bottom:solid1px#ededed; }#side-bar.side-block{border:transparent; border-radius:0; box-shadow:none; background-color:#21252E!important; }#side-bar.side-block.media{background-color:#21252E; }#side-bar.side-block.media > *{display: flex; justify-content: space-evenly; }#side-bar.side-block.resources{background-color:#21252E; }.side-block.menu-item > .image{display:none; }#top-bardiv.open-menua{border-radius:0; box-shadow:none; color: var(--accentColor)!important; background-color:#21252E!important; border:solid1px#21252E!important; }@media (max-width: 767px) {#main-content{padding:0; margin:05%; border-left:none; }#page-title{margin-top:0.7em; }#side-bar{background-color:#21252E; left: -21em; }#side-bar:target{border:none; box-shadow:none; }#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:18.6em50%; z-index: -1; opacity:0; pointer-events:none; }#side-bar:target.close-menu{width: calc(100% - 18.6em); right:0; left:auto; opacity:1; pointer-events:auto; }#side-bar:target.close-menu:hover{background: unset; }#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: var(--accentColor); box-shadow:none; }.yui-navset.yui-nava, /* ---- LinkModifier ---- */ .yui-navset.yui-navset-top.yui-nava{color:#ededed; font-weight:bold; /* ---- TabBackgroundColour | [UNSELECTED] ---- */ background-color:#21252E; border: unset; box-shadow:none; box-shadow:none; transition: background-color 0.15s linear; }.yui-navset.yui-nava:hover, .yui-navset.yui-nava:focus{color:#ededed; /* ---- TabBackgroundColour | [HOVER] ---- */ background-color: var(--accentColor); }.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:#ededed; background-color:#21252E; 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: var(--accentColor); }.yui-navset.yui-nav.selecteda, .yui-navset.yui-nav.selectedaem{border:none; }.yui-navset.yui-nav.selecteda{width:100%; color:#21252E; font-weight:bold; }.yui-navset.yui-nav.selecteda:focus, .yui-navset.yui-nav.selecteda:active{color:#21252E; background-color: var(--accentColor); }.yui-navset.yui-content{background-color:#21252E; box-shadow:none; }.yui-navset.yui-content, .yui-navset.yui-navset-top.yui-content{padding:.5em; border:none; } /*---- TABANIMATIONbyCroquembouche ---- */ .yui-navset.yui-content > div{display:block; top:0; overflow:hidden; transform-origin:00; }#page-content.yui-navset.yui-content > div[style*="none"]{display:block !important; flex:0; max-height:0; padding:00.5em; border-width:0; /*ThefollowingtransitionaffectstheonethatDISAPPEARS*/ transition: padding 0s linear 0.5s, border-width 0s linear 0.5s, flex 0.5s cubic-bezier(.18,.51,.54,.9) 0s; animation: tab-disappear 0.5s ease-in-out 0s 1both; }#page-content.yui-navset.yui-content > div[style*="block"]{display:block !important; flex:1; max-height:9999rem; /*ThefollowingtransitionaffectstheonethatAPPEARS*/ transition: padding 0s linear 0.5s, border-width 0s linear 0.5s, flex 0.5s cubic-bezier(.18,.51,.54,.9) 0.5s; animation: tab-appear 0.5s ease-in-out 0.5s 1both; }@keyframestab-disappear{ 0% {max-height:9999rem; } 1% {max-height:100vh; } 100% {max-height:0; }}@keyframestab-appear{ 0% {max-height:0; } 99% {max-height:100vh; } 100% {max-height:9999rem; }} /* ---- INFOBAR ---- */ body{ --barColour:#21252E; --linkColour:#ededed; }.info-container.collapsible-block-content{padding:0.5em30px; }.info-container.collapsible-block-content.wiki-content-table{width:100%; } /*Ayer'sinfo-barpatchbyMonkatraz*/ #page-content.info-container.collapsible-block-folded, #page-content.info-container.collapsible-block-unfolded-link{width:100%; max-width:100%; margin:0auto; padding:0; box-shadow:none; }#page-content.info-container.collapsible-block-link::before, #page-content.info-container.collapsible-block-unfolded-link::before{content: " "; display:none; }#page-content.info-container.collapsible-block-content::after{display:none; } /* ---- INFOPANE ---- */ #page-content.creditRate{margin: unset; margin-top:4px; margin-bottom:4px; margin-right:3px; }#page-content.rate-box-with-credit-button{background-color:#21252E; border:solid2px#21252E; border-radius:0; box-shadow:3px0px0px0px var(--accentColor); }#page-content.rate-box-with-credit-button.creditButtonpa{border-left-color:transparent; }#page-content.rate-box-with-credit-button.page-rate-widget-box.cancel{border-radius:0; }#page-content.rate-box-with-credit-buttondiv.page-rate-widget-box.rate-points{border-left:0; }.rate-box-with-credit-button.page-rate-widget-box.cancela:hover{border-radius:0; }#page-content.rate-box-with-credit-button.fa-info{color:#ededed; }#page-content.rate-box-with-credit-button.fa-info:hover{color: var(--accentColor); }#page-content.creditButtonStandalonepa{background-color:#21252E; border:solid2px#21252E; border-radius:0; box-shadow:3px0px0px0px var(--accentColor); color:#ededed; }#page-content.creditButtonStandalonepa:hover{color: var(--accentColor); }#page-content.modalbox{background:#2F333C !important; color:#ededed; box-shadow:none; }.close-credits, .credit-back{filter: grayscale(100%) invert(100%) contrast(275%); } /* ---- CreditModuleforJP ---- */ #page-content.creditRate.creditModule.rate-box-with-credit-button{background-color:#21252E!important; }#page-content.creditRate.creditModule.rate-box-with-credit-button.creditButton{background-color: unset; border: unset; box-shadow: unset; }#page-content.creditRate.creditModule ~ #u-credit-view.modalbox.modalbox-title{background:#21252e; } /* ---- PAGERATING ---- */ .page-rate-widget-box{margin: unset; border-radius:0; border:solid2px#21252E; box-shadow:3px0px0px0px var(--accentColor); background-color:#21252E; margin-top:4px; margin-bottom:4px; margin-right:3px; }div.page-rate-widget-box.rate-points{background-color:#21252E; border:none; color:#ededed !important; text-transform:capitalize; }.page-rate-widget-box.rateup, .page-rate-widget-box.ratedown{background-color:#21252E; border-top:none; border-bottom:none; }.page-rate-widget-box.rateupa, .page-rate-widget-box.ratedowna{background:transparent; color:#ededed; }.page-rate-widget-box.rateupa:hover, .page-rate-widget-box.ratedowna:hover{background:#21252E; color: var(--accentColor); }.page-rate-widget-box.cancel{background:transparent; background-color:#21252E; border:none; }.page-rate-widget-box.cancela{color:#ededed; }.page-rate-widget-box.cancela:hover{background:#21252E; color: var(--accentColor); } /* ---- PAGEELEMENTS ---- */ .page-source, tt{font-family: "Fira Code", monospace; font-size:0.87rem; }.codepre, .codep, .code{font-family: "Fira Code", monospace; font-size:0.87rem; color:#21252E; }h1{color: var(--accentColor); font-family: 'Josefin Sans', sans-serif; font-weight:bold; }h2, h3, h4, h5, h6{color:#EDEDED; font-family: 'Josefin Sans', sans-serif; font-weight:bold; }#page-title{color:#ededed; font-family: 'Josefin Sans', sans-serif; font-size:1.65rem; text-align:center; border-color:#ededed; } /*Clickylinks*/ a, a.newpage, a:visited, #side-bara:visited{color: var(--accentColor); transition: color 0.15s linear; }a:hover, a.newpage:hover, a:visited:hover, #side-bara:visited:hover{color:#ffffff; text-decoration:none; background-color: var(--accentColor); }a.newpage{filter: hue-rotate(180deg); } /*patchforsidebarmedia, collapsibles, ACS, infobuttonandayersmodulesolinkdoesn'toverride*/ #page-content.collapsible-block-foldeda:hover, #page-content.collapsible-block-unfolded-linka:hover, #page-content.rate-box-with-credit-button.fa-info:hover, #side-bar.side-block.mediaa:hover, .danger-diamonda:hover{background:transparent; }.info-container.collapsible-block-folded.collapsible-block-link, .info-container.collapsible-block-link{background: var(--linkColour) !important; }hr{background-color: var(--accentColor); }blockquote, div.blockquote, #toc{background-color:#21252E; border:solid2px#2F333C; box-shadow: -3px0px0px -0.1px var(--accentColor); }.code{background-color:#F8F8F8; border:solid3px#2F333C; box-shadow:none; }.scp-image-block{border:solid8px#21252E; border-bottom:solid0px#21252E; box-shadow:0px0.26rem 0px0px var(--accentColor); box-sizing: border-box; }.scp-image-block.scp-image-caption{background-color:#21252E; border:solid4px#21252E; color:#ededed; font-size:0.84rem; }.scp-image-block.block-left{margin-left:0; }.scp-image-block.block-right{margin-right:0; }@media (max-width: 540px) {.scp-image-block.block-left, .scp-image-block.block-right{float:none; clear:both; margin-left:auto; margin-right:auto; }}#page-content.wiki-content-tabletrth{border:solid1px var(--accentColor); color: var(--accentColor); background-color:#21252E; /*setborderfortabletitle*/ }#page-content.wiki-content-tabletrtd{border:solid1px var(--accentColor); /*setborderfortablecontent*/ } /*fancycollapsible*/ #page-content.collapsible-block-folded, #page-content.collapsible-block-unfolded-link{background:#21252E; transition:background0.25s linear; padding-top:0.5rem; padding-bottom:0.5rem; padding-left:1rem; padding-right:1rem; width: min-content; white-space:nowrap; overflow:hidden; margin:auto; }#page-content.collapsible-block-folded.collapsible-block-link::before{content: "▷ "; }#page-content.collapsible-block-unfolded.collapsible-block-link::before{content: "▽ "; }#page-content.collapsible-block-link{text-decoration:none; color:#ededed; font-weight:bold; }#page-content.collapsible-block-folded:hover, #page-content.collapsible-block-unfolded-link:hover{background: var(--accentColor); }#page-content.collapsible-block-unfolded-link{box-shadow:0px -0.26rem 0px0px var(--accentColor); }#page-content.collapsible-block-folded, #page-content.collapsible-block-unfolded-link{margin-top:10px; margin-bottom:10px; } /*Selection*/ ::selection{background: var(--accentColor); color:#ffffff; } /*Footnotes*/ .hovertip{font-size:.9rem; background-color:#21252E !important; border:solid1px var(--accentColor) !important; }.footnotes-footer{background-color:#21252E; padding-left:1.4rem; padding-right:1.4rem; padding-bottom:1.5rem; box-shadow: -0.24rem 0px0px0px var(--accentColor); }.footnotes-footer.title{color:#ededed; }.footnote.f-footer, .equation.e-footer, .reference.r-footer{display:none; } /*Tags*/ #main-content.page-tagsa{margin-top:.18rem; }.page-tagsspan{border-top:1pxsolid#ededed; } /*Pop-UpWindows*/ .owindow{background-color:#21252E; border-color: var(--accentColor); }.owindow.modal-header{background-color:#21252E; }.owindow.modal-bodyimg{background-color:transparent !important; }.owindow.title{background-color:#21252E; color: #var(--accentColor); border-bottom:1pxsolid#2F333C; }.owindow.button-bara{background-color:#21252E; border-color: var(--accentColor); color:#ededed; }.owindow.button-bara:hover{background-color: var(--accentColor); } /*EditButtons*/ .buttons.btn{background-color:#21252E; border-color: var(--accentColor); color: var(--accentColor); padding:3px5px; }.buttons.btn:hover{background-color: var(--accentColor); color:#21252E; } /*EditLockInfo*/ #lock-info{background-color:#21252E; border-color:#ededed; } /*CloseButtonforPageSource, Rating, Etc*/ a.action-area-close:hover{background-color:#21252E; } /*Page-HistoryCurrent*/ .pager.current{background-color: var(--accentColor); border-color:#ededed; } /*HistoryCompare*/ .inline-diffins, .inline-diffdel{color:#21252E; } /* ---- INTERWIKI ---- */ .scpnet-interwiki-frame{filter:invert(100%) grayscale(100%) contrast(75%); } /* ---- CUSTOMSYNTAX ---- */ .darkbox{background-color:#21252E; border-left:solid0.26rem var(--accentColor); border-right:solid0.26rem var(--accentColor); padding:.4rem; margin-top:12px; margin-bottom:12px; }.lightbox{background-color:#ededed; color:#21252E; border-left:solid0.26rem var(--accentColor); border-right:solid0.26rem var(--accentColor); padding:.4rem; margin-top:12px; margin-bottom:12px; }.lightboxh2, .lightboxh3, .lightboxh4, .lightboxh5, .lightboxh6{color:#21252E; }.limit{margin-bottom: -1rem; z-index:5; }.anchor{position: sticky; height:0; top:0; z-index:5; }.sidebox{background-color:#21252E; border-top:solid2px var(--accentColor); padding:.14rem; margin-top:0; margin-bottom:8px; width: calc((100vw - 870px)/2); max-height: calc(100vh - 18rem); position:absolute; top:0; left:103.5%; z-index:5; overflow:auto; box-sizing: border-box; } /*Sideboxmobileoptimization, courtesyofWoed*/ @media (max-width: 1290px) {.sidebox{width:auto; max-width:65vw!important; border:none; padding-left:0.4rem; padding-right:0.4rem; top:0.75rem; right: calc(((100vw - 45.8rem)/2) * -1); left: initial; -webkit-clip-path:inset(-0.125rem -0.25rem 0 calc(100% - 0.85rem)); clip-path:inset(-0.125rem -0.25rem 0 calc(100% - 0.85rem)); -webkit-transition: color 0.2s ease-in-out 0.1s, -webkit-box-shadow 0.5s ease-in-out 0.1s, -webkit-clip-path 0.5s ease-in-out 0.1s; transition: color 0.2s ease-in-out 0.1s, -webkit-box-shadow 0.5s ease-in-out 0.1s, -webkit-clip-path 0.5s ease-in-out 0.1s; -o-transition: color 0.2s ease-in-out 0.1s, box-shadow 0.5s ease-in-out 0.1s, clip-path 0.5s ease-in-out 0.1s; transition: color 0.2s ease-in-out 0.1s, box-shadow 0.5s ease-in-out 0.1s, clip-path 0.5s ease-in-out 0.1s; transition: color 0.2s ease-in-out 0.1s, box-shadow 0.5s ease-in-out 0.1s, clip-path 0.5s ease-in-out 0.1s, -webkit-box-shadow 0.5s ease-in-out 0.1s, -webkit-clip-path 0.5s ease-in-out 0.1s; overflow:visible; }.sidebox::before, .sidebox::after{content: " "; position:absolute; right:0; }.sidebox::before{top: calc(50% - 0.75rem); width:0; height:0; border-top:0.75rem solidtransparent; border-bottom:0.75rem solidtransparent; border-right:0.75rem solid var(--accentColor); transition: border 0.1s ease-in-out 0.1s; z-index:10; }.sidebox::after{top:0; max-width:0.75rem; width:100%; height:100%; box-shadow:0.15rem 000 var(--accentColor); max-height: calc(100vh - 18rem); background-color:#21252E; z-index: -1; transition: box-shadow 0.5s ease-in-out 0.1s, max-width 0.5s ease-in-out 0.1s; }.sidebox > *{opacity:0; -webkit-transition: opacity 0.2s ease-in-out 0.2s; -o-transition: opacity 0.2s ease-in-out 0.2s; transition: opacity 0.2s ease-in-out 0.2s; }.sidebox:hover{overflow:visible; -webkit-clip-path:inset(-0.125rem -0.25rem 00); clip-path:inset(-0.125rem -0.25rem 00); -webkit-transition: color 0.5s ease-in-out 0.2s, right0.5s ease-in-out 0.1s, -webkit-clip-path 0.5s ease-in-out 0.1s, -webkit-box-shadow 0.5s ease-in-out 0.1s; transition: color 0.5s ease-in-out 0.2s, right0.5s ease-in-out 0.1s, -webkit-clip-path 0.5s ease-in-out 0.1s, -webkit-box-shadow 0.5s ease-in-out 0.1s; -o-transition: color 0.5s ease-in-out 0.2s, right0.5s ease-in-out 0.1s, clip-path 0.5s ease-in-out 0.1s, box-shadow 0.5s ease-in-out 0.1s; transition: color 0.5s ease-in-out 0.2s, right0.5s ease-in-out 0.1s, clip-path 0.5s ease-in-out 0.1s, box-shadow 0.5s ease-in-out 0.1s; transition: color 0.5s ease-in-out 0.2s, right0.5s ease-in-out 0.1s, clip-path 0.5s ease-in-out 0.1s, box-shadow 0.5s ease-in-out 0.1s, -webkit-clip-path 0.5s ease-in-out 0.1s, -webkit-box-shadow 0.5s ease-in-out 0.1s; }.sidebox:hover::before { border-top: 0solidtransparent; border-bottom:0solidtransparent; }.sidebox:hover::after{box-shadow:0 -0.125rem 00 var(--accentColor); right:0; max-width:100%; }.sidebox:hover > *{opacity:1; } } @media (max-width:768px) {.sidebox, .sidebox:hover{right: calc(((100vw - (100% - 3rem))/2) * -1 + 1.9rem); }}:root{ --accentColor:#1EB5E8; --lgurl: url("http://scp-jp-storage.wdfiles.com/local--files/file%3A3396310-43-tbvr/logo.png"); }