Difference between revisions of "MediaWiki:Vector.css"

Revision as of 23:17, 11 April 2022

/* CSS placed here will affect users of the Vector skin */

/* SCREEN.CSS */

/* BODY COLORS AND LOGO */

/* Define Didact Gothic font */

@font-face {
    font-family: 'Didact Gothic';
    src: url('skins/SWLRP/resources/DidactGothic.ttf');
}

body {
	background:url('skins/SWLRP/resources/skins.vector.styles/images/background.jpg') transparent fixed 0 0;
}

div#mw-page-base {
	background:transparent;
}

.mw-body {
	background-color:#180909;
	color:#fff;
}

body:not(page-Main_Page) .mw-body {
	margin-top:-5px;
}

#p-logo {
	top: -110px;
}

#p-logo, #p-logo a {
	height: 120px;
}

/* PAGE TOC */

#toc, .toc, .mw-warning, .toccolours {
	background-color:#360000;
}



/*  LINKS */

a,
.mw-body a, 
.mw-body a.external, 
div#mw-panel nav.portal div.body ul li a {
	/*color:#c4918a;*/
	color:#ffb5ab;
}

div#mw-head {
	/*background-color:#750808;*/
	background:rgba(0,0,0,0.5);
}

a:visited,
div#mw-panel nav.portal div.body ul li a:visited,
.mw-body a.external:visited {
color: #acaabb;
}

a.new, #p-personal a.new {
color:#ffb302;
}

.portal .body li, .vector-menu-portal .body li {
margin-left:15px;
}

.vector-menu-dropdown h3 { color:#fff; }



/* USER ICON */

#pt-userpage, #pt-anonuserpage {
	background:url('skins/resources/skins.vector.styles/images/userprofile-icon.png');
	background-repeat:no-repeat;
}



/* HEADERS */

h1, h2, h3, h4, h5, h6 {
	font-family:'Didact Gothic', sans-serif!important;
	color:#fff;
}

h1#firstHeading {
	font-variant:small-caps;
	letter-spacing:3px;
}

div#mw-panel nav.portal h3 {
	color:#fff;
}


div.vectorMenu h3 span {
	color:#fff;
}



/* TABS */

nav.vectorTabs ul li {
	background:linear-gradient(rgba(100,30,30,0),rgba(100,30,30,0.5),rgba(100,30,30,1));
}

nav.vectorTabs li.selected {
	background:rgba(100,30,30,.9);

}

.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
    color: #fff;
    text-decoration: none;
}

nav.vectorTabs li a {
	color:#ffb5ab;
}

nav.vectorTabs {
margin-top: -5px;
}

.mw-search-profile-tabs { background-color:#641e1e;}

 #searchInput {background-color:#fff;}

.search-types .current a {
	color:#fff;
}



/* FOOTER */

div#footer {
	color:#fff;
	font-variant:small-caps;
	font-size:10pt;
	background:linear-gradient(rgba(100,30,30,1),rgba(100,30,30,1),rgba(100,30,30,0));
	position:relative;
	min-height:35px;
	margin-left:13em !important;
}

div#footer .footer_text {
	float:left;
	margin-right:3em;
}

div#footer ul li {
	color:#fff;
}

.catlinks, #catlinks {
	background:rgba(100,30,30,.9);
	position:relative;
	top:15px;
}

li#footer-poweredbyico { display:none; }



/* EDIT PAGE */

.editOptions {
	background-color:#000;
        color:#fff;
}

#mw-searchoptions {
	background-color:transparent;
}


/* UL Lists */

ul {
	list-style-image:url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20width%3D%225%22%20height%3D%2213%22%3E%0A%3Ccircle%20cx%3D%222.5%22%20cy%3D%229.5%22%20r%3D%222.6%22%20fill%3D%22%23FF020c%22%2F%3E%0A%3C%2Fsvg%3E%0A);
}


/* TABLES */

table.wikitable { 
background-color:#dfb59a;
color:#000;
}

table.wikitable a {
	color:#641e1e;
}

table.wikitable > tr > th, table.wikitable > * > tr > th {
	background-color:#641e1e;
	color:#fff;
}

.mw_metadata td, .mw_metadata th{
	background-color: #3c0606;
}

.mw-datatable td {
    background-color: #000;
}

.mw-datatable th {
    background-color: maroon;
}


/* BUTTONS */

.mw-ui-button.mw-ui-progressive, .mw-ui-button.mw-ui-constructive {
	background-color:#781613;
	border: 1px solid #c00;
}

