
略图(FIIC标志)
这是什么?
双峰档案版式是一个基于黑色标记笔的暗色版式,与90年代电视剧系列《双峰》和《X档案》的美学风格稍有关联。你在任何文章都可以用上这个版式……不过最好是用在老派的、与超自然及刑侦相关的政府部门上。或者如果你很喜欢《双峰》和《X档案》的话,那就用吧。
主题颜色

非常规罪案调查基金会(FIIC)宽式标志
注意:这是一个基于黑色标记笔的主题版式。若你想使用此版式,你还需要导入黑色标记笔版式。点击这里了解更多。
在你的作品开头添加如下语法以应用此版式:
[[include :scp-wiki-cn:theme:black-highlighter-theme]]
[[include :scp-wiki-cn:theme:twin-files]]
示例
可通过五个连字符“-----”创建水平分割线。若它未被放在其他部件(诸如引用块)中,则会左右延伸贯穿页面。这种将文件分割为多个部分的线就是分割线。
标题可通过在一行字起始处输入 1 至 6 个加号“+”来创建
发挥想象力,假装这里有一堆示例文字吧。
看,这有更多文字。
多么精巧绝伦。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
这是一个长的 tab,它有很多文字。
因为我被分到了X档案,就想让我按照Scully、Mulder的方法想事情吗?你们找错人了——我需要铁证,不要奇思妙想。——Doggett探员
这是一个引用块,在一行字的起始处加上“> ”来创建。
更多文字
一条分割线
嵌套引用块
以及更多1
这是 | 表格 |
---|---|
你应该老早 | 就知道怎么 |
做这个了吧 |
更多层叠元素
马尼拉纸档案
使用headblock-tabs与headblock divs
09.22-95

