APR版式
评分: +1+x

(也许是)为APR所作。

正在更新中

标题一

标题二

标题三

标题四

标题五
标题六

/* 适配所用 */
.standard-block,
.content-panel {
    border: solid 1px #888880;
    border-radius: 10px;
    background-color: #999990;
    margin: 10px 0 15px;
    box-shadow: 3px 3px 6px #bbb;
    box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.1);
}
 
/* Variants */
:root {
    --background-color: #333;
    --accent-background-color: #222;
    --front-background-color: #444;
    --accent-color: #FFF;
    --frontground-color: #CDCDCD;
    /* ------------ */
    --header-background-color: var(--accent-background-color);
    --topbar-background-color: var(--front-background-color);
    --title-color: var(--front-background-color);
    --link-color: var(--accent-color);
    /* ------------ */
    --standard-shadow: 1px 1px 1px #000;
    /* ------------ */
    --title-fragment-A: "星际异常";
    --title-fragment-B: "管理局";
    --logo-image: url("http://apr-wiki-cn.wikidot.com/local--files/component:theme/LOGO.png");
    --standard-background: transparent, transparent;
}
 
/* Basic */
body {
    background-color: var(--background-color);
    color: var(--frontground-color);
}
 
#edit-page-form * {
    font-family: monospace !important;
}
 
div#container-wrap {
    background-image: linear-gradient(to bottom, var(--accent-background-color) 0, var(--accent-background-color) 100%);
    background-size: 100% 162px;
    background-repeat: repeat-x;
    background-position: top center;
}
 
#header, #top-bar, #top-bar .top-bar, #top-bar .mobile-top-bar {
    width: 100%;
}
 
#header h1 *,
#header h2 * {
    float: none !important;
}
 
#header h1 a span {
    display: none;
}
 
#header h1 a::before {
    content: var(--title-fragment-A);
}
 
#header h1 a::after {
    content: var(--title-fragment-B);
}
 
#header h1 a,
#header h2 span {
    text-shadow: none !important;
    font-family: var(--title-font);
    color: var(--title-color);
}
 
#top-bar ul li {
    padding: 0;
    line-height: 21px;
}
 
#header {
    background-image: linear-gradient(to bottom, var(--standard-background));
    background-position: center top;
    background-repeat: repeat-x;
    background-size: auto 100%;
    background-color: var(--header-background-color);
}
 
#header::after {
    content: "  ";
    display: block;
    width: 100px;
    height: 100px;
    position: absolute;
    left: 0;
    bottom: 1em;
    background-image: var(--logo-image);
    background-repeat: no-repeat;
    background-size: 80px auto;
    z-index: -1;
}
 
#top-bar {
    background-image: linear-gradient(to bottom, var(--topbar-background));
    background-position: center top;
    background-repeat: repeat-x;
    background-size: auto 100%;
    background-color: var(--topbar-background-color);
}
 
#top-bar * {
    float: none !important;
}
 
#top-bar .top-bar, #top-bar .mobile-top-bar {
    width: 100% !important;
    text-align: center !important;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
}
 
#top-bar div > ul {
    width: 100% !important;
    max-width: 800px !important;
    display: flex;
    justify-content: center;
    float: none !important;
}
 
#top-bar div > ul li {
    display: block;
    flex-grow: 1;
}
 
.top-bar ul li:last-of-type ul,
#top-bar ul > li:nth-last-child(1) ul {
    position: absolute;
    right: 0 !important;
}
 
#top-bar ul li ul {
    display: block;
}
 
#top-bar ul li:hover a,
#top-bar ul li.sfhover a,
#top-bar ul li ul li:hover a,
#top-bar ul li ul li.sfhover a {
    background-color: transparent !important;
    border: none !important;
    color: var(--frontground-color) !important;
}
 
#top-bar ul li:hover a:hover,
#top-bar ul li.sfhover a:hover,
#top-bar ul li ul li:hover a:hover,
#top-bar ul li ul li.sfhover a:hover {
    background-color: var(--frontground-color) !important;
    border: none !important;
    color: var(--background-color) !important;
}
 
#top-bar div > ul > li > ul {
    border: solid 1px var(--frontground-color);
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    background-color: var(--accent-background-color);
}
 
#page-title, h1 {
    font-family: var(--title-font);
    color: var(--title-color);
    text-shadow: var(--standard-shadow);
}
 
#top-bar .top-bar {
    display: flex;
    position: relative;
    justify-content: center;
    width: 100vw;
}
 
    #top-bar .mobile-top-bar {
        display: none;
    }
 
#top-bar div > ul {
    max-width: 800px;
    z-index: 1919810 !important;
    margin: 0 auto;
}
 
a, a.newpage {
    color: var(--link-color);
}
 
a:visited {
    color: var(--frontground-color) !important;
}
 
#search-top-box-input,
#search-top-box-form input[type=submit] {
    border-color: var(--front-background-color) !important;
    background-image: var(--search-background);
    background-color: var(--background-color);
    color: var(--accent-color) !important;
    border: solid 1px;
}
 
.page-rate-widget-box *,
.page-rate-widget-box span.rate-points {
    background: none !important;
    border: none !important;
}
 