.mw-ui-button.mw-ui-progressive:hover, .mw-ui-button.mw-ui-constructive:hover{
	background-color:#c00;
	border: 1px solid #781613;
}


/* ADD RECORD PAGE */

#create_new_page { position: relative; margin:30px 0px;}
#create_new_page div { height:50px; }
#create_new_page div form { float:left; }

div#content #create_new_page h1 { font-size: 14pt; }

/* PC TEMPLATE */



#template_image > pre, #template_image > p {
margin:0 !important;
padding:0;
}

#template_image > pre > a {
position: relative;
float: left;
top: -20px;
left: -1px;
}

.mw-search-formheader { background-color:#000; }

.mw-ui-vform label { color: #36F2CA; }

.mw-createacct-benefits-container {display:none;}

.mw-collapsible-toggle {
    display:inline-block!important;
    float:none!important;
}

#mw-panel.collapsible-nav .portal .body { margin:0;}


div#content p {
    line-height: inherit;
    margin: 1em 0px;
}

/* WARNING BOX */

.warning {
    color: #ffffff;
    background: #6e2828;
    border: 2px solid #FF0000;
    padding-left: 5px;
	clear:both;
}

/*  Spoiler & Collapsed Text */

.spoiler {
    border-top: 2px solid #4c4c4c;
    border-bottom: 2px solid #4c4c4c;
    text-align: center;
    margin: 1em;
    padding: 0.2em;
    color: #ad0202;
	background:#f2f5f7;
}

.spoiler .mw-collapsible-toggle a { color: #0000ff;}

.spoiler div.mw-collapsible-content p { text-align:left; color:#000;}


/*  WIP  */

div.wip {
width:50%; 
border: 1px solid #0800fd;
outline: 2px solid #699; 
border-radius: 20px; 
padding:1em; 
background:#f2f5f7; 
text-align:justify; 
letter-spacing:1px; 
font-size:12px; 
color: #000;
}

/*  TEMPLATES PER FACTION */

.faction_header_image {
	display:none;
}

#nickname {
	font-size: 30pt;
    font-style: italic;
    width: 1000px;
    height: 105px;
    color: #000;
    font-family: Diadect Gothic, sans-serif;
    font-variant: small-caps;
    font-style: normal;
}

.faction_templar #nickname {
	    background: url('skins/SWLRP/resources/skins.vector.styles/images/TemplarHeader.png') transparent;
}

.faction_illuminati #nickname {
	    background: url('skins/SWLRP/resources/skins.vector.styles/images/IlluminatiHeader.png') transparent;
}

.faction_dragon #nickname {
	    background: url('skins/SWLRP/resources/skins.vector.styles/images/DragonHeader.png') transparent;
}

.faction_neutral #nickname {
	    background: url('skins/SWLRP/resources/skins.vector.styles/images/NeutralHeader.png') transparent;
}

.faction_orochi #nickname {
	    background: url('skins/SWLRP/resources/skins.vector.styles/images/OrochiHeader.png') transparent;
}

.faction_cov #nickname {
	   background: url('skins/SWLRP/resources/skins.vector.styles/images/COVHeader.png') transparent;
}

#nickname_text {
	width:1000px;
	text-align:center;
	padding-top:25px;
	text-shadow: 0 1px 0 #888, 
	0 2px 0 #858585, 
	0 3px 0 #666, 
	0 4px 0 #878787, 
	0 5px 0 #888, 
	0 6px 1px rgba(0,0,0,.1), 
	0 0 5px rgba(0,0,0,.1), 
	0 1px 3px rgba(0,0,0,.3), 
	0 3px 5px rgba(0,0,0,.2), 
	0 5px 10px rgba(0,0,0,.25), 
	0 10px 10px rgba(0,0,0,.2), 
	0 20px 20px rgba(0,0,0,.15)
}

div#player {
    font-size: 10pt;
    color: #BBB;
    margin-top: -3px;
    text-align: center;
	text-shadow: 1px 1px 3px black;
}

#player {
font-size: 10pt;
color: #BBB;
margin-top:5px;
}

#template_sidebar {
float: right;
width: 300px;
text-align:center;
margin-top:50px;
}

#template_sidebar #template_image {
	overflow:hidden;
	height:300px;
	width:300px;
        margin-left:5px;
}

.faction_templar #template_image {
	border: 1px #960001 solid;
	box-shadow: 3px 3px 3px 0px rgb(181, 5, 5, 0.6);
}

