Thème Bureaux SCP version Sigma

EH TOI LÀ !

Cette page est utilisée en interne par le Wiki SCP,

MERCI DE NE PAS MODIFIER CETTE PAGE
SANS LA PERMISSION DU STAFF.


Module de notation :

notation: 0+x

Utilisation

Pour appliquer ce thème sur une page, mettez ceci après le module de crédits :

[[include theme:scp-offices-sigma]]

Veuillez ne pas importer ce thème en utilisant la méthode standard CSS @import : en important le thème via [[include]], votre page sera ajoutée à une liste de liens entrants. Cela permet de voir quelles pages seraient affectées si ce thème était mis à jour et de détecter et corriger bien plus rapidement les erreurs.

Vous pouvez voir les liens entrants d'une page en cliquant sur "+ Options" en bas, puis sur "Liens entrants".


Exemples

scpoffices_logo.svg

Thème SCP Offices

Un trait horizontal peut être créé grâce à 5 traits d'union "-----", il s'étend sur toute la largeur de la page s'il n'est pas placée à l'intérieur de quelque chose (par exemple un bloc de citation). Les lignes séparant les sections de ce document sont des traits horizontaux.

Les titres peuvent être créés en mettant entre un et six plus "+" au début d'une ligne.

Ceci est un onglet.

Ceci est un bloc de citation, il est possible d'en faire en mettant ">" au début de chaque ligne.
Plus de texte


C'est un trait horizontal

Blocs de citation imbriqués

C'est un tableau
Tu devrais déjà savoir
comment les faire

La police monospace utilisée pour le corps de la page, l'en-tête et le titre est IBM Plex Mono.


Code

/*
    Sigma-9 SCP Offices Theme
    [2020 Wikidot Theme]
    By Dr Lekter and DrMacro
    Adapted from BHL SCP Offices Theme by Woedenaz
    Based on SCP Sigma 9 Theme created by Aelanna and Dr Devan
*/
 
@import url('https://fonts.googleapis.com/css?family=Basic|IBM+Plex+Mono:400,700');
 
:root {
    --body-font: 'IBM Plex Mono', monospace;
    --header-font: 'IBM Plex Mono', sans-serif;
    --title-font: 'IBM Plex Mono', monospace;
    --mono-font: "IBM Plex Mono", monospace;
    --white-monochrome: 238, 238, 216;
    --pale-gray-monochrome: 233, 231, 204;
    --light-gray-monochrome: 147, 147, 147;
    --gray-monochrome: 127, 127, 127;
    --dark-gray-monochrome: 101, 101, 101;
    --black-monochrome: 25, 20, 16;
    --bright-accent: 145, 179, 153;
    --medium-accent: 145, 179, 153;
    --dark-accent: 105, 133, 111;
 
    --gradient-header: linear-gradient(0deg,rgb(var(--medium-accent)) 0%,rgb(var(--black-monochrome)) 90%,rgb(var(--black-monochrome)));
    --gradient-sidemenu-header: linear-gradient(10deg, rgba(var(--medium-accent), 0.45), rgba(var(--medium-accent), 0.55));
 
    scrollbar-color: rgba(var(--white-monochrome), 1) rgba(var(--bright-accent), 0.50);
}
 
/* HEADER */
div#container-wrap {
    background-image:
        repeating-linear-gradient(45deg,hsla(0, 0%, 100%, 0),
        hsla(0, 0%, 100%, 0) 0.25vh,
        rgba(88, 88, 88, 0.1) 0.35vh,
        rgba(88, 88, 88, 0.2) 0.5vh),
 
        repeating-linear-gradient(180deg,
        hsla(0, 0%, 100%, 0),
        hsla(0, 0%, 100%, 0) 0.25vh,
        rgba(88, 88, 88, 0.1) 0.35vh,
        rgba(88, 88, 88, 0.2) 0.5vh),
 
        linear-gradient(to bottom,
        rgba(var(--black-monochrome), 1) 8.75rem,
        rgba(var(--light-gray-monochrome), 1) 7.625rem,
        rgba(var(--gray-monochrome), 1) calc(91% - 0.125rem),
        rgba(var(--dark-gray-monochrome), 1) calc(99% - 0.125rem));
 
    background-size: 100% 8.7rem, 100% 8.7rem, 100% 10.08rem;
    background-repeat: no-repeat;
}
 
#header {
    background: url(http://fondationscp.wdfiles.com/local--files/theme%3Ascp-offices-sigma/scpoffices_logo.svg) 13px 41px no-repeat;
    background-size: 94px 94px;
}
 
#header h1 a {
    font-size: 150%;
    color: rgb(var(--white-monochrome));
    font-family: var(--title-font);
    font-weight: 900;
    text-shadow: .063rem .063rem .063rem #0c0c0c;
    letter-spacing: -.02em;
    line-height: 0;
}
 
#header h2 span {
    color: rgb(var(--bright-accent));
    font-family: var(--title-font);
    text-shadow: .063rem .063rem .063rem #0c0c0c;
    font-weight: 400;
    line-height: 0;
    font-size: .945rem;
}
 
