War On All Fronts Theme (Sigma-9)

Rating:

rating: +18+x

Rating w/ Info Pane:

This is a theme for the War on All Fronts Canon. An equivalent version for the Black Highlighter base theme can be found HERE. To use this theme on an article, paste the following into your page:

[[include theme:war-on-all-fronts-sigma]]

Header

Header Level 2

Header Level 3

Unvisited Link (Visited Link)

This theme has a special horizontal rule (seen below) that users can use, which can be used with the following code:

[[div_ class="woaf-hr"]]
[[/div]]
/* ---------------------------------
War on All Fronts (Sigma-9)
2020 Wikidot Theme
Created by stormbreath
Header image created by EstrellaYoshte
--------------------------------- */
 
/* -------------- ROOT -------------- */
@import url('https://fonts.googleapis.com/css?family=Saira+Stencil+One&display=swap');
 
:root {
   --deepsea: linear-gradient(to bottom,
       rgb(0,0,101),
       rgb(23,0,82),
       rgb(0,0,0))
}
 
/* -------------- HEADER -------------- */
div#container-wrap {
    background: none;
}
 
div#extra-div-1 {
    height: 140px;
    width: 100%;
    top: 0;
    position: absolute;
    background-color: rgb(23,0,127);
    background-image: var(--deepsea);
}
 
div#extra-div-2 {
    height: 23px;
    width: 100%;
    top: 140px;
    position: absolute;
    background: linear-gradient(to top,
      rgb(59, 59, 59),      
      rgb(83, 83, 83));
    border-bottom: 2px solid rgba(188, 184, 185, 0.5);
}
 
#header {
    background-image: url("https://scp-wiki.wdfiles.com/local--files/theme%3Awar-on-all-fronts-sigma/mksjrpride.png");
    background-size: 100px 100px;
}
 
#header h1 a {
    color: transparent;
    text-shadow: none;
    font-family: 'Saira Stencil One', cursive;
}
 
#header h1 a::before {
    content: "War on All Fronts";
    color: rgb(173,171,181);
    text-shadow: 3px 3px 5px #000000;
    font-variant: small-caps;
}
 
#header h2 span {
    color: transparent;
    text-shadow: none;
    font-family: 'Saira Stencil One', cursive;
}
#header h2 span::before {
    content: "We're Going To Need a Bigger Boat";
    color: rgb(173,171,181);
    text-shadow: 1px 1px 1px rgba(0,0,0,.8);
    font-variant: small-caps;
}
 
/*-------------- LOG-IN INFO -------------- */
#login-status {
    font-weight: bold;
    color: rgb(173,171,181);
}
 
#login-status a {
    color: white;
}
 
#login-status ul {
    background-color: rgb(23,0,127);
    background-image: var(--deepsea);
}
 
#login-status ul a {
    color: rgb(173,171,181);
    background: transparent;
}
 
#login-status ul a:hover {
   color: white;
}
 
/* -------------- SEARCH-BAR -------------- */
#search-top-box-input {
    background-color: #003;
}
#search-top-box-input:hover,
#search-top-box-input:focus {
    background-color: #336;
}
#search-top-box-form input[type=submit] {
    background-color: #336;
    background: linear-gradient(to bottom, #669, #336, #003);
}
 
#search-top-box-form input[type=submit]:hover,
#search-top-box-form input[type=submit]:focus {
    background-color: #669;
    background: linear-gradient(to bottom, #99c, #669, #336);
}
 
/* -------------- TOP-BAR -------------- */
#top-bar ul li ul {
    background-color: rgb(23,0,127);
    background-image: var(--deepsea);
    border: solid 1px rgb(0,0,102);
}
 
#top-bar ul li:hover a[href="javascript:;"] {
    background: rgb(41,41,41);
}
 
#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
    border-top: 1px solid transparent;
}
 
#top-bar ul li.sfhover a,
#top-bar ul li:hover a {
    background: transparent;
    color: rgb(173,171,181);
}
 
#top-bar ul li ul a {
    color: rgb(173,171,181);
}
 
#top-bar ul li.sfhover a:hover,
#top-bar ul li:hover a:hover {
    background: rgba(195, 200, 220);
    color: #10b;
}
 