双峰档案版式是一个基于黑色标记笔的亮色版式,与90年代电视剧系列《双峰》和《X档案》的美学风格稍有关联。你在任何文章都可以用上这个版式……不过最好是用于表现冷漠的、人口过多的,而又科技高度发达的氛围。或者如果你很喜欢《银翼杀手》的话,那就用吧。
打印纸
使用genblock div
双峰档案版式是一个基于黑色标记笔的亮色版式,与90年代电视剧系列《双峰》和《X档案》的美学风格稍有关联。你在任何文章都可以用上这个版式……不过最好是用于表现冷漠的、人口过多的,而又科技高度发达的氛围。或者如果你很喜欢《银翼杀手》的话,那就用吧。
电传纸
使用ticker div
双峰档案版式是一个基于黑色标记笔的亮色版式,与90年代电视剧系列《双峰》和《X档案》的美学风格稍有关联。你在任何文章都可以用上这个版式……不过最好是用于表现冷漠的、人口过多的,而又科技高度发达的氛围。或者如果你很喜欢《银翼杀手》的话,那就用吧。
WIN95窗口
使用windows-bar与windows divs以及windows-box、windows-slimbox与windows-button spans
FIIC电邮
(F)邮件 (I)收件箱
至: zhangsanlisi@shashashawang
玛丽亚——首先,祝贺新婚。其次,我对这些事情深感抱歉。原本好好的蜜月度假,变成了要去处理一大摊乱子。委员会那帮闲得蛋疼的家伙肯定在逐个找人谈话吧——已经找过我了——毕竟他们在那条停运的航线上结结实实地丢了几吨钱,再加上丁队那边最近也没反应。他们甚至连派调查队都不行,因为助理副监还在那边呢,所以就转过身来搞我们了。他们想要我们根本不知道的答案。
视频记录
使用logs与logs-header divs以及dialog与active classes
视频记录
> 记录开始 <
在此描述视觉动作。 你也喜欢视觉动作吧? |
|
讲话人 | 这就是我的演讲。挺长的。 |
附加引用块
使用blockquote-alt div
文字放这里
放这里也行
便签纸
使用post-it-note div
我们今天找到他了。
他在热水器里,烫成了一滩浆糊。
所用字体
正常情况下我是会一一列出的,但这次有十四种不同的字体2,所以嘛……
代码
/* Twin Files Theme [2022 Wikidot Theme] by JackalRelated edited by vxeov */ @import url('https://scp-wiki.wdfiles.com/local--files/theme:twin-files/stylesheet-alt.css'); @import url('https://fonts.googleapis.com/css2?family=Jost&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Rubik&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Archivo&display=swap'); @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Sedgwick+Ave&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Arimo&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Ma+Shan+Zheng&display=swap'); @import url(https://fastly.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-VonwaonBitmap-12px.css); @import url(https://fastly.jsdelivr.net/gh/Crimone/typefaces@main/YRDZST/subsets/YRDZST.css); :root { --theme-base: "black-highlighter"; --theme-id: "twin-files"; --theme-name: "Twin Files"; --logo-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/fiic-logo-wash.png"); --header-title: "FIIC"; --header-subtitle: " "; --body-font: 'Jost', 'Noto Sans SC', sans-serif; --header-font: 'Rubik', sans-serif; --title-font: 'Archivo', 'Noto Sans SC', sans-serif; --mono-font: 'IBM Plex Mono', 'Noto Serif SC', monospace; --UI-font: var(--printer-paper-font); --manila-tabs-font: 'Telegraphem', 'Ma Shan Zheng', monospace; --manila-body-font: 'Remington Noiseless', 'Ma Shan Zheng', serif; --blockquote-alt-font: var(--printer-paper-font); --ticker-font: 'Nouveau IBM', 'VonwaonBitmap 12px', monospace; --printer-paper-font: 'Alte Haas Grotesk', 'Noto Sans SC', sans-serif; --handwriting-font: 'Sedgwick Ave', 'YRDZST', cursive; --windows-font: 'Modern DOS 8x16', 'VonwaonBitmap 12px', sans-serif; --logs-header-font: 'Commodore 64 Angled', 'VonwaonBitmap 12px', sans-serif; --logs-text-font: 'BabelSans', 'Noto Sans SC', sans-serif; --logs-dialogue-font: 'Arimo', 'Noto Sans SC', sans-serif; --logs-action-font: 'MoonGloss Display', 'Noto Sans SC', sans-serif; --header-height-on-desktop: 11.5rem; --header-height-on-mobile: 11.5rem; /* WHITE - GREY */ --win-white: 255, 255, 255; --win-grey: 195, 195, 195; --win-lborder: 237, 237, 237; --win-border: 207, 207, 207; --printer-paper: 245, 242, 235; --believe-white: 215, 216, 217; --grey-child: 205, 206, 208; --papers-edge: 176, 176, 176; --another-grey: 196, 196, 196; --filing-cabinet: 193, 197, 201; --white-lodge: 159, 160, 161; --one-more-grey: 99, 99, 99; --dark-track: 40, 42, 46; --faded-type: 28, 28, 28; --ink-blot: 10, 10, 10; /* BLUE */ --dept-blue: 2, 4, 20; --saucer-steel: 19, 21, 26; --believe-grey: 25, 29, 43; --einhander-gun: 78, 82, 92; --fiic-blue: 16, 20, 105; --fiic-grey: 119, 125, 140; --cooper: 98, 112, 140; --mulder: 69, 84, 115; --skinner: 41, 51, 91; --scully: 34, 40, 54; /* BROWN */ --manila-folder: 217, 201, 160; --manila-body: 224, 213, 186; --manila-edge: 189, 169, 124; --coffee-ring: 71, 39, 5; --dead-wood: 43, 35, 25; --light-desk: 26, 24, 21; --dark-desk: 13, 12, 11; --reyes: 224, 219, 195; --doggett: 140, 119, 98; /* GREEN */ --peaks-green: 0, 145, 9; /* YELLOW */ --highlighter: 214, 184, 36; --post-it: 230, 223, 131; /* RED */ --red-room: 163, 0, 0; /* THEME ASSIGNMENTS */ --white-monochrome: var(--filing-cabinet); --pale-gray-monochrome: var(--reyes); --light-gray-monochrome: var(--manila-edge); --gray-monochrome: var(--ink-blot); --dark-gray-monochrome: var(--filing-cabinet); --black-monochrome: var(--printer-paper); --pale-accent: var(--cooper); --bright-accent: var(--doggett); --medium-accent: var(--scully); --dark-accent: var(--mulder); --swatch-topmenu-bg-color: var(--einhander-gun); --swatch-topmenu-border-color: var(--einhander-gun); --swatch-text-light: var(--believe-white); --swatch-text-dark: var(--ink-blot); --swatch-text-general: var(--swatch-text-light); --swatch-menubg-color: var(--filing-cabinet); --swatch-menubg-medium-color: var(--papers-edge); --swatch-menubg-medium-dark-color: var(--ink-blot); --swatch-menutxt-light-color: var(--believe-white); --swatch-menutxt-dark-color: var(--ink-blot); --swatch-menutxt-general-color: var(--swatch-menutxt-dark-color); --swatch-text-secondary-color: var(--ink-blot); --swatch-text-tertiary-color: var(--believe-white); --swatch-important-text: var(--bright-accent); --swatch-background: var(--dark-desk); --header-gradient-color-top: var(--saucer-steel); --header-gradient-color-middle: var(--believe-grey); --header-gradient-color-bottom: var(--saucer-steel); --background-gradient-distance: 0rem; --diagonal-stripes: linear-gradient(transparent 0); --sidebar-transition-timing: 0.8s ease-in-out 0.1s; --hover-link-color: var(--highlighter); --newpage-color: var(--manila-folder); --link-color: var(--manila-folder); --visited-link-color: var(--grey-child); --rating-module-bg-color: var(--einhander-gun); --rating-module-button-plus-color: var(--peaks-green); --rating-module-button-cancel-color: var(--scully); --rating-module-bottom-border-color: var(--scully); --rating-module-text-hover-color: var(--swatch-text-tertiary-color); --toggle-button-bg: rgba(var(--ink-blot), 0); --toggle-border-color: rgb(var(--printer-paper)); --toggle-icon-color: rgb(var(--believe-white)); --toggle-roundness: 0%; --ui-button-bg: var(--another-grey); --ui-button-txt: var(--ink-blot); --ui-button-hover-bg: var(--skinner); --ui-button-hover-outline: var(--scully); --ui-button-hover-txt: var(--printer-paper); } #main-content { --ui-icon-color: var(--dead-wood); --ui-icon-bg: var(--papers-edge); --ui-icon-hover-color: var(--printer-paper); --ui-icon-hover-bg: var(--skinner); } #header { --swatch-headerh1-color: var(--win-white); --swatch-headerh2-color: var(--printer-paper); --search-icon-color: var(--filing-cabinet); --search-icon-hover-color: var(--believe-white); --search-icon-hover-bg-color: var(--skinner); --search-textbox-text-color: 0,0,0,0; --login-mobile-icon-color: var(--filing-cabinet); --login-mobile-icon-hover-color: var(--believe-white); --login-mobile-icon-hover-bg-color: var(--skinner); --search-icon-focus-color: var(--win-white); --search-icon-focus-bg-color: var(--fiic-blue); --search-focus-outline-color: var(--win-grey); --search-focus-textbox-bg-color: var(--win-white); --search-focus-textbox-text-color: var(--printer-paper); --login-line-divider-color: var(--mulder); --login-username-color: var(--filing-cabinet); --login-myaccount-color: var(--filing-cabinet); --login-myaccount-underline-color: var(--mulder); --login-myaccount-hover-color: var(--believe-white); --login-myaccount-hover-bg-color: var(--skinner); --login-arrow-color: var(--filing-cabinet); --login-dropdown-bg-color: var(--papers-edge); --login-dropdown-bg-image: var(--papers-edge); --login-dropdown-border-color: var(--win-border), 0.5; --login-dropdown-text-color: var(--faded-type); --login-dropdown-text-hover-color: var(--printer-paper); --login-dropdown-bg-hover-color: var(--skinner); } /* HEADER AND TOPBAR */ #header h1 a { text-shadow: none; height: 100%; width: 150%; color: transparent; background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/fiic-logo.png"); margin: 0; margin-left: 3.3em; padding: 0; background-size: auto calc(var(--header-height-on-desktop) - 1rem); background-repeat: no-repeat; background-position: left center; } @media only screen and (max-width: 56.25rem) { #header { background-size: calc(var(--size) - 2rem), 100% var(--header-height-on-mobile); background-position: calc(var(--header-height-on-mobile) - 0 - var(--size)) calc(((var(--size)*-1) + var(--header-height-on-mobile) + var(--y-offset))/2); } #header h1 a { background-size: contain; position: relative; width: min(10em,65vw); margin-left: 7.25em; } } #header h1 a::before { text-shadow: none; color: transparent; } #header h2 { display: none; } #extra-div-1 { height: var(--header-height-on-desktop); width: 100%; position: absolute; top: 0; left: 0; pointer-events: none; background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/grid-bog.png"); background-size: calc(var(--header-height-on-desktop) * 0.5); mix-blend-mode: overlay; opacity: 0.2; } #top-bar { --topmenu-category-color: var(--filing-cabinet); --topmenu-category-hover-color: var(--printer-paper); --topmenu-hover-border-color: var(--cooper); --mobile-topmenu-sidebar-button-color: var(--printer-paper); --dropdown-bg-color: var(--papers-edge); --dropdown-border-color: var(--win-border); --dropdown-links-color: var(--faded-type); --dropdown-links-hover-color: var(---printer-paper); --dropdown-links-hover-bg-color: var(--skinner); } /* BREADCRUMBS */ #breadcrumbs a:hover, .pseudocrumbs a:hover, #breadcrumbs a:active, .pseudocrumbs a:active, #breadcrumbs a:focus-within, .pseudocrumbs a:focus-within { color: rgb(var(--win-white)); text-decoration: none; } /* SCROLLBAR AND SIDEBAR */ html,body { scrollbar-color: rgb(var(--dark-track)) rgb(var(--fiic-grey)); } html::-webkit-scrollbar, body::-webkit-scrollbar { width: 18px; background: #transparent; } html::-webkit-scrollbar-track, body::-webkit-scrollbar-track { background: rgb(var(--dark-track)); } html::-webkit-scrollbar-thumb, body::-webkit-scrollbar-thumb { background: rgb(var(--fiic-grey)); border: rgb(var(--fiic-grey)) 1px solid; border-radius: 0px; } html::-webkit-scrollbar-thumb:hover, body::-webkit-scrollbar-thumb:hover { background: rgb(var(--papers-edge)); } #side-bar { --sidebar-bg-color: var(--white-lodge); --sidebar-resources-bg-color: var(--win-border), 0.25; --sidebar-media-bg-color: var(--win-border), 0.25; --sideblock-heading-border-color: var(--fiic-blue); --sideblock-heading-bg-color: var(--fiic-blue); --sideblock-heading-text-color: var(--printer-paper); --sidebar-border-color: var(--dark-track), 0.08; --sidebar-subtest-color: var(--swatch-primary); --sidebar-links-text: var(--faded-type); --sidebar-links-hover-bg-color: var(--skinner); --sidebar-links-hover-text-color: var(--believe-white); } #side-bar .heading p, #side-bar .side-block>.collapsible-block .collapsible-block-link { font-size: 0.9em; letter-spacing: .1em; font-family: var(--logs-text-font); margin-bottom: 0.25rem; } @media only screen and (max-width: 56.25rem) { #side-bar .heading p, #side-bar .side-block>.collapsible-block .collapsible-block-link { margin-bottom: 0.3rem; } } hr { background-color: rgb(var(--filing-cabinet)); border-top: .0625rem solid rgb(var(--filing-cabinet)); } .code { background-color: rgb(var(--another-grey)); } blockquote, div.blockquote { border: .0625rem dashed rgba(var(--scully),1); color: rgb(var(--faded-type)); --hover-link-color: var(--cooper); --newpage-color: var(--scully); --link-color: var(--scully); --visited-link-color: var(--ink-blot); } .blockquote p a, .blockquote p sup a, .logs, .windows { --hover-link-color: var(--cooper); --newpage-color: var(--scully); --link-color: var(--scully); --visited-link-color: var(--ink-blot); } blockquote hr, div.blockquote hr { background-color: rgb(var(--faded-type)); border-top: .0625rem solid rgb(var(--faded-type)); } .scp-image-block { box-shadow: none; border: none; } .scp-image-block .scp-image-caption { border-top: .0625rem outset rgba(var(--win-border),1); background-color: rgb(var(--skinner)); color: rgb(var(--printer-paper)); font-family: var(--printer-paper-font); } /* MAIN CONTENT */ .yui-navset .yui-nav a:hover, .yui-navset .yui-nav a:focus { filter: hue-rotate(0deg); } .yui-navset .yui-content, .yui-navset .yui-navset-top .yui-content { color: rgb(var(--ink-blot)); } #main-content { --tabs-bg: var(--manila-folder); --tabs-txt: var(--ink-blot); --tabs-hover-bg: var(--manila-edge); --tabs-hover-txt: var(--dead-wood); --tabs-selected-bg: var(--manila-edge); --tabs-selected-txt: var(--ink-blot); --tabs-selected-outline: var(--manila-edge); --tabs-bottom-border-color: var(--manila-edge); --tabs-content-bg-color: var(--manila-body); --tabs-content-border-color: var(--manila-edge); --tables-header-bg: var(--fiic-blue); --tables-header-txt: var(--printer-paper); --tables-border: var(--win-border); --tables-body-txt: var(--ink-blot); --tables-body-bg: var(--white-lodge); --toc-directory-lines-color: var(--neon-blue); --toc-header-bg-color: var(--passive-blue); --toc-header-text-color: var(--lapd-badge); --toc-header-text-hover-color: var(--neon-blue); --toc-body-bg-color: var(--pkd-blaster); --toc-body-link-color: var(--tears-n-rain); --toc-body-link-hover-color: var(--neon-blue); --toc-body-hover-arrow-color: var(--neon-blue); --blockquote-bg-color: var(--win-border), 0.8; --blockquote-colorbar-color: var(--fiic-blue), 1; --footnotes-footer-colorbar-color: var(--doggett); --footnotes-footer-title-bg-color: var(--doggett); --footnotes-footer-title-text-color: var(--ink-blot); --footnotes-footer-bg-color: var(--manila-body); --footnotes-footer-num-color: var(--doggett); --footnotes-footer-num-hover-color: var(--dark-desk); --footnotes-footer-text-color: var(--faded-type); --pagetags-title-bg: var(--skinner); --pagetags-title-text: var(--believe-white); --pagetags-text-color: var(--filing-cabinet); --pagetags-text-hover-color: var(--dark-desk); --pagetags-text-hover-bg-color: var(--highlighter); } #page-content div.b-tables table.wiki-content-table th, #page-content table.wiki-content-table th { font-family: var(--UI-font); } :root { --hoverblock-header-bg: var(--doggett); --hoverblock-header-txt: var(--ink-blot); --hoverblock-footer-txt: var(--dark-desk); --hoverblock-bg: var(--manila-body); --hoverblock-txt: var(--faded-type); --modal-bg: var(--white-lodge); --modal-body-text: var(--ink-blot); --modal-body-header-txt: var(--red-room); --modal-header-bg: var(--skinner); --modal-header-stripe: var(--fiic-blue); --modal-header-txt: var(--printer-paper); } /* FOOTERS AND BELOW */ .page-source { background: rgb(var(--win-grey)); color: rgb(var(--ink-blot)); --hover-link-color: var(--coffee-ring); --newpage-color: var(--dead-wood); --link-color: var(--dead-wood); --visited-link-color: var(--light-desk); } #footer { --footer-bg-color: var(--einhander-gun); --footer-text-color: var(--filing-cabinet); --footer-link-color: var(--filing-cabinet); --footer-link-hover-color: var(--believe-white); --footer-link-hover-bg-color: var(--cooper); } .bibitems .title, .footnotes-footer .title { font-family: var(--manila-body-font); } .footnotes-footer .footnote-footer { font-family: var(--UI-font); } #license-area { --license-bg-color: var(--dark-desk); --license-text-color: var(--believe-white); --license-link-color: var(--printer-paper); --license-link-hover-color: var(--ink-blot); --license-link-hover-bg-color: var(--highlighter); } form#edit-page-form .wd-editor-toolbar-panel { background-color: rgb(var(--win-grey)); } /* TOGGLE SIDEBAR (BHL) CHANGES */ @supports((display: -ms-grid) or (display: grid)) { @media only screen and (min-width: 769px) { #main-content::before { background: rgba(var(--saucer-steel), .55) 1px 1px repeat; } } } /* CUSTOM DIVS */ .headblock-tabs { background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/manila-top.png"); background-repeat: no-repeat; background-position: left center; background-size: 100%; height: 3em; color: rgb(var(--faded-type)); font-family: var(--manila-tabs-font); font-weight: bold; font-size: 0.8em; padding: 1em 0 0 1em; margin: 0em; } @supports((display: -ms-grid) or (display: grid)) { @media only screen and (max-width: 769px) { .headblock-tabs { background-size: 250%; height: 1.9rem; font-size: 1em; padding: 1.5rem 0 0 1rem; } .headblock-tabs p{ margin: 0em; } } } .headblock { background-color: rgb(var(--manila-folder)); background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/manila-texture.png"); background-repeat: repeat; background-size: 100%; background-blend-mode: multiply; border: 2px solid white; border-color: rgb(var(--manila-edge)); color: rgb(var(--faded-type)); font-family: var(--manila-body-font); font-weight: 400; font-size: 1.1em; text-shadow: 0px 0 1px rgba(var(--faded-type), 0.5); padding: 1em 0.5em 1em 1em; } .headblock p { margin: 0em; } .genblock { background-color: rgb(var(--printer-paper)); background-image: url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/paper-texture.png"); background-repeat: repeat; background-size: 100%; color: rgb(var(--ink-blot)); font-family: var(--printer-paper-font); border: 1px solid white; border-color: rgb(var(--papers-edge)); padding: 1.5em 1em 1.5em 1em; } .ticker { padding: 10px 5px 1.1em 3.7em; font-family: var(--ticker-font); font-size: 110%; font-weight: 400; color: #000; background: repeat-y url("https://scp-wiki.wdfiles.com/local--files/theme:twin-files/tickerback.png"); background-position: center top; background-size: 100%; border: 2px solid #D8D6CA; border-style: dashed solid dashed; border-width: medium 2px 0px; } .windows p, .windows-box p, .windows-slimbox p, .windows-button p, .windows-bar p { margin: 0em; } .windows-bar { background-color: rgb(var(--fiic-blue)); color: rgb(var(--printer-paper)); font-family: var(--windows-font); font-size: 16px; border: 3px outset rgb(207, 207, 207); border-bottom: 0px; margin: 0em; padding: 0.25em 0px 0px 0.5em; } .windows { background-color: rgb(var(--win-grey)); color: rgb(var(--faded-type)); font-family: var(--windows-font); font-size: 16px; border: 3px outset rgb(var(--win-border)); border-top: 0px; padding: 0.3em 0.75em 0.2em 0.75em; } .windows hr { height: 0.125rem; margin: 0.3em 0px; border-top: 0px; background-color: rgb(var(--white-lodge)); } .windows-box { background-color: rgb(var(--win-white)); border: 3px inset rgb(var(--win-lborder)); padding: 0.5em; margin: 0.3em 0px 0.3em 0px; } .windows-slimbox { background-color: rgb(var(--win-white)); border: 2px inset rgb(var(--win-lborder)); color: rgb(var(--ink-blot)); padding: 0.15em; } .windows-button { background-color: rgb(var(--win-grey)); border: 3px outset rgb(var(--win-border)); padding: 0.3em; } .logs p, .logs-header p, table.dialog p { margin: 0em; } .logs { padding: 0px 0px 0.5em 0px; margin: auto; width: 95%; background-color: rgb(var(--win-grey)); border: 3px outset rgb(var(--win-border)); color: rgb(var(--one-more-grey)); font-family: var(--logs-text-font); } .logs-header { padding: 0.5em 0px 0.5em 0px; text-align: center; font-size: 1.5em; background-color: rgb(var(--skinner)); color: rgb(var(--believe-white)); font-family: var(--logs-header-font); } .logs hr { background-color: rgb(var(--ink-blot)); } table.dialog { border-collapse: collapse; font-family: var(--logs-text-font); } table.dialog th { border-right: 1px solid rgb(var(--ink-blot)); color: rgb(var(--ink-blot)); padding: 1em 1em 0em 1em; } table.dialog td { padding: 1em 0em 0em 1em; font-family: var(--logs-action-font); } table.dialog td.active { color: rgb(var(--ink-blot)); font-family: var(--logs-dialogue-font); } .blockquote-alt { margin: .5em 1.25rem; padding: .825em 1.25em; border: .0625rem dashed rgba(var(--doggett), 1); background-color: rgba(var(--manila-body), 0.9); color: rgb(var(--dark-desk)); font-weight: 400; font-family: var(--blockquote-alt-font); --hover-link-color: var(--coffee-ring); --newpage-color: var(--dead-wood); --link-color: var(--dead-wood); --visited-link-color: var(--light-desk); } .blockquote-alt hr { background-color: rgb(var(--manila-edge)); border-top: .0625rem solid rgb(var(--manila-edge)); } .post-it-note { width: 50%; min-height: 20em; border: 2px solid rgba(var(--highlighter), 0.9); margin: auto; padding: 1em; background-color: rgb(var(--post-it)); color: rgb(var(--ink-blot)); font-family: var(--handwriting-font); font-weight: bold; }
@supports(display: grid) { :root { --sidebar-width-on-desktop: calc((var(--base-font-size) * (14 / 15)) * 19); --body-width-on-desktop: 45.75rem; } @media only screen and (min-width: 769px) { #side-bar .close-menu { display: block; position: fixed; top: 0.5rem; left: 0.5rem; width: 3rem; height: 3rem; opacity: 1; pointer-events: all; z-index: -1; } #side-bar .close-menu img { color: transparent; } #side-bar .close-menu::before, #side-bar .close-menu::after { content: ""; box-sizing: border-box; position: fixed; display: block; top: 0.5rem; left: 0.5rem; width: 3rem; height: 3rem; padding: 0; margin: 0; text-align: center; pointer-events: all; cursor: pointer; transition: opacity var(--sidebar-transition-timing); } #side-bar .close-menu::before { --mask:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Hamburger' x='0' y='0' baseProfile='tiny' overflow='visible' version='1.2' viewBox='0 0 32 32' xml:space='preserve'%3E%3Cpath d='M4 10h24c1.1 0 2-.9 2-2s-.9-2-2-2H4c-1.1 0-2 .9-2 2s.9 2 2 2zm24 4H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2zm0 8H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2z'/%3E%3C/svg%3E"); z-index: -1; background-color: var(--toggle-icon-color, rgb(var(--sidebar-links-text))) !important; -webkit-mask: var(--mask); mask: var(--mask); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: 50% 50%; mask-position: 50% 50%; -webkit-mask-size: 60%; mask-size: 60%; } #side-bar .close-menu::after { z-index: -2; background-color: var(--toggle-button-bg, rgb(var(--sidebar-bg-color))) !important; border-radius: var(--toggle-roundness, 50%); border: var(--toggle-border-color, rgb(var(--sidebar-links-text))) var(--toggle-border-width, 0.25rem) solid; } #side-bar:focus-within .close-menu, #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu { pointer-events: none; } #side-bar:focus-within .close-menu::before, #side-bar:focus-within .close-menu::after { opacity: 0; pointer-events: none; } #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::before, #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::after { opacity: 0; pointer-events: none; } #side-bar { display: block; position: fixed; top: 0; left: calc(var(--sidebar-width-on-desktop)*-1); z-index: 10; transition: left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms; height: 100%; overflow-y: auto; overflow-x: hidden; margin-top: 0; } #side-bar:focus-within { left: 0; } #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover { left: 0; } #side-bar .side-block { margin-top: 1rem; background-color: rgb(0, 0, 0, 0); border-radius: 0; border-left-width: 0px; border-right-width: 0px; } #main-content::before { content: ""; display: block; position: fixed; top: 0; right: 0; z-index: -1; opacity: 0; transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms, width 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms; margin-left: var(--sidebar-width-on-desktop); background: rgba(var(--swatch-menubg-black-color), .3) 1px 1px repeat; padding-right: 0; width: 100%; height: 100vh; pointer-events: none; z-index: 99; } #side-bar:focus-within ~ #main-content::before { width: calc(100% - var(--sidebar-width-on-desktop)); opacity: 1; pointer-events: all; } #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover ~ #main-content::before { width: calc(100% - var(--sidebar-width-on-desktop)); opacity: 1; pointer-events: all; } @supports (-moz-appearance:none) and (background-attachment:local) and (not (-moz-osx-font-smoothing:auto)) { #side-bar { padding: inherit; } } #content-wrap { display: flex; flex-direction: row; width: calc(100vw - (100vw - 100%)); min-height: calc(100vh - calc(var(--final-header-height-on-desktop, 10.125rem))); flex-grow: 2; height: auto; position: relative; margin: 0 auto; max-width: inherit; } #main-content { width: 100%; position: initial; max-height: 100%; padding: 2rem 1rem; width: var(--body-width-on-desktop, 45.75rem); max-width: var(--body-width-on-desktop, 45.75rem); margin: 0 auto; } #page-content { max-width: min(90vw, var(--body-width-on-desktop, 45.75rem)); } @supports (-webkit-hyphens:none) { #side-bar { transition: left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms, padding-right 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms, background-color 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms; padding-right: 0; background-color: rgb(0, 0, 0, 0); pointer-events: all; overflow-x: visible; overflow-y: visible; z-index: 999; } #side-bar::-webkit-scrollbar { opacity: 0; -webkit-transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms; transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms; } #side-bar .close-menu::before { z-index: 999; } #side-bar .close-menu::after { z-index: 998; } #side-bar:hover .close-menu::before, #side-bar:hover .close-menu::after { opacity: 0; } #side-bar:hover { left: 0; background-color: rgba(var(--swatch-menubg-color), 1); padding-right: 0; } #side-bar:hover::-webkit-scrollbar { opacity: 1; } #side-bar:hover~#main-content::before { width: calc(100% - var(--sidebar-width-on-desktop)); opacity: 1; pointer-events: all; } } } }