Thème alternatif de SAPHIR

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.


Ce thème est une version alternative du thème principal du Groupe d'Intérêt SAPHIR. Pour l'inclure dans vos articles, ajoutez la ligne suivante en tête de votre page :

[[include theme:sapphire]]

Lien non visité (Lien visité)

Premier Titre

Ceci est un onglet.

/*
@import url('https://fonts.googleapis.com/css?family=Tinos&display=swap');
 
/* SAPPHIRE Theme
 * [2019 Wikidot Theme]
 * Based on Aelanna's Sigma-9 Theme as edited by Dr Devan
 * Inspired by DrGemini's SCP-FR Group of Interest "SAPHIR"
 * Created by stormbreath, Lt Flops, and Uncle Nicolini for the 2019 International GOI Contest
 * Logo Design by Ihp sourced from https://pixabay.com/vectors/diamond-cut-polished-jewelry-312696/
 */
 
/* GLOBAL WIDTH */
body {
     background-color: #e5e5e5;
     color: #0c0c0c;
 
     --neutral: #e5e5e5;
     --key: #17181c;
     --sapphire-muted: #151a61;
     --sapphire: #000880;
     --sapphire-mid: #2634f2;
     --sapphire-light: #666999;
     --white-sapphire: #ebebf0;
     --gray-sapphire: #5b5b5d;
     --light: #bbb;
     --mid-light: #999;
     --mid: #9b9ca1;
     --mid-dark: #666;
     --dark: #333;
     --grad-1: #5b5b5b;
     --grad-2: #878787;
 
    /* 1 Common */
    --ct_col_link: var(--sapphire);
    --ct_col_link-visited: var(--sapphire-muted);
    --ct_col_link-newpage: var(--sapphire-muted);
}
div#container-wrap {
    background-image: url(http://scp-wiki.wdfiles.com/local--files/theme%3Asapphire/sapphire-body-bg.png);
}
 
/* COMMON */
 h1, 
 #page-title {
     color: #151a61;
     color: var(--sapphire-muted);
}
 h1 {
     margin-top: 0;
     padding: 0;
     font-weight: bold;
}
 #page-title {
     border-color: #0d0e26;
}
 
a.newpage {
     font-weight: bold;
}
a.collapsible-block-link {
     font-weight: bold;
}
 hr{
     display: block;
     background: #0d0e26;
     border: 0;
     padding: 0;
     margin: 1em 0;
     height: 1px;
}
 
/* HEADER */
 #header {
     background: none;
}
 #header h1 {
     background: url(http://scp-wiki.wdfiles.com/local--files/theme%3Asapphire/sapphire-header.png) no-repeat; /* Logo modified by Ihp under CC BY-SA 3.0 */
     background-size: contain;
     display: block;
     height: 139px;
     max-height: 139px;
     width: 100%;
     max-width: 271px;
     position: relative;
     top: 32px;
}
 #header h1 a {
     display: block;
     margin: 0;
     padding: 0;
     height: 139px;
     max-height: 139px;
     width: 100%;
     max-width: 271px;
}
 #header h2 {
     display: none;
}
 #search-top-box-input {
     border: solid 1px #e5e5e5;
     border: solid 1px var(--neutral);
     color: #2634f2;
     color: var(--sapphire-mid);
     background-color: #17181c;
     background-color: var(--key);
}
 #search-top-box-input:hover, 
 #search-top-box-input:focus {
     border: solid 1px #ebebf0;
     border: solid 1px var(--white-sapphire);
     color: white;
     background-color: #5b5b5d;
     background-color: var(--gray-sapphire);
}
 #search-top-box-form input[type=submit] {
     border: solid 1px #e5e5e5;
     border: solid 1px var(--neutral);
     color: #e5e5e5;
     color: var(--neutral);
     background-color: #333;
     background-color: var(--dark);  
     background: linear-gradient(to bottom, #878787, #5b5b5b, #333);     
     background: linear-gradient(to bottom, var(--grad-2), var(--grad-1), var(--dark));
}
 #search-top-box-form input[type=submit]:hover, 
 #search-top-box-form input[type=submit]:focus {
     border: solid 1px white;
     color: white;
     text-shadow: 0 0 1px rgba(255,255,255,.25);
     background-color: #9b9ca1;
     background-color: var(--mid);
     background: linear-gradient(to bottom, #e5e5e5, #878787, #5b5b5b);
     background: linear-gradient(to bottom, var(--neutral), var(--grad-2), var(--grad-1));
}
 #login-status {
     color: #e5e5e5;
     color: var(--neutral);
}
 #login-status a {
     color: #e5e5e5;
     color: var(--neutral);
}
 #login-status ul a {
     color: #000880;
     color: var(--sapphire);
}
 #account-topbutton {
     background: #bbb;
     background: var(--light);
     color: #000880;
     color: var(--sapphire);
}
 
