BLANKSTYLE CSS
BLANKSTYLE CSS
Placeholder McD Placeholder McD ,
HarryBlank HarryBlank
Published March 2021
Thank you to stormbreath stormbreath , EstrellaYoshte EstrellaYoshte , and Croquembouche Croquembouche for collectively creating most of the code that is included in this theme.

What Is This?

This is Blankstyle CSS: a visual style created by Placeholder McD Placeholder McD and HarryBlank HarryBlank for use in the latter's articles. It exists so it can be easily updated and applied across a wide range of works. It essentially functions as a Light-theme variant of EstrellaYoshte EstrellaYoshte 's Penumbra Theme, plus several Blank-specific caveats.

It almost certainly will not work with other themes, most of all Black Highlighter. Do not use this unless you know what you're getting into.

How to Use

To use this theme, please copy this syntax onto the top of your page:

[[include :scp-cs:theme:blankstyle]]

Note that this theme includes the following components:

When using this theme in conjunction with the info-rate module, wrap the module in a [[div]] to ensure that the information panel is not delayed by the Fade-In.

This theme borrows code from PeppersGhost PeppersGhost 's Image Block Peppo and EstrellaYoshte which centers base images and image-blocks so that they appear more aesthetically on smaller screens (read: mobile). It also borrows Estrella's genius sidebox technology from the Penumbra Theme, and most of its code is derived from the Paperstack Theme.

To read about some of the additional features of BLANKSTYLE CSS, head to the discussion thread and view the patch notes.

ACS-COLORED TABLES

The following tables with custom-colored header cells can be used by wrapping your table in a div, named "table1" through "table5", respectively.Note that wrapping an scp-image-block in one of these divs will apply the same to its caption. Note, also, that this is a BetterFootnote, and details for its usage can be found at the above link.. These correspond to the 5 basic levels of the ACS Component Bar.

This is a normal table;
it is boring to test
This is a GREEN table;
it is fun to test.
This is a BLUE table;
it, too, is fun to test.
This is a YELLOW table;
it, too, is fun to test.
This is an ORANGE table;
it, too, is fun to test.
This is a RED table;
it's not so fun to test.

The tableb div will also separate cells within its tables.

This is a BROKEN table;
it is quite fun to test!

Harry has been formatting his tables manually for a long, long time. What a nerd.

Source Code

/* source: http://ah-sandbox.wikidot.com/component:collapsible-sidebar-x1*/
 
/*Thisshouldfixtheopen-menubuttoninmobileview*/
#top-bardiv.open-menua{background-size:0 !important;
}#top-bar.open-menua{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.2emsolid#888;
 background-color:#fff;
 border-radius:3em;
 color:#888;
}@media (min-width: 768px) {.mobile-top-bar, #top-bar.open-menu{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!important;
 position:fixed;
 top:0;
 left: -19em;
 width:17em;
 height:100%;
 overflow-y:auto;
 z-index:10;
 padding:0.3em0.675em;
 background-color: rgba(0,0,0,0.1);
 transition:left0.5s ease-in-out;
 }#side-bar:target{display:block;
 left:0;
 width:17em;
 margin:0;
 z-index:10;
 }#side-bar:target.close-menu{display:block;
 position:fixed;
 width:100%;
 height:100%;
 top:0;
 left:0;
 z-index: -1;
 }#top-bar.open-menua:hover {
 text-decoration: none;
 }.close-menu{margin-left:19em;
 opacity:0;
 }
}
/*BLANKSTYLECSS[2021WikidotTheme]ByPlaceholderMcDandHarryBlankBased on:
 PaperstackThemebyEstrellaYoshtePenumbraThemebyEstrellaYoshte*/