.faction_illuminati #template_image {
	border: 1px #51bfe5 solid;
	box-shadow: 3px 3px 3px 0px rgba(73,166,209,0.6);
}

.faction_dragon #template_image {
	border: 1px #49b221 solid;
	box-shadow: 3px 3px 3px 0px rgb(78, 186, 34, 0.6);
}

.faction_orochi #template_image {
	border: 1px #fff solid;
	box-shadow: 3px 3px 3px 0px rgb(78, 186, 34, 0.6);
}

.faction_cov #template_image {
	border: 1px #70a1c7 solid;
	box-shadow: 3px 3px 3px 0px rgb(78, 186, 34, 0.6);
}

.faction_neutral #template_image {
	border:1px #9e6d14 solid;
	box-shadow: 3px 3px 3px 0px rgba(201, 122, 23, 0.6);
}

#template_image_caption {
font-family:Diadect Gothic, sans-serif;
font-size:16px;
color:#ffffff; 
text-shadow: 1px 1px 3px black;
letter-spacing:0.2em;
position:relative;
font-weight:normal;
font-variant:small-caps;
width:100%;
}


.faction_templar #template_image_caption { background: #960001; }

.faction_illuminati #template_image_caption { background: #001b60;}

.faction_dragon #template_image_caption { background:#175a0b; }

.faction_neutral #template_image_caption { background:#9e6d14; }

.faction_cov #template_image_caption { background:#5e7688; }

.faction_orochi #template_image_caption { background:#979898; }


/* In-body link colors */

.faction_templar ~ #headertabs div > p > a, .faction_templar ~ #headertabs div.spoiler a {color: #ff0000;}
.faction_templar ~ #headertabs div > p > a:visited, .faction_templar ~ #headertabs div.spoiler a:visited { color: #960001;}

.faction_illuminati ~ #headertabs div > p > a, .faction_illuminati ~ #headertabs div.spoiler a {color: #0064ff;}
.faction_illuminati ~ #headertabs div > p > a:visited, .faction_illuminati ~ #headertabs div.spoiler a:visited { color: #7300ec;}

.faction_dragon ~ #headertabs div > p > a, .faction_dragon ~ #headertabs div.spoiler a {color: #00b520;}
.faction_dragon ~ #headertabs div > p > a:visited, .faction_dragon ~ #headertabs div.spoiler a:visited { color: #0c6919;}

.faction_neutral ~ #headertabs div > p > a, .faction_neutral ~ #headertabs div.spoiler a {color:#9e6d14;}
.faction_neutral ~ #headertabs div > p > a:visited, .faction_neutral ~ #headertabs div.spoiler a:visited { color: #7300ec;}

.faction_cov ~ #headertabs div > p > a, .faction_cov ~ #headertabs div.spoiler a {color: #0064ff;}
.faction_cov ~ #headertabs div > p > a:visited, .faction_cov ~ #headertabs div.spoiler a:visited { color: #7300ec;}

.faction_orochi ~ #headertabs div > p > a, .faction_orochi ~ #headertabs div.spoiler a {color: #0064ff;}
.faction_orochi ~ #headertabs div > p > a:visited, .faction_orochi ~ #headertabs div.spoiler a:visited { color: #7300ec;}



#template_vitals {
padding: 5px 0px;
width:100%;
position: relative;
text-align: left !important;
}

#template_vitals > p:not(.vital_start) {
margin-left:10px !important;
font-size:9pt;
color:#000;
}

.vital_title { font-weight:bold; }

#template_vitals p.vital_start { 
text-align: center; 
font-weight:bold; 
font-size:11pt !important; 
text-transform:capitalize;
color:#000;
margin:0px !important;
}

.faction_illuminati #template_vitals { 
background:#8fe0ff url('skins/SWLRP/resources/skins.vector.styles/images/faction_illuminati_bg.png') center no-repeat;}
.faction_illuminati #template_vitals p.vital_start {border-bottom:1px solid #001b60;}
.faction_illuminati #template_vitals a {color:#134de0;}

.faction_templar #template_vitals { background:#dfbcbc url('skins/SWLRP/resources/skins.vector.styles/images/faction_templar_bg.png') center no-repeat;}
.faction_templar #template_vitals p.vital_start {border-bottom:1px solid #960001;}
.faction_templar #template_vitals a {color:#960001;} 