/* ADJUST MOBILE IMAGE SIZE */
 #header h1 {
     padding: 0;
     float: left;
     max-height: 95px;
}
 @media (max-width: 479px) {
     #header {
         background-size: 150px 75px;
         background-position: 1em;
    }
}
 @media (min-width: 480px) and (max-width: 580px) {
     #header {
         background-size: 180px 90px;
         background-position: 1em;
    }
}
 @media (min-width: 581px) and (max-width: 767px) {
     #header {
         background-size: 210px 105px;
         background-position: 1em;
    }
}
 @media (min-width: 768px) and (max-width: 979px) {
     #header {
         background-size: 240px 120px;
         background-position: 1em;
    }
}
 @media (max-width: 979px) and (min-width: 768px) {
     #header {
         background-size: auto 88px;
    }
}
 @media (max-width: 767px) and (min-width: 581px) {
     #header {
         background-size: auto 77px;
    }
}
 @media (max-width: 580px) and (min-width: 480px) {
     #header {
         background-size: auto 66px;
    }
}
 @media (max-width: 479px) {
     #header {
         background-size: auto 65px;
    }
}
 
/* HIDE THE HEADER TEXT */
 #header h1 a {
     color: transparent;
     text-shadow: none;
}
 #header h2 span {
     color: transparent;
     text-shadow: none;
}
 
/* TOP MENU */
 #top-bar a {
     color: #bbb;
     color: var(--light);
}
 #top-bar ul li ul {
     border: solid 1px #666;
     border: solid 1px var(--mid-dark);
     box-shadow: 0 2px 6px rgba(0,0,0,.5);
}
 #top-bar ul li a {
     border-left: solid 1px rgba(64,64,64,.1);
     border-right: solid 1px rgba(64,64,64,.1);
}
 #top-bar ul li.sfhover a, 
 #top-bar ul li:hover a {
     background: #333;
     background: var(--dark);
     color: #e5e5e5;
     color: var(--neutral);
     border-left: solid 1px rgba(64,64,64,1);
     border-right: solid 1px rgba(64,64,64,1);
}
 #top-bar ul li.sfhover ul li a, 
 #top-bar ul li:hover ul li a {
     border-top: 1px solid #333;
     border-top: 1px solid var(--dark);
}
 #top-bar ul li.sfhover a:hover, 
 #top-bar ul li:hover a:hover {
     background: #999;
     background: var(--mid-light);
}
 #top-bar ul li ul a, 
 #top-bar a:hover {
     color: #e5e5e5;
     color: var(--neutral);
}
.topbar_arrow {color:var(--neutral)}
 
/* SIDE MENU */
 .menu-item > .image {
     filter: hue-rotate(236deg) saturate(50%) brightness(111%) !important;
     -webkit-filter: hue-rotate(236deg) saturate(50%) brightness(111%) !important;
}
 #side-bar .side-block {
     border: 1px solid #333;
     border: 1px solid var(--dark);
     background: #e5e5e5;
     background: var(--neutral);
     border-radius: 0px;
     box-shadow: 0 2px 6px rgba(102,102,102,.5);
}
 #side-bar .heading {
     color: #333;
     color: var(--dark);
     border-bottom: solid 1px #000880;
     border-bottom: solid 1px var(--sapphire);
}
 #side-bar p {
     margin: 0;
}
 #side-bar div.menu-item {
     margin: 2px 0;
}
 #side-bar .collapsible-block-folded {
     background: url(http://scp-wiki.wdfiles.com/local--files/theme%3Asapphire/sapphire-expand.png) 0 2px no-repeat;
}
 #side-bar .collapsible-block-unfolded-link {
     border-bottom: solid 1px #333;
     border-bottom: solid 1px var(--dark);
}
 #side-bar .collapsible-block-unfolded-link .collapsible-block-link {
     color: #333;
     color: var(--dark);
}
 #side-bar .collapsible-block-unfolded-link .collapsible-block-link:hover {
     color: #666;
     color: var(--mid-dark);
}
 #side-bar .floating-ad img {
     border-radius: 0px;
     filter: hue-rotate(236deg) saturate(50%) brightness(111%);
     -webkit-filter: hue-rotate(236deg) saturate(50%) brightness(111%);
}
 
/* SIDEBAR CHANGES PER NAV UPDATE */
 #side-bar .side-block[style="background-color: #fff0f0;"] {
     background-color: #E5E5E5 !important;
     background-color: var(--neutral) !important;
}
 #side-bar .side-block[style="background-color: #e5e5ff;"] {
     background-color: #E5E5E5 !important;
     background-color: var(--neutral) !important;
}
 
/* YUI-TABS */
 .yui-navset .yui-content {
     background-color: #e5e5e5;
     background-color: var(--neutral);
}
 .yui-navset .yui-nav a, 
 .yui-navset .yui-navset-top .yui-nav a {
     background-color: #333;
     background-color: var(--dark);
}
 .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 { /* NO HOVER EFFECT FOR SELECTED */
     background: #333;
     background: var(--dark); /* SELECTED TAB BACKGROUND */
     color: white;
}
 .yui-navset .yui-nav a:hover, 
 .yui-navset .yui-nav a:focus {
     background: #bbb;
     background: var(--light);
     text-decoration: none;
}
 .yui-navset .yui-nav, 
 .yui-navset .yui-navset-top .yui-nav {
     border-color: #333;
     border-color: var(--dark);
}
 .yui-navset li {
     line-height: normal;
}
 