@importurl('https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@700&display=swap');
@importurl('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,800;1,800&display=swap');
#page-content{font-size:0.8rem; }#main-content{top: -1.6rem;
 padding:0.2em;
}div#container-wrap{background-image: url(none);
}div#header{background-image: url(none);
}#headerh1, #headerh2{margin-left:0; float:none; text-align:center; }#headerh2{margin-top:0.45rem; }#headerh1span, #headerh2span{font-size:0; display:none;}#headerh1a::before, #headerh2::before{color:#000;
 font-family: 'Montserrat', sans-serif !important;
 text-shadow:none;
}#headerh1a::before{content: var(--header-title, "R\0026 C OBLAST-43");
 font-weight:400;
 font-size:1.4em;
}#headerh2::before{content: var(--header-subtitle, "TADY TO DĚLÁME JINAK");
 font-weight:700;
 font-size:1.3em;
}#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;
}#top-bar{display: flex;
 justify-content:center;
 right:0;
 top:7.9rem;
}#top-bar, #top-bara{color:#333333;
}h1,
h2,
h3,
h4,
h5,
h6{font-family: font-family: 'Montserrat', sans-serif;
 color:#000;
}div#extra-div-1{height:160px;
 width:100%;
 top:0;
 position:absolute;
 background: url('http://scp-cs.wikidot.com/local--files/theme:blankstyle/43Head_B%26W.png');
 background-size: contain;
 background-repeat:no-repeat;
 background-position:50%50%;
 z-index: -1;
}body{background-image: linear-gradient(
 to bottom,
 #e0e0e0, #e0e0e090px,
 #e0e0e090px, #ffffff200px,
 #ffffff200px, #ffffff100%);
 background-repeat:no-repeat;
}:root{
 --timeScale:1.5;
 --timeDelay:1.5s;
 --posX: calc(50% - 358px - 13rem);
}#page-contenttrth{padding:6px;
 border:#0001pxsolid;
}#page-contenttrtd{padding:12px;
 border:#0001pxsolid;
 line-height:1.4;
}#page-content.sideboxtrtd,
#page-content.sideboxtrth{padding:0.35em;
}#side-bar{border-right:1pxsolid#333;
 background:#DDD;
}#side-bar.side-block{border:1pxsolid#333;
 border-radius:0;
 box-shadow:none;
}#top-bardiv.open-menua{border:1pxsolid#333;
 border-radius:0;
 box-shadow:none;
}@media (max-width: 767px) {#side-bar:target{border:1pxblack;
 box-shadow:none;
 }}#side-bar.side-block{border:1pxsolid#333;
 border-radius:0;
 box-shadow:none;
 background-color:#FDF6D7;
}#side-bar.side-block.media{background-color:#D7EFE7;
}#side-bar.side-block.resources{background-color:#F5D8E0;
}#page-content.creditRate{margin: unset;
 margin-bottom:4px;
}#page-content.rate-box-with-credit-button{background-color:#ffffff;
 border:solid1px#000;
 box-shadow:none;
 border-radius:0;
}#page-content.rate-box-with-credit-button.fa-info{border:none;
 color:#FFF;
}#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:none;
 border:solid1px#000;
 margin: unset;
 margin-bottom:4px;
 border-radius:0;
}.page-rate-widget-box.rate-points{background-color:#ffffff !important;
 color:#FFF !important;
 border:none;
 border-radius:0;
}.page-rate-widget-box.rateup,
.page-rate-widget-box.ratedown{background-color:#ffffff;
 border-top:none;
 border-bottom:none;
}.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:none;
 border-radius:0;
}.page-rate-widget-box.cancela{color:#FFF;
}.page-rate-widget-box.cancela:hover{background:#333333;
 color:#ffffff;
 border-radius:0;
}#page-content.rate-box-with-credit-button.page-rate-widget-box{border:none; }.anchor{position: sticky;
 height:0;
 top:0;
}.sidebox{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;
}@media (max-width: 1290px) {.sidebox{display:none;
 visibility:hidden;
 }}.scp-image-block{box-shadow:none;
}
 
