网站的版式(Creepypasta Sigma-9)
pwen

注意!
此页面属于组件页面
该页面旨在供其它页面使用,作为功能性或美观性组件
未经组件作者或工作人员允许,请勿修改此页的内容。


注意!版式代码已被移动至GitHub仓库储存,此处代码很可能不再更新,请以GitHub仓库中的代码为准。

Creepypasta版式由SCP维基的The Great HippoThe Great Hippo设计;
Sekai_sSekai_sEtinjatEtinjathoah2333hoah2333为SCP-CN维基翻译和适配;

观谬轻量版版式由SCP维基的Lt FlopsLt Flops设计;
Sekai_sSekai_shoah2333hoah2333SwredSwred为SCP-CN维基翻译和适配;

Chhokmah LuChhokmah Lu为本站作调整。

@import url('https://scp-wiki-cn.wdfiles.com/local--code/component:theme/1');
@import url(https://scp-wiki-cn.wdfiles.com/local--code/theme%3Acreepypasta/1);
@import url(https://scp-wiki-cn.wdfiles.com/local--code/theme%3Aanon/1);
 
@import url("https://parawatch-wiki-cn.wikidot.com/component:admin-verify/code/1");
 
:root{
     --bg-light: hsl(0, 0%, 7%);
     --bg: hsl(210, 6%, 12%);
     --bg-dark: hsl(220, 7%, 17%);
     --bg-light-2: hsl(0, 0%, 11%);
     --fg-light: hsl(140, 3%, 83%);
     --fg: hsl(140, 3%, 78%);
     --fg-dark: hsl(45, 94%,82%);
     --fg-accent-light: hsl(60, 100%, 90%);
     --fg-accent: hsl(60, 100%, 80%);
     --fg-accent-dark: hsl(60, 100%, 75%);
     --fg-accent-dark-2: hsl(60, 53%, 59%);
     --fg-dark-2: hsl(59, 100%, 70%);
 
     --box-bg-dark: #323333dd;
     --box-bg-dark-n: #323333;
     --box-border-d: #444;
     --text-muted: #b3b3b3;
}
 
 div#header h1{
     background: url(http://darry.wikidot.com/local--files/start/parawatch.png) no-repeat;
}
 
/* ==本地修改部分,将版式修改得更加适应全站==*/
 
/* 收起侧边栏按钮*/
#side-bar div.menu-item img{
     filter: hue-rotate(230deg) invert(100%);
}
 
#top-bar .open-menu a {
    position: fixed;
    top: 15px;
    left: 15px;
    z-index: 5;
    font-family: inherit;
    font-size: 24px;
    font-weight: bold;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid var(--box-border-d);
    background-color: var(--box-bg-dark);
    border-radius: 4px;
    color: var(--fg-dark);
 
    pointer-events: auto;
    text-decoration: none;
    transition: all 0.3s ease;
}
 
#top-bar .open-menu a:hover {
    border-color: var(--fg-accent-dark-2);
    color: var(--fg-accent-dark-2);
}
 
/* 论坛与讨论串*/
.thread-container .post .head, 
.thread-container .post.folded .short {
    background: var(--box-bg-dark-n);
    box-shadow: none;
    border-radius: 4px;
    border-left: solid 0.25rem var(--fg-accent-dark-2);
    overflow-wrap: break-word;
}
 
.thread-container .post .long .head .options {
    float: right;
    margin: 0rem 0rem -1.2rem 0rem;
    padding: 0;
}
 
.forum-category-box .description-block,
.forum-thread-box .description-block {
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
    box-shadow: none !important;
    border: 1px solid var(--box-border-d);
    border-left: solid 0.4rem var(--fg-accent-dark-2);
    border-right: solid 0.4rem var(--fg-accent-dark-2);
    margin: 1em 4em;
    background-color: var(--box-bg-dark);
    overflow: hidden;
    height: 100%;
}
 
div.new-post a {
    border: 1px solid var(--box-border-d);
    background-color: var(--box-bg-dark);
    padding: 0.35rem 0.75rem;
    font-size: 100%;
    font-weight: bold;
    transition: all 0.3s ease;
}
 
div.new-post a:hover {
    border-color: var(--fg-accent-dark-2);
    color: var(--fg-accent-dark-2);
}
 
.forum-category-box table th,
.forum-start-box table th {
    background-color: rgba(0, 0, 0, 0.3);
    color: var(--fg-accent-dark-2);
    border: 1px solid var(--box-border-d);
    padding: 0.3rem 0.5rem;
    font-weight: bold;
    text-align: left;
}
 
.forum-category-box table td,
.forum-start-box table td {
    border: 1px solid var(--box-border-d);
    padding: 0.3rem 0.5rem;
    word-break: break-word;
    color: var(--text-muted);
    transition: background-color 0.2s ease;
}
 
.forum-category-box table tr.head td,
.forum-start-box table tr.head td{
    background-color: var(--box-bg-dark-n);
    color: var(--fg-accent-dark-2);
    padding: 0.45rem 0.5rem;
    font-weight: bold;
    overflow-wrap: break-word;
}
 
.forum-category-box table,
.forum-start-box table {
    width: 100%;
    table-layout: fixed;
}
 
.forum-category-box table td,
.forum-start-box table td {
    word-break: break-word;
    overflow-wrap: anywhere;
}
 
.forum-category-box table tr:not(.head):hover td,
.forum-start-box table tr:not(.head):hover td {
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--fg-dark);
}
 
 /* 暴力CSS这一块() */
@media (max-width: 768px) { 
   .forum-category-box .description-block, 
   .forum-thread-box .description-block { 
       margin: 0.5rem 1rem;
    } 
    .forum-category-box table td, 
    .forum-start-box table td { 
         padding: 0.1rem 0.1rem; 
    }
}
/* ==本地原创部分==*/
 
.info-box {
  box-sizing: border-box;
  flex: 0 0 calc(50% - 10px);
  background-color: var(--box-bg-dark);
  border: none;
  border-radius: 4px;
  padding: 6px 8px;
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%);
}
 
@media (max-width: 768px) {
  .info-box {
    flex: 0 0 100%;
  }
}
 
.decorated-title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 1.1em;
  font-weight: bold;
  color: var(--fg-dark);
  margin-top: 0;
  margin-bottom: 0.25rem;
  font-family: inherit;
}
 
.decorated-title::before,
.decorated-title::after {
  content: "";
  display: block;
  height: 2px;
  flex-grow: 1;
  max-width: auto;
  background-color:var(--fg-dark);
}
 
.list-box {
  position: relative;
  padding: 2px 4px 2px 5px;
  margin: 10px 5px;
  background-color: rgba(0, 0, 0, 0.15);
  border-radius: 0 4px 4px 0;
  border-left: 2px solid var(--fg-accent-dark-2);
}
 
.signature {
    display: block !important;
}
除非特别注明,本页内容采用以下授权方式: Creative Commons Attribution-ShareAlike 3.0 License