.faction_dragon #template_vitals { background:#bddfbc url('skins/SWLRP/resources/skins.vector.styles/images/faction_dragon_bg.png') center no-repeat;}
.faction_dragon #template_vitals p.vital_start {border-bottom:1px solid #175a0b;}
.faction_dragon #template_vitals a {color:#175a0b;}

.faction_neutral #template_vitals { background: #dfdebc;}
.faction_neutral #template_vitals p.vital_start {border-bottom:1px solid #9e6d14;}
.faction_neutral #template_vitals a {color:#9e6d14;}

.faction_cov #template_vitals { background:#bcccdf url('skins/SWLRP/resources/skins.vector.styles/images/faction_cov_bg.png') center no-repeat;}
.faction_cov #template_vitals p.vital_start {border-bottom:1px solid #39649e;}
.faction_cov #template_vitals a {color:#1766a2;}

.faction_orochi #template_vitals { background:#dcdddc url('skins/SWLRP/resources/skins.vector.styles/images/faction_orochi_bg.png') center no-repeat;}
.faction_orochi #template_vitals p.vital_start {border-bottom:1px solid #eee;}
.faction_orochi #template_vitals a {color:#fff;}


/* Tables per Faction */

.faction_illuminati ~ #headertabs table.wikitable th {
	background:#001b60;
	border:1px solid #fff;
}

.faction_illuminati ~ #headertabs table.wikitable { background-color: #bcbfdf; }


.faction_dragon ~ #headertabs table.wikitable th {
	background:#175a0b;
	border:1px solid #fff;
}

.faction_dragon ~ #headertabs table.wikitable { background-color: #bddfbc; }


.faction_neutral ~ #headertabs table.wikitable th {
	background:#9e6d14;
	border:1px solid #fff;
}

.faction_neutral ~ #headertabs table.wikitable { background-color: #dfdebc; }


.faction_cov ~ #headertabs table.wikitable th {
	background:#516575;
	border:1px solid #2b4356;
}

.faction_cov ~ #headertabs table.wikitable { background-color: #e3f1fb; }


.faction_orochi ~ #headertabs table.wikitable th {
	background:#000;
	border:1px solid #fff;
}

.faction_orochi ~ #headertabs table.wikitable { background-color: #c0c0c0; }



/* Featured Character */

div#featuredcharacter {
	width:50%;
	max-width:715px;
	max-height:400px;
	float:right;
	border-radius: 15px;
    border: 1px solid maroon;
    background: -moz-linear-gradient(top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
    background: linear-gradient(to top, rgba(100,0,0,0.5) 0%,rgba(0,0,0,0) 100%);
}

div#featuredcharacter #nickname {
	height:75px;
	width:auto;
	font-size:14pt;
	background:url('skins/SWLRP/resources/skins.vector.styles/images/FeaturedCharacter.png');
	background-repeat:no-repeat;
	background-size:contain;
	border-radius:15px 15px 0px 0px;
}

@media screen and (min-width: 1366px) {
    div#featuredcharacter #nickname {
        font-size:2em;
    }
}

div#featuredcharacter #nickname_text {

width:auto;
text-align: center;
padding-top: 15px;
text-shadow: 0 1px 0 #888, 0 2px 0 #858585, 0 3px 0 #666, 0 4px 0 #878787, 0 5px 0 #888, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15);
}

div#featuredcharacter > p, div#featuredcharacter > div {
	padding:0px 10px;
}

:not(#featuredcharacter) > div#fcb { display:none; }


div#fcb_image {float:right; margin:-35px 5px 10px 10px; }
div#fcb_text {}

div#fcb + p {float:left;}


/* User Preferences */

.client-js #preferences {background-color:#000;}

.client-js #preftoc a, .client-js #preftoc a:active { color: #acaabb; }

/* Small Screen Sidebar Adjustments */

@media only screen 
and max-device-width : 1024px) {

#template_sidebar {
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 25px;
    margin-bottom:25px;
    max-width:1000px;
    width:1000px;
}

#template_image {
float:left;
}

#template_image_caption {
	position:initial;
	float:left;
	margin-left:5px;
	width:530px;
}

#template_vitals {
	float:left;
	width:530px;
	margin-left:5px;
	max-height:268px;
	min-height:268px;
}

#template_vitals > p:not(.vital_start) {
	margin-left:25px !important;
}

}



/* HEADERTABS */

.oo-ui-tabOptionWidget {
    list-style: none;
    float: left;
    position: relative;
    top: 0;
    margin: 1px 0.2em 0 0;
    border-bottom: 0;
    padding: 0;
    white-space: nowrap;
    font-family: sans-serif;
    font-weight:normal;
    font-size:85%;
}