/* ---- 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:none;
}.yui-navset.yui-content,
 .yui-navset.yui-navset-top.yui-content{padding:.5em;
 border:1pxsolid#333;
 box-sizing: border-box;
}
 
/*---- SCROLLBAR ----*/
 
::-webkit-scrollbar{width:10px;
}
 
::-webkit-scrollbar-track{background:#FFF;
 border-left:1pxsolid#333;
}
 
::-webkit-scrollbar-thumb{background:#CCC;
 border:#3331pxsolid;
}
 
::-webkit-scrollbar-thumb:hover{background:#EEE;
}
 
/*---- CENTERIMAGESONMOBILEcourtesyofEstrellaYoshteandPeppersGhost ----*/
 
.imagediv{float:right;
 margin:15px}@media (max-width: 540px) {.imagediv{float:none;
 text-align:center;
 margin:auto;
 }}@mediaonlyscreenand (max-width: 600px) {.scp-image-block.block-right{float:none;
 margin:10pxauto;
 }}
 
/*---- ACS-COLOREDTABLEDIVS ----*/
 
#page-content.table1trth,
#page-content.table1.scp-image-block.scp-image-caption{background-color:#D7EFE7;
}#page-content.table2trth,
#page-content.table2.scp-image-block.scp-image-caption{background-color:#D8ECF4;
}#page-content.table3trth,
#page-content.table3.scp-image-block.scp-image-caption{background-color:#FDF6D7;
}#page-content.table4trth,
#page-content.table4.scp-image-block.scp-image-caption{background-color:#FFDABF;
}#page-content.table5trth,
#page-content.table5.scp-image-block.scp-image-caption{background-color:#F5D8E0;
}.tableb.wiki-content-table{border-collapse:separate;
 border-spacing:2px;
}.tableb.scp-image-block{border:none;
}.tableb.scp-image-blockimg{border:#0001pxsolid;
 box-sizing: border-box;
}.tableb.scp-image-block.scp-image-caption{margin-top:2px;
 border:#0001pxsolid;
 box-sizing: border-box;
}.top-left-box > .item{display:none;
}
 
/* ---- WORDSNOLONGERBROKEN, THECROQUEMBOUCHEHASSPOKEN ---- */
span, a{word-break:normal !important }.avatar-hover{display:none !important; }#breadcrumbs, .pseudocrumbs{text-align:center;
 padding-top:10px;
}
 
/* ---- CommonThemeissometimessobroken, isn'tit? ---- */
#top-bar.ct-theme-switch{position:absolute;
 right:13px;
 top: -125px;
}

revize stránky: 20, naposledy editováno: 20 Nov 2021 11:25
Diskuze (0)
Není-li uvedeno jinak, obsah této stránky je pod licencí Creative Commons Attribution-ShareAlike 3.0 License
Klikněte zde pro editaci stránky.
Klikněte zde pro přepnutí na editaci jednotlivých sekcí stránky (jeli to možné). Pokud bude tato funkce dostupná, u nadpisů se zobrazí odkaz pro editaci.
Přidat obsah, aniž by se editovala celá stránka
Podívat se, jak se stránka vyvíjela v minulosti.
Pokud chceš diskutovat o obsahu této stránky, tak je toto ten nejlepší způsob, jak tomu tak učinit.
Zobraz a uprav připnuté soubory k této stránce.
Několik užitečných nástrojů pro správu vašich Stránek.
Změnit název (také URL adresu, dodatečně i kategorii) stránky.
Zobrazení (wiki) zdrojového kódu stránky bez možnosti editace.
Náled/nastavení nadřazené stránky (využito při vytváření cest a struktury stránky).
Notify administrators if there is objectionable content in this page.
Něco nefunguje, jak má? Zjisti, co se s tím dá dělat.
Základní Wikidot.com dokumentace a sekce nápověd.
Podmínky Užití Wikidot.com - co můžeš a nemůžeš dělat apod.
Zásady Ochrany Osobních Údajů Wikidot.com

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