.page-rate-widget-box {
    border-color: var(--front-background-color) !important;
    background-image: var(--search-background);
    background-color: var(--background-color);
    color: var(--frontground-color) !important;
    border: solid 1px;
    margin-left: 0;
    margin-right: 0;
}
 
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    color: var(--accent-color) !important;
}
 
.page-rate-widget-box .rate-points,
.page-rate-widget-box .cancel a {
    color: var(--frontground-color) !important;
}
 
#side-bar {
    background-color: var(--background-color) !important;
    border: none !important;
}
 
#side-bar .side-block {
    background-color: var(--background-color) !important;
    border: solid 1px var(--front-background-color) !important;
    border-radius: 5px !important;
    box-shadow: var(--standard-shadow) !important;
}
 
#side-bar .heading {
    color: var(--frontground-color);
    border-bottom: solid 1px var(--frontground-color);
    padding-left: 15px;
    margin-bottom: 5px;
    font-size: 8pt;
    font-weight: bold;
}
 
#side-bar .collapsible-block-folded {
    background: none;
}
 
#side-bar .collapsible-block-unfolded-link {
    border-bottom: solid 1px var(--frontground-color);
}
 
#side-bar .collapsible-block-unfolded-link .collapsible-block-link {
    margin-top: 10px;
    margin-bottom: 5px;
    font-size: 8pt;
    color: var(--frontground-color);
}
 
#side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover {
    color: var(--accent-color);
    text-decoration: none;
}
 
#side-bar div.menu-item img {
    opacity: 0;
}
 
.hovertip .content .footnote .f-heading, .hovertip .content .footnote .f-footer  {
    display: none !important;
}
 
.hovertip {
    border: solid 1px var(--accent-color) !important;
    background-color: var(--accent-background-color) !important;
    border-radius: 2px;
}
 
#toc, .toc {
    background-color: var(--background-color) !important;
    border: double 3px var(--front-background-color) !important;
    border-radius: 5px;
}
 
/* YUI Tab */
.yui-navset .yui-content {
    border: solid 3px var(--accent-background-color);
    background-color: var(--accent-background-color);
}
 
.yui-navset .yui-nav .selected {
    background-color: var(--accent-background-color);
    border: none !important;
}
 
.yui-navset .yui-nav li {
    border: solid 1px var(--front-background-color) !important;
}
 
.yui-navset ul {
    border: solid 2px var(--front-background-color) !important;
    background-color: var(--front-background-color) !important;
}
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-nav li {
    margin: 0 !important;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus, /* no focus effect for selected */
.yui-navset .yui-nav .selected a:hover,
.yui-navset .yui-nav a,
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus,
.yui-navset .yui-navset-top .yui-nav a {
    background-image: none !important;
    background: none !important;
 
}
 
.yui-navset li *, .yui-navset .selected * {
    border: none !important;
}
 
.yui-navset li a, .yui-navset .selected a {
    border: none !important;
}
 
.yui-navset li a {
    color: var(--frontground-color) !important;
    background-image: none !important;
    border-bottom: solid 1px transparent !important;
}
 
.yui-navset .yui-nav .selected {
 
}
 
/* Blocks */
 
.float-left {
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
}
 
.float-right {
    float: right;
    margin-left: 1em;
    margin-bottom: 1em;
}
 
.apr-image, .code,
blockquote, div.blockquote {
    background-color: var(--background-color);
    border: solid 1px var(--front-background-color);
    color: var(--frontground-color);
    border-radius: 5px;
}
 
.apr-image {
    padding-top: 1em;
    padding-left: 1em;
    padding-right: 1em;
    width: fit-content;
    width: -moz-fit-content;
    width: -webkit-fit-content;
}
 
.apr-image .image {
    border-radius: 2px;
    border: solid 1px var(--front-background-color);
}
 
.apr-image .apr-image-caption {
    text-align: center;
}
 
.content-panel, .standard-block {
    background-color: var(--accent-background-color);
    border: solid 1px var(--frontground-color);
    border-radius: 5px;
    padding: 1em;
}
 
.standard-block.nopadding {
    padding: 0;
}
 
.standard-block .block-content > p:nth-child(1),
.standard-block.nopadding > p:nth-child(1) {
    margin-top: 0;
}
 
.standard-block .block-content > p:nth-last-child(1),
.standard-block.nopadding > p:nth-last-child(1) {
    margin-bottom: 0;
}
 
.standard-block.nopadding > p {
    margin-left: 0.5em;
    margin-right: 0.5em;
}
 
.block-content {
    margin: 0;
    padding: 1em;
    background-color: var(--front-background-color);
    border-left: solid 1px var(--frontground-color);
    border-right: solid 1px var(--frontground-color);
}
 
.block-content > * > *,
.standard-block.header p, .standard-block.footer p {
    margin: 0 !important;
}
 
.standard-block.header {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}
 
.standard-block.footer {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    margin-top: 0 !important;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}
 
/* MOBILE FIX */
 
#header .open-menu a {
    border-radius: 5px !important;
    border: solid 1px var(--front-background-color) !important;
    background-color: var(--background-color) !important;
    color: var(--front-background-color) !important;
}
 
@media (max-width: 767px) {
    #top-bar .mobile-top-bar {
        display: flex;
    }
    #top-bar .top-bar {
        display: none;
    }
}
CC BY-SA 114514.810