.oo-ui-tabSelectWidget-framed .oo-ui-tabOptionWidget.oo-ui-optionWidget-selected .oo-ui-labelElement-label {border-bottom-color: transparent;}


#headertabs .oo-ui-tabOptionWidget {
     color:#000;
     border-radius:2px 2px 0px 0px;
} 

.faction_templar ~ #headertabs .oo-ui-tabOptionWidget {
	background:#dfbcbc;
	border:1px solid #690000;
}

.faction_illuminati ~ #headertabs .oo-ui-tabOptionWidget {
	background:#bcbfdf;
	border:1px solid #035a9c;
}

.faction_dragon ~ #headertabs .oo-ui-tabOptionWidget {
	background:#bddfbc;
	border:1px solid #175a0b;
}

.faction_neutral ~ #headertabs .oo-ui-tabOptionWidget {
	background:#dfdebc;
	border:1px solid #c39d16;
}

.faction_orochi ~ #headertabs .oo-ui-tabOptionWidget {
	background:#979898;
	border:1px solid #000;
}

/* .faction_cov is the default colors */

/* HOVER and ACTIVE */

.faction_templar ~ #headertabs oo-ui-optionWidget-selected, .faction_templar ~ #headertabs .oo-ui-tabOptionWidget:hover  {background:#690000; }

.faction_illuminati ~ #headertabs oo-ui-optionWidget-selected, .faction_illuminati ~ #headertabs .oo-ui-tabOptionWidget:hover {background: #035a9c; }

.faction_dragon ~ #headertabs oo-ui-optionWidget-selected, .faction_dragon ~ #headertabs .oo-ui-tabOptionWidget:hover { background:#175a0b; }

.faction_neutral ~ #headertabs oo-ui-optionWidget-selected, .faction_neutral ~ #headertabs .oo-ui-tabOptionWidget:hover {background:#9e6d14; }

.faction_cov ~ #headertabs oo-ui-optionWidget-selected, .faction_cov ~ #headertabs .oo-ui-tabOptionWidget:hover {background:#5e7688;}

.faction_orochi ~ #headertabs oo-ui-optionWidget-selected, .faction_orochi ~ #headertabs .oo-ui-tabOptionWidget:hover { background:#000; }


#headertabs oo-ui-optionWidget-selected, #headertabs .oo-ui-tabOptionWidget:hover  { color:#fff !important; }

#headertabs {
	float:left;
	min-width:1000px;
	width:1000px;
}

#headertabs .oo-ui-menuLayout > .oo-ui-menuLayout-content {
	background:#d8d7d7;
        color:#362b36;
	border-top:1px solid #ccc;
}

#headertabs .oo-ui-menuLayout-menu {
	background:#d8d7d7;
	border:none;
}

#headertabs h2 {
padding:10px 15px; 
background: #690000;
font-size:18px;
color:#ffffff; 
text-shadow: 1px 1px 3px black;
letter-spacing:0.2em;
}

.faction_templar ~ #headertabs h2 { background:#690000; }

.faction_illuminati ~ #headertabs h2 { background:#035a9c; }

.faction_dragon ~ #headertabs h2 { background:#175a0b;}

.faction_neutral ~ #headertabs h2 {background:#9e6d14;}

.faction_cov ~ #headertabs h2 {background:#7a91a2;}

.faction_orochi ~ #headertabs h2 {background:#6d6e6f;}

#headertabs h3 {
padding:10px 15px; 
font-size:16px;
color:#ffffff; 
text-shadow: 1px 1px 3px black;
letter-spacing:0.2em;
border-radius:25px;
position:relative;
font-weight:normal;
left:15px;
width:95%;
}

.faction_templar ~ #headertabs .oo-ui-optionWidget-selected {background:#360000; color:#fff;}

.faction_illuminati ~ #headertabs .oo-ui-optionWidget-selected { background: #001b60; color:#fff;}

.faction_dragon ~ #headertabs .oo-ui-optionWidget-selected {background:#213c0e; color:#fff;}

.faction_neutral ~ #headertabs .oo-ui-optionWidget-selected {background:#583c12; color:#fff;}

.faction_cov ~ #headertabs .oo-ui-optionWidget-selected {background:#4d5d68; color:#fff;}

.faction_orochi ~ #headertabs .oo-ui-optionWidget-selected {background:#000; color:#fff;}