Unforgettable Theme
这是Dr Hormress基于逆模因部设定制作的美学版式。
此版式由 Universe647创作的“勿忘我 版式”衍生而来,当前版本基于
EstrellaYoshte创作的“简远 版式”创作。
使用如下语法引用此版式:
[[include :scp-wiki-cn:theme:unforgettable]]
示例
一张图片。
可通过四个连字符“----”创建水平分割线。若它未被放在其他部件(诸如引用块)中,则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。
标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建,它们带有模糊效果。
一号标题
二号标题
三号标题
四号标题
五号标题
六号标题
此为引用块(Quote block),在一行文字前加上“> ”来创建。
更多文字。
一条分割线。
嵌套引用块。
这是 | 表格 |
---|---|
你应该老早 | 就知道怎么 |
做这个了吧 |
页眉字体为 Raleway / 幼圆。
正文字体为 Noto Sans。
等宽字为 Anonymous Pro。
附加功能
使用[[div class="darkstyle"]]可使其内部的排版元素显示为暗色样式,示例如下:
[[div class="darkstyle"]]
暗色元素
[[/div]]
此为引用块(Quote block),在一行文字前加上“> ”来创建。
更多文字。
一条分割线。
嵌套引用块。
这是 | 表格 |
---|---|
你应该老早 | 就知道怎么 |
做这个了吧 |
版式代码
/* 2021 Wikidot Theme by Dr Hormress & Universe647 based on Simple Yonder Theme by EstrellaYoshte */ /* ========UNFORGETTABLE======== */ @import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;400;500;700&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext'); @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;700&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext'); @import url('https://fonts.googleapis.com/css2?family=Anonymous+Pro:wght@300;400;500;700&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext'); #page-content { font-size: 0.87rem; } body { color: #000; font-family: "Noto Sans", sans-serif; background-color: #FFF; } .code pre, .code p, .code, tt, #edit-page-form * { font-family: "Anonymous Pro", monospace; } .page-source{ font-family: "Anonymous Pro", monospace; } a { color: #AAA; } a:visited { color: #AAA; } a.newpage { color: silver; } h1, h2, h3, h4, h5, h6 { color: #000; font-family: "Raleway", sans-serif; font-weight: bold; filter: blur(0.5px); } #page-title { font-family: "Raleway"; filter: blur(0.5px); color: #000; font-weight: bold; font-size: 2.4em; border: none; } /* ---- HEADER ---- */ div#container-wrap { background-image: linear-gradient(to bottom, #FFF 0, #FFF 148px, #000 151px, #FFF 154px, #FFF 155px); background-size: auto 160px; background-repeat: repeat-x; } #header h1, div#header::before { filter: blur(2px); } #header { background-image: none; } div#header::before { content: ""; position: absolute; top: 0; left: -3px; width: 150px; height: 150px; background-image: linear-gradient(-45deg, transparent, #FFF), url("http://scp-wiki.wdfiles.com/local--files/theme:minimal/minimal.svg"); background-size: 6.7rem, 6.7rem; background-position: 3px 29px, 3px 29px; background-repeat: no-repeat, no-repeat; } @media (max-width: 767px) and (min-width: 480px) { div#header::before { background-size: 5.4rem, 5.4rem; background-position: 0 44px, 0 44px; } } @media (max-width: 479px) { div#header::before { background-size: 4.2rem, 4.2rem; background-position: 0 58px, 0 58px; } } #login-status { filter: drop-shadow(0 0 5px #000); } #login-status, #login-status a { color: #000; font-weight: bold; } #account-topbutton{ border: 0px; } #search-top-box { bottom: 0; } #search-top-box-input, #search-top-box-input:hover, #search-top-box-input:focus, #search-top-box-form input[type=submit], #search-top-box-form input[type=submit]:hover, #search-top-box-form input[type=submit]:focus { border: none; background: #000; box-shadow: 0 0 5px #000; border-radius: 3px; color: #FFF; } #search-top-box input.empty { color: #DDD; } div#header h1 a { font-family: "Raleway", "幼圆", sans-serif; font-weight: bold; color: #000; text-shadow: none; } div#header h1 a::before { content: "逆模因部"; } div#header h1 a span { display: none; } div#header h2 span { font-family: "Raleway", "黑体", sans-serif; font-weight: bold; color: #000; padding: 17px 0; text-shadow: none; white-space: pre; filter: blur(1px); } #top-bar div > ul { background-color: #000; box-shadow: 0 0 5px #000; border-radius: 3px; } #top-bar div > ul > li > a { border-radius: 3px; border: solid 2px #000; } #top-bar div > ul > li:hover > a, #top-bar div > ul > li.sfhover > a { color: #000; background-color: #FFF; border: solid 2px #000; box-shadow: inset 0 0 3px #000; } #top-bar div > ul > li > ul { background-color: #000; box-shadow: 0 0 5px #000; border-radius: 3px; border: none; } #top-bar div > ul > li:hover > ul > li > a, #top-bar div > ul > li.sfhover > ul > li > a { background-color: transparent; border: solid 2px #000; color: #FFF; border-radius: 3px; } #top-bar div > ul > li:hover > ul > li > a:hover, #top-bar div > ul > li.sfhover > ul > li > a:hover { background-color: #FFF; color: #000; box-shadow: inset 0 0 3px #000; } /* ---- SIDE BAR ---- */ #top-bar .open-menu a { color: #000; border-radius: 3px; border: solid 2px #000; filter: blur(1px); } #side-bar a, #side-bar a.newpage { color: #000; } #side-bar img { filter: grayscale(100%) blur(0.5px); } #side-bar .collapsible-block-folded { background-image: none; } #side-bar .side-block { box-shadow: inset 0 0 3px #000, 0 0 5px #000; border: solid 2px #000; background-color: #FFF !important; border-radius: 5px; } #side-bar .side-block .heading, #side-bar .collapsible-block-unfolded-link { border: none; filter: drop-shadow(0 0 5px #000); background-image: linear-gradient(to bottom, transparent 0, transparent 5px, #000 8px, transparent 11px, transparent 100%); margin-left: -10px; margin-right: -10px; } #side-bar .side-block .heading p, #side-bar .collapsible-block-unfolded-link .collapsible-block-link, #side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover { display: inline-block; background-color: #000; font-size: 12px; margin-top: 0; padding: 1px; padding-left: 3px; padding-right: 3px; color: #FFF; border-radius: 3px; width: fit-content; width: -webkit-fit-content; width: -moz-fit-content; } @media (max-width: 767px) { #side-bar { background-color: #000; } #side-bar:target { border: none; } } /* ---- YUI TABS ---- */ .yui-navset { border-radius: 5px; box-shadow:none; background-color: transparent; } .yui-navset .yui-nav { border-top-left-radius: 5px; border-top-right-radius: 5px; background-color: transparent; margin: 0; padding: 0; border: none; } .yui-navset .yui-nav .selected a em, .yui-navset .yui-nav a em { padding: 0.25em .75em; top: 0px; margin-bottom: 0px; border: none; } .yui-navset .yui-nav .selected { margin: 0px; } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:hover, .yui-navset .yui-nav .selected a { background-image: none; background-color: #FFF; border: solid 1px transparent; border-radius: 5px; height: 2em; color: #000; box-shadow: inset 0 0 3px #AAA; } .yui-navset .yui-nav a, .yui-navset .yui-navset-top .yui-nav a { background-color: transparent; background-image: none; border: solid 1px transparent; border-radius: 5px; height: 2em; color: #000; box-shadow: none; } .yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus { background-image: none; background-color: transparent; box-shadow: inset 0 0 3px #EEE; } .yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:hover, .yui-navset .yui-nav .selected a, .yui-navset .yui-nav a, .yui-navset .yui-navset-top .yui-nav a { background-image: none; } .yui-navset .yui-nav a { background-image: none; } .yui-navset .yui-nav li { margin: 0px; padding: 0px; background-image: none; } .yui-navset .yui-content { border: solid 1px transparent; border-radius: 5px; box-shadow: inset 0 0 3px #AAA; background-color: #FFF; } .darkstyle .yui-navset { border-radius: 5px; box-shadow: 0 0 5px #000; background-color: #000; } .darkstyle .yui-navset .yui-nav { border-top-left-radius: 5px; border-top-right-radius: 5px; background-color: #000; margin: 0; padding: 0; border: none; } .darkstyle .yui-navset .yui-nav .selected a em, .darkstyle .yui-navset .yui-nav a em { padding: 0.25em .75em; top: 0px; margin-bottom: 0px; border: none; } .darkstyle .yui-navset .yui-nav .selected { margin: 0px; } .darkstyle .yui-navset .yui-nav .selected a, .darkstyle .yui-navset .yui-nav .selected a:focus, .darkstyle .yui-navset .yui-nav .selected a:hover, .darkstyle .yui-navset .yui-nav .selected a { background-image: none; background-color: #FFF; border: solid 2px #000; border-radius: 5px; height: 2em; color: #000; box-shadow: inset 0 0 3px #000; } .darkstyle .yui-navset .yui-nav a, .darkstyle .yui-navset .yui-navset-top .yui-nav a { background-color: #000; background-image: none; border: solid 2px #000; border-radius: 5px; height: 2em; color: #FFF; box-shadow: inset 0 0 3px #000; } .darkstyle .yui-navset .yui-nav a:hover, .darkstyle .yui-navset .yui-nav a:focus { background-image: none; background-color: #444; } .darkstyle .yui-navset .yui-nav .selected a, .darkstyle .yui-navset .yui-nav .selected a:focus, .darkstyle .yui-navset .yui-nav .selected a:hover, .darkstyle .yui-navset .yui-nav .selected a, .darkstyle .yui-navset .yui-nav a, .darkstyle .yui-navset .yui-navset-top .yui-nav a { background-image: none; } .darkstyle .yui-navset .yui-nav a { background-image: none; } .darkstyle .yui-navset .yui-nav li { margin: 0px; padding: 0px; background-image: none; } .darkstyle .yui-navset .yui-content { border: solid 2px #000; border-radius: 5px; box-shadow: inset 0 0 3px #000; background-color: #FFF; } /* ---- INFO PANE ---- */ #page-content .creditRate{ margin: unset; margin-bottom: 8px; } #page-content .rate-box-with-credit-button { background-color: transparent; border: solid 1px #FFF; box-shadow: inset 0 0 3px #DDD; border-radius: 3px; } #page-content .rate-box-with-credit-button .fa-info { border: none; color: #000; } #page-content .rate-box-with-credit-button .fa-info:hover { background: transparent; color: #000; } .rate-box-with-credit-button .cancel { border: solid 1px #FFF; } #page-content .creditButtonStandalone p a { background: #000; } #page-content .creditButtonStandalone p a:hover { background: #000; } #page-content .modalbox { border-radius: 3px; box-shadow: 0 0 5px #000; } #page-content .darkstyle .creditRate{ margin: unset; margin-bottom: 8px; } #page-content .darkstyle .rate-box-with-credit-button { background-color: #000; border: none; box-shadow: 0 0 5px #000; border-radius: 3px; } #page-content .darkstyle .rate-box-with-credit-button .page-rate-widget-box { margin-bottom: 0; box-shadow: none; } #page-content .darkstyle .rate-box-with-credit-button .fa-info { border: none; color: #FFF; } #page-content .darkstyle .rate-box-with-credit-button .fa-info:hover { background: transparent; color: #FFF; } .darkstyle .rate-box-with-credit-button .cancel { border: solid 1px #000; } #page-content .darkstyle .creditButtonStandalone p a { background: #FFF; } #page-content .darkstyle .creditButtonStandalone p a:hover { background: #FFF; } /* ---- PAGE RATING ---- */ .page-rate-widget-box { box-shadow: inset 0 0 3px #DDD; margin: unset; margin-bottom: 8px; padding-bottom: -1px; background-color: transparent; border-radius: 3px; } .page-rate-widget-box .rate-points { background-color: transparent !important; color: #000 !important; border: none; border-radius: 0; } .page-rate-widget-box .rateup, .page-rate-widget-box .ratedown { background-color: transparent; border: none; } .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a { background: transparent; color: #000; } .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .ratedown a:hover { background: transparent; color: #DDD; } .page-rate-widget-box .cancel { background: transparent; background-color: transparent; border: none; border-radius: 0; } .page-rate-widget-box .cancel a { color: #000; border-radius: 0; } .page-rate-widget-box .cancel a:hover { background: transparent; color: #DDD; border-radius: 0; } .darkstyle .page-rate-widget-box { box-shadow: 0 0 5px #000; margin: unset; margin-bottom: 8px; padding-bottom: -1px; background-color: #000; border-radius: 3px; } .darkstyle .page-rate-widget-box .rate-points { background-color: transparent !important; color: #FFF !important; border: none; border-radius: 0; } .darkstyle .page-rate-widget-box .rateup, .darkstyle .page-rate-widget-box .ratedown { background-color: transparent; border: none; } .darkstyle .page-rate-widget-box .rateup a, .darkstyle .page-rate-widget-box .ratedown a { background: transparent; color: #FFF; } .darkstyle .page-rate-widget-box .rateup a:hover, .darkstyle .page-rate-widget-box .ratedown a:hover { background: transparent; color: #DDD; } .darkstyle .page-rate-widget-box .cancel { background: transparent; background-color: transparent; border: none; border-radius: 0; } .darkstyle .page-rate-widget-box .cancel a { color: #FFF; border-radius: 0; } .darkstyle .page-rate-widget-box .cancel a:hover { background: transparent; color: #DDD; border-radius: 0; } /* ---- Horizon Rules ---- */ hr { background-color: #DDD; border: none; box-shadow: 0 0 3px #AAA; } #page-content > hr, #page-content > .list-pages-box > .list-pages-item > hr, #page-content > .darkstyle > hr { margin: 3em -2em 3em -3em; } .darkstyle hr { background-color: #000; height: 2px; box-shadow: 0 0 3px #000; border-radius: 1px; } @media (max-width: 767px) { #page-content > hr, #page-content > .list-pages-box > .list-pages-item > hr { margin: 3em -5.5%; } } /* ---- STANDARD IMAGE BLOCK ---- */ .scp-image-block { border: none; padding: 6px; background-color: #FFF; box-shadow: inset 0 0 3px #DDD; box-sizing: border-box; border-radius: 5px; } .scp-image-block .scp-image-caption { background-color: #FFF; border-top: none; color: #000; } .scp-image-block img { border-radius: 3px; box-shadow: inset 0 0 3px #DDD; background-color: #FFF; } .darkstyle .scp-image-block { border: none; padding: 6px; background-color: #000; box-shadow: 0 0 5px #000; box-sizing: border-box; border-radius: 5px; } .darkstyle .scp-image-block .scp-image-caption { background-color: #000; border-top: none; color: #FFF; } /* ---- QUOTE BLOCK & CODE BLOCK ---- */ blockquote, div.blockquote, .blockquote, .code, #toc { background-color: #FFF; border: solid 1px transparent; border-radius: 5px; box-shadow: inset 0 0 3px #AAA; } .darkstyle blockquote, .darkstyle div.blockquote, .darkstyle .blockquote, .darkstyle .code, .darkstyle #toc { background-color: #FFF; border: solid 2px #000; border-radius: 5px; box-shadow: inset 0 0 3px #000, 0 0 5px #000; } /* ---- WIKI CONTENT TABLE ---- */ #page-content table.wiki-content-table { border-collapse: separate; } #page-content .wiki-content-table th { box-shadow: inset 0 0 3px #AAA; background-color: #EEE; border: solid 1px #FFF; font-family: "Raleway"; border-collapse: separate; } #page-content .wiki-content-table td { box-shadow: inset 0 0 3px #DDD; background-color: #FFF; border: solid 1px #FFF; border-collapse: separate; } #page-content .wiki-content-table tr:nth-child(1) > *:nth-child(1) { border-top-left-radius: 5px; } #page-content .wiki-content-table tr:nth-child(1) > *:nth-last-child(1) { border-top-right-radius: 5px; } #page-content .wiki-content-table tr:nth-last-child(1) > *:nth-child(1) { border-bottom-left-radius: 5px; } #page-content .wiki-content-table tr:nth-last-child(1) > *:nth-last-child(1) { border-bottom-right-radius: 5px; } #page-content .darkstyle table.wiki-content-table { border-collapse: separate; border: solid 1px #000; border-radius: 5px; background-color: #000; box-shadow: 0 0 5px #000; } #page-content .darkstyle .wiki-content-table th { box-shadow: inset 0 0 3px #000; background-color: #000; color: #FFF; border: solid 1px #000; font-family: "Raleway"; border-collapse: separate; } #page-content .darkstyle .wiki-content-table td { box-shadow: inset 0 0 3px #000; background-color: #FFF; border: solid 1px #000; border-collapse: separate; }