@media (max-width: 767px) {
    #header {
        background: url(http://fondationscp.wdfiles.com/local--files/theme%3Ascp-offices-sigma/scpoffices_logo.svg) 2px 72px no-repeat;
        background-size: 50px 50px;
    }
    #header h1 a {
        font-size: 80%;
    }
    #header h2 span {
        font-size: .700rem;
    }
}
 
/* LOG-IN INFO */
#login-status {
    color: rgb(var(--white-monochrome));
}
#login-status a {
    color: rgb(var(--white-monochrome));
}
 
#login-status ul a {
    color: rgb(var(--bright-accent));
    background: rgb(var(--white-monochrome));
}
 
#login-status ul a:hover {
   color: rgb(var(--dark-accent));
   font-weight: bold;
}
 
/* SEARCH BAR */
#search-top-box-input {
    background-color: rgb(var(--gray-monochrome));
}
#search-top-box-input:hover, #search-top-box-input:focus {
    border: solid 1px rgb(var(--white-monochrome));
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--light-gray-monochrome));
    box-shadow: inset 1px 1px 3px rgba(0,0,0,.8);
}
#search-top-box-form input[type=submit] {
    background: rgb(var(--bright-accent));
    color: rgb(var(--white-monochrome));
    transition: background 0.25s;
}
#search-top-box-form input[type=submit]:hover, #search-top-box-form input[type=submit]:focus {
    background: rgb(var(--dark-accent));
    color: rgb(var(--white-monochrome));
}
 
/* TITLE */ 
#page-title {
    font-size: 210%;
    font-family: 'IMB Plex Mono';
    font-weight: 600;
}
 
h1, h2, h3, h4, h5, h6, #page-title {
    font-family: var(--title-font);
    color: rgb(var(--black-monochrome));
}
h1 {
    margin: .7em 0 .6em;
    padding: 0 0 .25em;
    font-weight: 700;
}
h2, h3, h4, h5, h6 {
    margin: .5em 0 .4em;
    padding: 0;
    font-weight: 900;
    letter-spacing: .063rem;
}
 
@media (max-width: 767px) {
    #page-title {
        font-size: 180%
    }
}
 
/* TOP-BAR SETTINGS */
#top-bar ul li ul {
    border: 0px;
}
#top-bar ul li.sfhover ul li a,
#top-bar ul li:hover ul li a {
    border-top: 1px solid transparent;
    padding: 0.3em;
    padding-left: 0.5em;
    color: rgb(var(--white-monochrome));
}
#top-bar ul li a {
    color: rgb(var(--white-monochrome));
}
#top-bar ul li.sfhover a,
#top-bar ul li:hover a {
    background: rgb(var(--dark-gray-monochrome));
    color: rgb(var(--white-monochrome));
}
#top-bar ul li ul a, #top-bar a:hover {
    color: rgb(var(--pale-grey-monochrome));
}
#top-bar ul li.sfhover a:hover,
#top-bar ul li:hover a:hover {
    background: rgb(var(--dark-gray-monochrome));
}
#top-bar ul li ul.sfhover a:hover,
#top-bar ul li ul:hover a:hover {
    background: rgb(var(--gray-monochrome));
    color: rgb(var(--white-monochrome));
    font-weight: bold;
}
.c_topbar_arrow {
    color: rgb(var(--white-monochrome));
}
 
/* SIDE-BAR SETTINGS */
#side-bar .side-block {
    border-color: rgb(var(--dark-accent));
    background-color: rgb(var(--white-monochrome));
    box-shadow: 0 2px 6px rgba(var(--dark-accent),.5);
}
 
#side-bar .side-block.media {
    background-color: rgb(var(--pale-gray-monochrome)) !important;
}
 
#side-bar .side-block.resources {
    background-color: rgb(232, 229, 197) !important;
}
 
div.scpnet-interwiki-wrapper {
    filter: hue-rotate(90deg);
}
 
#side-bar .heading {
    color: rgb(var(--dark-accent));
    border-bottom-color: rgb(var(--dark-accent));
}
 
/* SIDE-BAR IMAGES */
.side-block .menu-item > .image {
    filter: hue-rotate(-171deg);
}
 
/* Patch pour hover imbriqué */
#top-bar ul li ul li ul {
    left: 159px;
}
 
/* MOBILE SIDE-BAR */
@media (max-width: 767px) {
#side-bar {
    background-color: rgb(var(--white-monochrome))
}
.open-menu a {
    border: 0.2em solid rgb(var(--bright-accent)) !important;
    background-color: rgb(var(--white-monochrome)) !important;
    color: rgb(var(--bright-accent)) !important;
    }
}
 
/* BODY */
body {
    background-color: rgb(var(--white-monochrome));
    font-family: var( --body-font);
}
 
/* FOOTER */
#footer {
    background: rgb(var(--dark-accent));
}
 
/* OTHER STRUCTURAL ELEMENTS */
 
