暗色侧边目录

注意

此页为The Parallel Boumdary维基内部所使用的
组件
类型的页面

该页面内容可在其它页面中被使用或引用

这是什么?

本组件是对The Backrooms中文维基站规页面中使用的目录样式进行修改而成的。

如何使用

你只需要在需要的页面中引入如下代码:

[[include :parallel-boundary-wiki.wikidot.com:component:toc
|height={$height}
|width={$width}
]]

默认的,建议的输入高度为220,而宽度为180,但仍可以键入不同值来改变样式。

组件的源代码如下(默认样式):

#toc {
    position: fixed;
    z-index: 20;
    bottom: 1em;
    right: 1em;
    background-color:rgb(var(--gray-monochrome));
    color: rgb(var(--white-monochrome));
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: none;
    padding: 0.5rem;
    opacity: 0.3;
    animation-name: toc-initial-fade;
    animation-duration: 2s;
    transition: opacity 0.3s ease-in-out;
    width: 180px
}
#toc-action-bar {
    display: none;
}
#toc a {
   font-size: 0.8em;
   color: rgb(var(--white-monochrome));
}
#toc-list {
    border: 1px solid rgb(var(--swatch-menubg-medium-color));
    overflow: auto;
    max-height: 220px;
}
#toc:hover {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}
 
@media only screen and (max-width: 768px) {
   #toc {
      position: fixed;
      bottom: 0.5em;
      right: 0.5em;
      opacity: 1;
      animation: none;
   }
 
   #toc-action-bar {
      display: block;
   }
}
 
@keyframes toc-initial-fade {
    0% {
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    75% {
        opacity: 1;
    }
    100% {
        opacity: 0.3;
    }
}