Difference between revisions of "MediaWiki:Common.css"

From Sapiens Wiki
Jump to navigation Jump to search
Line 1: Line 1:
:root {
    --main-bg-color: #353535;
    --main-font-color: white;
    --main-border-color: #353535;
    --main-font-family: SapiensLight;
    --main-font-size: 1em;
    --link-color: #6AD8FF;
}
/* Import the Sapiens fonts from the offical website */
/* Import the Sapiens fonts from the offical website */
@font-face {
@font-face {
Line 20: Line 29:
/* General properties */
/* General properties */
body, div, span, table, td, th {
body, div, span, table, td, th {
     background-color: #331B0F;
     background-color: var(--main-bg-color);
     color: white;
     color: white;
     border-color: #331B0F;
     border-color: var(--main-bg-color);
     font-family: SapiensLight;
     font-family: SapiensLight;
     font-size: 1em;
     font-size: 1em;
Line 29: Line 38:
/* Vector skin specific properties */
/* Vector skin specific properties */
.vector-body, .vector-menu-content, .vector-menu-portal, .vector-menu-tabs li a, .vector-menu-dropdown .menu a {
.vector-body, .vector-menu-content, .vector-menu-portal, .vector-menu-tabs li a, .vector-menu-dropdown .menu a {
     background-color: #331B0F;
     background-color: var(--main-bg-color);
     color: white;
     color: white;
     border-color: #331B0F;
     border-color: var(--main-bg-color);
     font-family: SapiensLight;
     font-family: SapiensLight;
     font-size: 1em;
     font-size: 1em;
Line 38: Line 47:
/* Wiki specific properties */
/* Wiki specific properties */
#content, #bodyContent, #mw-head-base, #p-logo, #p-navigation, #p-tb, #p-tb-label, #p-tb .body, #footer {
#content, #bodyContent, #mw-head-base, #p-logo, #p-navigation, #p-tb, #p-tb-label, #p-tb .body, #footer {
     background-color: #331B0F;
     background-color: var(--main-bg-color);
     color: white;
     color: white;
     border-color: #331B0F;
     border-color: var(--main-bg-color);
     font-family: SapiensLight;
     font-family: SapiensLight;
     font-size: 1.1em;
     font-size: 1.1em;
Line 47: Line 56:
/* Table of Contents specific properties */
/* Table of Contents specific properties */
.toc {
.toc {
     background-color: #331B0F;
     background-color: var(--main-bg-color);
     color: white;
     color: white;
     border-color: #331B0F;
     border-color: var(--main-bg-color);
     font-family: SapiensLight;
     font-family: SapiensLight;
     font-size: 1em;
     font-size: 1em;
Line 56: Line 65:
/* Wikitable specific properties */
/* Wikitable specific properties */
table.wikitable, table.wikitable td, table.wikitable th {
table.wikitable, table.wikitable td, table.wikitable th {
     background-color: #331B0F;
     background-color: var(--main-bg-color);
     color: white;
     color: white;
     border-color: #331B0F;
     border-color: var(--main-bg-color);
     font-family: SapiensLight;
     font-family: SapiensLight;
     font-size: 1em;
     font-size: 1em;
Line 127: Line 136:
/* Table of Contents */
/* Table of Contents */
.toc {
.toc {
     background-color: #331B0F !important;
     background-color: var(--main-bg-color) !important;
     border: 1px solid white !important;
     border: 1px solid white !important;
     color: white !important;
     color: white !important;

Revision as of 21:13, 17 May 2023

:root {
    --main-bg-color: #353535;
    --main-font-color: white;
    --main-border-color: #353535;
    --main-font-family: SapiensLight;
    --main-font-size: 1em;
    --link-color: #6AD8FF;
}

/* Import the Sapiens fonts from the offical website */
@font-face {
    font-family: 'SapiensLight'; 
    src: url("https://playsapiens.com/fonts/sapienslight-webfont.woff2") format("woff2"), 
         url("https://playsapiens.com/fonts/sapienslight-webfont.woff") format("woff"), 
         url("https://playsapiens.com/fonts/sapienslight-webfont.ttf") format("truetype"); 
    font-weight: normal; 
    font-style: normal; 
}

@font-face { 
    font-family: 'Sapiens'; 
    src: url("https://playsapiens.com/fonts/sapiens-webfont.woff2") format("woff2"), 
         url("https://playsapiens.com/fonts/sapiens-webfont.woff") format("woff"), 
         url("https://playsapiens.com/fonts/sapiens-webfont.ttf") format("truetype"); 
    font-weight: normal; 
    font-style: normal; 
}

/* General properties */
body, div, span, table, td, th {
    background-color: var(--main-bg-color);
    color: white;
    border-color: var(--main-bg-color);
    font-family: SapiensLight;
    font-size: 1em;
}

/* Vector skin specific properties */
.vector-body, .vector-menu-content, .vector-menu-portal, .vector-menu-tabs li a, .vector-menu-dropdown .menu a {
    background-color: var(--main-bg-color);
    color: white;
    border-color: var(--main-bg-color);
    font-family: SapiensLight;
    font-size: 1em;
}

/* Wiki specific properties */
#content, #bodyContent, #mw-head-base, #p-logo, #p-navigation, #p-tb, #p-tb-label, #p-tb .body, #footer {
    background-color: var(--main-bg-color);
    color: white;
    border-color: var(--main-bg-color);
    font-family: SapiensLight;
    font-size: 1.1em;
}

/* Table of Contents specific properties */
.toc {
    background-color: var(--main-bg-color);
    color: white;
    border-color: var(--main-bg-color);
    font-family: SapiensLight;
    font-size: 1em;
}

/* Wikitable specific properties */
table.wikitable, table.wikitable td, table.wikitable th {
    background-color: var(--main-bg-color);
    color: white;
    border-color: var(--main-bg-color);
    font-family: SapiensLight;
    font-size: 1em;
}

/* Color properties */
#content .mw-body-content, .postedit .postedit-content, .vector-menu-tabs li a, .vector-menu-dropdown .menu a, 
.vector-menu-content, .toc .tocnumber, table.wikitable, table.wikitable td, table.wikitable th {
    color: white !important;
}

/* Heading properties */
#content h1 { 
    color: #6AD8FF !important; 
    font-size: 2em !important; 
} 

#content h2 { 
    color: white !important; 
    font-size: 1.8em !important; 
}

#content h3 { 
    color: white !important; 
    font-size: 1.6em !important; 
}

#content h4 { 
    color: white !important; 
    font-size: 1.4em !important; 
}

#content h5 { 
    color: white !important; 
    font-size: 1.2em !important; 
}

#content h6 { 
    color: white !important; 
    font-size: 1.1em !important; 
}

/* Change color of article titles and hide link in Table of Contents */
#firstHeading, .toc .toctoggle a {
    color: #6AD8FF !important;
}

/* All links color */
a {
    color: #6AD8FF !important;
}

/* Links to non-existent pages color */
a.new {
    color: red !important;
}

/* Tables */
table, 
table.wikitable, 
table.wikitable td, 
table.wikitable th,
td, 
th {
    border: 1px solid white !important;
}

/* Table of Contents */
.toc {
    background-color: var(--main-bg-color) !important;
    border: 1px solid white !important;
    color: white !important;
}

.toc .toctitle h2 {
    font-family: 'SapiensLight';
}

/* Section edit links font size */
.mw-editsection a {
    font-size: 0.7em;  /* Adjust this value to your preference */
}

/* Post-save confirmation page text color */
.postedit .postedit-content,
.postedit .postedit-content a {
    color: white !important;
}

/* Increase font size of sidebar links */
#mw-panel .portal .body ul li a {
    font-size: 1.2em !important;
}

/* Change font size and color of navigation links in the sidebar */
#p-navigation .vector-menu-content-list a span,
#p-navigation .vector-menu-content-list a:visited span {
    font-size: 1.2em !important;
    font-family: 'SapiensLight' !important;
    color: #6AD8FF !important;
}

/* Change font size and color of toolbox links in the sidebar */
#p-tb .vector-menu-content-list a span,
#p-tb .vector-menu-content-list a:visited span {
    font-size: 1.2em !important;
    font-family: 'SapiensLight' !important;
    color: #6AD8FF !important;
}

/* Main Page Formatting */
body.page-Main_Page h1.firstHeading { 
    display: none; 
}