/* -------------- BODY -------------- */
body {
    background: linear-gradient(to bottom,
        rgb(200,200,200),
        rgb(245,245,245) 400px
    );
}
 
h1, #page-title {
    color: rgb(44,46,100);
}
 
#page-title {
   border-color: rgb(44,46,100);
   font-family: 'Saira Stencil One', cursive;
   text-align: center;
}
 
::-webkit-scrollbar {
    width: initial;
    height: initial;
}
 
::-webkit-scrollbar-thumb {
    background-color: rgb(175, 175, 175, .7);
    border-radius: 5px;
    border: 1px solid black;
}
 
::-webkit-scrollbar-track {
    background-color: rgb(23,0,127);
    background-image: var(--deepsea);
}
 
::selection {
    background: rgba(35, 35, 180, 0.25);
}
 
/* -------------- SIDE-BAR -------------- */
#side-bar a,
#side-bar a:visited,
#side-bar a.newpage,
#interwiki a,
#interwiki a:visited,
#interwiki a.newpage {
    color: rgb(173,171,181);
}
 
#side-bar .side-block,
#interwiki .side-block {
    background-color: rgb(23,0,127);
    background-image: var(--deepsea);
    border: 1px solid black;
    box-shadow: 0 2px 6px rgba(0,0,102,.5);
    color: white;
}
 
#side-bar .side-block.media,
#side-bar .side-block.resources {
    background-color: rgb(23,0,127);
    background-image: var(--deepsea);
}
 
#side-bar .heading,
#interwiki .heading {
    color: white;
    border-color: white;
}
 
#side-bar .collapsible-block-unfolded-link {
    border-bottom: solid 1px white;
}
 
#side-bar .collapsible-block-unfolded-link .collapsible-block-link {
    color: white;
}
 
#side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover {
    color: rgb(173,171,181);
}
 
#interwiki .menu-item img {
    filter: grayscale(100%) invert(1);
}
 
#interwiki body {
    background-image: none;
}
 
/* -------------- FOOTER -------------- */
#footer {
    background: rgb(23,0,82);
}
 
/* -------------- LINKS -------------- */
a {
    color: rgb(17,0,187);
}
 
a.newpage {
    color: rgb(17,102,221);
}
 
a:visited {
    color: rgb(17,0,153);
}
 
/* -------------- PAGE EDITING OPTIONS -------------- */
.buttons .btn,
#lock-info {
    border-color: rgb(100,100,100);
    background-color: rgb(235,235,235);
}
 
/* -------------- RATING MODULE -------------- */
div.page-rate-widget-box .rate-points {
    background-color: #336;
    border: solid 1px #336;
    text-transform: capitalize;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: #f0f6ff;
    border-top: solid 1px #336;
    border-bottom: solid 1px #336;
}
 
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    color: #336;
}
 
.page-rate-widget-box .rateup a:hover,
.page-rate-widget-box .ratedown a:hover{
    background: #336;
    color: #f0ffff;
}
 
.page-rate-widget-box .cancel {
    background-color: #336;
    border: solid 1px #336;
}
 
.page-rate-widget-box .cancel a {
    color: #669;
}
 
.page-rate-widget-box .cancel a:hover {
    background: #336;
    color: #f0ffff;
}
 
/* Info Module */
#page-content .rate-box-with-credit-button{
    background-color: #336;
    border: solid 1px #336;
}
 
#page-content .creditButton p a {
    border-left-color: #669;
}
 
.close-credits,
.credit-back {
     filter: hue-rotate(260deg)
}
 
#page-content .modalbox {
    box-shadow: 0 2px 6px rgba(0, 0, 100,.5);
    background: linear-gradient(
        rgb(200,200,200) 51px,
        rgb(240,240,240) 51px,
        rgb(240,240,240)) !important;
}
 
.info-container {
    --barColour: #336;
}
 
/* -------------- OTHER ELEMENTS -------------- */
blockquote,
div.blockquote,
.code {
     background: rgb(235, 235, 235);
}
 
table.wiki-content-table th {
    background-color: rgb(225,225,225);
}
 