/* AYERS' INFO MODULE */
 :root {
     --cutColour: #050505;
     --barColour: #151A61;
}
 
/* INFO PANE */
 .rate-box-with-credit-button {
     background-color: #151a61 !important; 
     background-color: var(--sapphire-muted) !important;
     border: 1px solid #151a61 !important;
     border: 1px solid var(--sapphire-muted) !important;
     border-radius: 0 !important;
     box-shadow: 1px 1px 3px rgba(0,0,0,.5) !important;
}
 .rate-box-with-credit-button .creditButton p a {
     border-left-color: #666999 !important;
     border-left-color: var(--sapphire-light);
}
 .rate-box-with-credit-button .page-rate-widget-box .cancel {
     border-radius: 0;
}
 .rate-box-with-credit-button .fa-info:hover {
     color: #666999 !important;
     color: var(--sapphire-light) !important;
}
 .rate-box-with-credit-button .page-rate-widget-box .rate-points {
     border-left: 0;
}
 .close-credits {
     filter: hue-rotate(236deg);
}
 .modalbox {
     box-shadow: 0 1px 10px rgba(39,51,221,.3) !important;
}
 
/* RATING MODULE */
 .page-rate-widget-box .rate-points {
     background-color: #151a61 !important;
     background-color: var(--sapphire-muted) !important;
     border: solid 1px #151a61;
     border: solid 1px var(--sapphire-muted);
     border-radius: 0;
}
 .page-rate-widget-box .rateup, 
 .page-rate-widget-box .ratedown {
     background-color: #e5e5e5;
     background-color: var(--neutral);
     border-top: solid 1px #151a61;
     border-top: solid 1px var(--sapphire-muted);
     border-bottom: solid 1px #151a61;
     border-bottom: solid 1px var(--sapphire-muted);
     font-weight: bold;
}
 .page-rate-widget-box .rateup a, 
 .page-rate-widget-box .ratedown a {
     background: none;
     color: #151a61;
     color: var(--sapphire-muted);
     padding: 0 4px;
     margin: 0 1px;
}
 .page-rate-widget-box .rateup a:hover, 
 .page-rate-widget-box .ratedown a:hover {
     background: #151a61;
     background: var(--sapphire-muted);
     color: white;
     text-decoration: none;
}
 .page-rate-widget-box .cancel {
     background-color: #151a61;
     background-color: var(--sapphire-muted);
     border: solid 1px  #151a61;
     border: solid 1px var(--sapphire-muted);
     border-left: 0;
     border-radius: 0;
}
 .page-rate-widget-box .cancel a {
     background: transparent;
     color: #666999;
     color: var(--sapphire-light);
}
 .page-rate-widget-box .cancel a:hover {
     border-radius: 0;
     background: #151a61;
     background: var(--sapphire-muted);
     color: white;
     text-decoration: none;
}
 @media (max-width: 767px) {
     .open-menu a {
         border: 0.2em solid #999 !important;
         border: 0.2em solid var(--mid-light) !important;
         background-color: white !important;
     color: #999 !important;
         color: var(--mid-light) !important;
    }
     #side-bar {
         background-color: #666999;
         background-color: var(--sapphire-light);
    }
}
 
/*INTERWIKI */
 .scpnet-interwiki-frame {
     filter: hue-rotate(236deg) saturate(50%) brightness(111%);
}
 
/* SAPPHIRE FORMAT */
 .sapphire-block {
     border: 5px solid #0d0e26;
     background-color: #abafed;
     padding: 0 1em;
     margin: 1em 0;
 
     color: #222;
     font-family: 'Tinos', serif;
     font-size: 12.5pt;
     text-align: justify;
     word-break: unset;
}
 .sapphire-block hr {
     background-color: #0d0e26;
     border: none;
     margin: auto;
     height: 2px;
     width: 100%;
}
 .sapphire-lite-hr hr {
     background-color: #0d0e26;
     border: none;
     margin: auto;
     height: 2px;
     width: 45%;
}
 div.sapphire-excerpt {
     border: 1px solid #0d0e26;
     background-color: #dedfed;
     padding: 0 1em;
     margin: 1em 2em;
}
 .sapphire-heading-2,
 .sapphire-heading-3,
 .sapphire-heading-4 {
     color: #151a61;
     color: var(--sapphire-muted);
     font-weight: bold;
     word-break: unset;
     line-height: 120%;
}
 .sapphire-heading-2 { font-size: 150%; }
 .sapphire-heading-3 { font-size: 130%; }
 .sapphire-heading-4 { font-size: 120%; }
 
/* MOBILE VIEW */
 @media (max-width: 479px) {
     div.sapphire-excerpt {
         margin: 1em 0;
    }
}
 @media (min-width: 480px) and (max-width: 580px) {
     div.sapphire-excerpt {
         margin: 0.5em;
    }
}
Sauf mention contraire, le contenu de cette page est protégé par la licence Creative Commons Attribution-ShareAlike 3.0 License