/* LINKS */
a {
    color: rgb(var(--bright-accent));
    font-weight: bold;
}
a:visited {
    color: rgb(var(--dark-accent));
}
#side-bar a,
#side-bar a:visited,
#side-bar a.newpage {
    color: rgb(var(--dark-accent));
}
 
/* POP-UP WINDOWS */
.owindow {
    background-color: rgb(var(--white-monochrome));
}
 
.owindow .modal-header {
    background-color: rgb(var(--white-monochrome));
}
 
.owindow .modal-body img {
    background-color: transparent !important;
}
 
.owindow .title {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.owindow .button-bar a {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
/* CODE */
.code {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
/* RATING MODULE */
.page-rate-widget-box .rate-points {
    background-color: rgb(var(--dark-accent)) !important;
    border-color: rgb(var(--dark-accent));
    color: rgb(var(--pale-gray-monochrome));
}
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: rgb(var(--pale-gray-monochrome));
    border-top-color: rgb(var(--dark-accent));
    border-bottom-color: rgb(var(--dark-accent));
}
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    background: transparent;
    color: rgb(var(--dark-accent));
}
.page-rate-widget-box .rateup a:hover,
.page-rate-widget-box .ratedown a:hover {
    background: rgb(var(--dark-accent));
    color: rgb(var(--pale-gray-monochrome));
}
.page-rate-widget-box .cancel {
    background: transparent;
    background-color: rgb(var(--dark-accent)) !important;
    border-color: rgb(var(--dark-accent))  !important;
}
.page-rate-widget-box .cancel a {
    color: rgb(var(--bright-accent)) !important;
}
.page-rate-widget-box .cancel a:hover {
    background-color: rgb(var(--dark-accent)) !important;
    color: rgb(var(--pale-gray-monochrome)) !important;
}
 
/* Module de crédit FR */
.rate-box-with-credit-button .creditButton {
    color: rgb(var(--pale-gray-monochrome)) !important;
    background-color: rgb(var(--dark-accent)) !important;
    border-color: rgb(var(--dark-accent)) !important;
}
.creditButton a {
    color: rgb(var(--white-monochrome)) !important;
}
.creditButton a:hover {
    color: rgb(var(--bright-accent)) !important;
}
 
/* PAGE ELEMENTS */
 
/* BLOCKQUOTES */
blockquote,
div.blockquote {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
/* TABLES */
table.wiki-content-table th {
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--light-gray-monochrome));
}
 
/* TABVIEW */
.yui-navset .yui-content {
    background-color: rgb(237, 236, 213);
    font-weight: normal;
}
.yui-navset .yui-nav a, 
.yui-navset .yui-navset-top .yui-nav a {
    background-image: none;
    background-color: rgb(var(--pale-gray-monochrome));
    font-weight: normal;
}
.yui-navset .yui-nav a:hover, 
.yui-navset .yui-nav a:focus {
    background: rgb(var(--dark-accent));
    color: rgb(var(--white-monochrome));
}
.yui-navset .yui-nav .selected a, 
.yui-navset .yui-nav .selected a:focus, /* Pas d'effet focus/hover pour tab sélectionné */
.yui-navset .yui-nav .selected a:hover {
    background-image: none !important;
    background: rgb(var(--bright-accent));
    border-color: rgb(var(--dark-accent));
    color: rgb(var(--white-monochrome));
}
.yui-navset li {
    line-height: normal;
}
 
/* IMAGE BLOCK */
.scp-image-block .scp-image-caption {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
/* ANIMATIONS */
 
#header h1 *,
#page-title * {
    will-change: opacity;
    transition: opacity 0.2s ease-in-out;
}
 
#header h1 a:hover,
#page-title:hover {
    -webkit-animation: flicker 20s linear infinite;
    -moz-animation: flicker 20s linear infinite;
    animation: flicker 20s linear infinite;
}
 
@-webkit-keyframes flicker {
    0% {
        opacity: .2;
    }
 
    5% {
        opacity: .9;
    }
 
    6% {
        opacity: 1;
    }
 
    11% {
        opacity: .4;
    }
 
    11.25% {
        opacity: .6;
    }
 
    11.5% {
        opacity: .4;
    }
 
    18% {
        opacity: 1;
    }
 
    18.5% {
        opacity: .9;
    }
 
    22% {
        opacity: 1;
    }
 
    38.5% {
        opacity: 1;
    }
 
    39% {
        opacity: .8;
    }
 
    42% {
        opacity: 1;
    }
 
    60% {
        opacity: 1;
    }
 
    60.5% {
        opacity: 0;
    }
 
    62% {
        opacity: 0;
    }
 
    63% {
        opacity: .2;
    }
 
    63.25% {
        opacity: 0;
    }
 
    65% {
        opacity: 1;
    }
 
    73% {
        opacity: 1;
    }
 
    75% {
        opacity: .8;
    }
 
    79% {
        opacity: 1;
    }
 
    100% {
        opacity: 1;
    }
}
}
Sauf mention contraire, le contenu de cette page est protégé par la licence Creative Commons Attribution-ShareAlike 3.0 License