.scp-image-block {
    border: solid 1px rgb(0,0,102);
    box-shadow: 0 1px 6px rgba(0,0,0,.25);
}
 
.scp-image-block .scp-image-caption {
    background-color: rgb(235,235,235);
    border-top: solid 1px rgb(0,0,102);
}
 
div.woaf-hr {
     height: .3em;
     background: linear-gradient(to right,
         rgb(0,0,0),
         rgb(23,0,82),
         rgb(0,0,101),
         rgb(23,0,82),
         rgb(0,0,0));
     margin: 1em 0;
     border-radius: 5px;
}
 
div.woaf-hr p,
div.woaf-hr ul {
    display: none;
}
 
/* -------------- TABS -------------- */
/* Tab CSS is taken from the Black Highlighter Theme and minified to reduce length. */
.yui-navset .yui-content{background-color:inherit}.yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{background-color:inherit;background-image:inherit}.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{background:inherit;color:inherit}.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{background:inherit;text-decoration:inherit}.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav,.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{border-color:inherit}.yui-navset li{line-height:inherit}.yui-navset *{transition:background-color 80ms cubic-bezier(0.4,0.0,0.2,1),color 80ms cubic-bezier(0.4,0.0,0.2,1)}.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{zoom:unset;display:flex;flex-wrap:wrap;border-color:#19148c;width:calc(100% - 0.125rem);margin:0 auto;border:0;box-shadow:0 calc(0.0625rem * 5) 0 0 #19148c}.yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{zoom:unset;background-image:none;background-color:#f4f4f4;border:unset;color:#0c0c0c}.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{zoom:unset;background-color:#0f0364;color:#fcfcfc}.yui-navset .yui-nav li,.yui-navset .yui-navset-top .yui-nav li{background-color:#f4f4f4;border-color:transparent;max-width:100%;padding:0;margin:0;zoom:unset;display:flex;position:relative;flex-grow:2;box-shadow:0 0 0 .0625rem #19148c}.yui-navset .yui-nav li a,.yui-navset-top .yui-nav li a,.yui-navset-bottom .yui-nav li a{display:flex;vertical-align:bottom;zoom:unset;width:100%;align-items:center;justify-content:center}.yui-navset .yui-nav a em,.yui-navset .yui-navset-top .yui-nav a em{padding:.35em .75em;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.yui-navset .yui-nav li em{border:unset!important}.yui-navset .yui-nav .selected,.yui-navset .yui-navset-top .yui-nav .selected{padding:0;margin:0;flex-grow:2;background-color:#19148c;}.yui-navset .yui-nav .selected a,.yui-navset .yui-nav .selected a em{border:none;border-color:transparent}.yui-navset .yui-nav .selected a{color:#fcfcfc!important;width:100%;background-image:none}.yui-navset .yui-nav .selected a:focus,.yui-navset .yui-nav .selected a:active{background-color:#19148c;color:#fcfcfc}.yui-navset .yui-nav .selected a:hover{cursor:default}.yui-navset .yui-content{background-color:rgb(235,235,235); box-shadow:inset 0 calc(0.0625rem * 5) 0 0 rgba(25,20,140,.75);}.yui-navset .yui-content,.yui-navset .yui-navset-top .yui-content{border-color:#aaa}.yui-navset-left .yui-content{border-left-color:#f4f4f4}
 
/* -------------- MOBILE VIEW -------------- */
@media (max-width: 767px) {
    #side-bar {
         background-color: rgb(23,0,127);
         background-image: var(--deepsea);
     }
 
    #top-bar .open-menu a {
        border: 0.2em solid rgb(0,0,102);
        color: rgb(0,0,102);
        background: rgb(245,245,245);
    }
}
 
@media (max-width: 479px) {
    #header {
        background-size: 55px 55px;
    }
}
 
@media (min-width: 480px) and (max-width: 580px) {
    #header {
        background-size: 66px 66px;
    }
}
 
@media (min-width: 581px) and (max-width: 767px) {
    #header {
        background-size: 77px 77px;
    }
}
 
@media (min-width: 768px) and (max-width: 979px) {
    #header {
        background-size: 88px 88px;
    }
}
Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License