Welcome to Square Enix Wiki! Be sure to check out our To-Do List to see what work we need done!

Difference between revisions of "MediaWiki:Monobook.css"

From Square Enix Wiki, the Fan-wiki for all things Square Enix
Jump to navigationJump to search
 
(34 intermediate revisions by 3 users not shown)
Line 1: Line 1:
/* CSS placed here will affect users of the Monobook skin */
/* CSS placed here will affect users of the Monobook skin */


/* See also: [[MediaWiki:Common.css]] */
body{
background:#EAEAEA;
}
 
body.skin--responsive .mw-body{
background:#FFFFFF;
border:none;
padding:2em;
box-shadow:0 0 8px -4px #000000;
}
 
@media (prefers-color-scheme: dark){
body.skin--responsive .mw-body {
background: #282828;
color: #DEDEDE;
}
}
 
@media screen and (min-width: 551px){
body.skin--responsive .mw-body{
margin:3.8em 0 0 13.7em;
}
}
 
@media screen and (min-width: 551px){
div#column-content {
    margin: 0 0 0.6em -14.2em;
}
}
 
@media screen and (min-width: 551px){
body.skin--responsive #p-cactions {
left:13.5em;
top:2.3em;
}
}


body { background: #2E2E33 url('http://seiwanetwork.org/bg-dark.jpg') repeat;
/**********************************************
font: x-small sans-serif; }
**
** ACTION TABS
**
**********************************************/


/*** Bold 'edit this page' link to encourage newcomers ***/
@media screen and (min-width: 551px){
body.skin--responsive #p-cactions li.selected {
    box-shadow: 0 -2px 8px -4px #000000;
    border-top: #CC0000 3px solid;
}
}


#ca-edit a {  
@media (prefers-color-scheme: dark){
    font-weight: bold !important;  
body.skin--responsive #p-cactions li.selected {
background: #282828;
color: #FFFFFF;
}
}
}


#p-cactions ul li, #p-cactions ul li a {
body.skin--responsive #p-cactions li.selected a{
  -moz-border-radius-topleft: 1em;
border:none;
  -moz-border-radius-topright: 1em;
background:#FFFFFF;
color:#181818;
}
}
#content {
 
  -moz-border-radius-topleft: 1em;
@media (prefers-color-scheme: dark){
  -moz-border-radius-bottomleft: 1em;
body.skin--responsive #p-cactions li.selected a {
  -moz-border-radius-topright: 1em;
background: #282828;
  -moz-border-radius-bottomright: 1em;
color: #FFFFFF;
  border: 4px ridge silver;
}
}
}
div.pBody {
 
  -moz-border-radius-topright: 1em;
body.skin--responsive #p-cactions li {
  -moz-border-radius-bottomright: 1em;
    border: none;
  border: 4px ridge silver;  
    border-bottom: none;
    background: #282828;
    transition:.1s ease-in-out;
}
}
div.pBody {
 
background-color: #000000;
@media (prefers-color-scheme: dark){
border:3px solid #333333;
body.skin--responsive #p-cactions li {
background: #505050;
}
}
}


#p-personal a {
body.skin--responsive #p-cactions li:hover{
color: #DE032D !important;
border-top:2px #CC0000 solid;
background-color: transparent;
box-shadow: 0 -2px 8px -4px #000000;
        font-weight: bold;
}
}


.portlet a {
body.skin--responsive #p-cactions li a{
color: #DE032D;
position:relative;
background: none;
font-weight:bold;
}
}


div#footer {
body.skin--responsive #p-cactions li a, body.skin--responsive #p-cactions li a:hover{
background-color: #000000;
color:#EDEDED;
border: 2px solid #333333;  
background:none;
color: #DE032D;
border:none;
box-shadow:none;
}
}


h5 { color: #DE032D; }
/**********************************************
**
** PERSONAL LINKS
**
**********************************************/


/* Page tabs */
body.skin--responsive #p-personal .pBody ul a{
#p-cactions li.selected a{
color:#47B9EA;
background-color:#000000;
border-bottom:1px solid #333333;
        color:#DE032D
}
}
#p-cactions li a {
 
background-color:#000000;
body.skin--responsive #p-personal .pBody ul {
border:3px solid #333333;
height:unset;
color:#DE032D;
    background: #444444;
    border-bottom: 2px solid #CC0000;
    border-left: none;
    border-bottom-left-radius: 0;
    box-shadow: 0 0 8px 0 #000000;
    padding: .25em 1em;
}
}
#p-cactions li.selected a:hover {background-color:#FFFFFF;}
 
#p-cactions li a:hover {
@media screen and (min-width: 551px){
background-color:#333333;
li#pt-userpage, li#pt-anonuserpage {
border:3px solid #DE032D
    background-position: center left;
color:#000000;
}
text-decoration:underline;
}
 
 
/**********************************************
**
** LEFT NAVIGATION
**
**********************************************/
@media screen and (min-width: 551px){
body.skin--responsive .portlet {
    border: 0;
    margin: 0 0.5em;
}
}
 
body.skin--responsive #sidebar .pBody {
    box-shadow: 0 0 8px -4px #000000;
    margin: 0.5em 0.2em;
}
 
body.skin--responsive #sidebar .pBody a{
color:#47B9EA;
}
 
@media screen and (min-width: 551px){
body.skin--responsive .pBody {
    background-color: #444444;
    padding: .5em;
}
body.skin--responsive #p-logo a, body.skin--responsive #p-logo a:hover{
background-size: contain;
}
}
 
 
 
/**********************************************
**
** FOOTER
**
**********************************************/
 
div#footer {
    background-color: #181818;
    border: none;
    color: #C0C0C0;
    box-shadow: 0 0 4px -1px #000000;
}
}


#p-cactions li.selected {border-color:#000000;}
div#footer ul a{
#p-cactions li {
color:#47B9EA;
background-color:#333333;
border-style: solid #DE032D;
border-color: #FFFFFF;
}
}
#ca-edit a { font-weight: bold !important; }

Latest revision as of 20:38, 24 November 2022

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

body{
	background:#EAEAEA;
}

body.skin--responsive .mw-body{
	background:#FFFFFF;
	border:none;
	padding:2em;
	box-shadow:0 0 8px -4px #000000;
}

@media (prefers-color-scheme: dark){
	body.skin--responsive .mw-body {
		background: #282828;
		color: #DEDEDE;
	}
}

@media screen and (min-width: 551px){
	body.skin--responsive .mw-body{
		margin:3.8em 0 0 13.7em;
	}	
}

@media screen and (min-width: 551px){
	div#column-content {
	    margin: 0 0 0.6em -14.2em;
	}
}

@media screen and (min-width: 551px){
	body.skin--responsive #p-cactions {
		left:13.5em;
		top:2.3em;
	}
}

/**********************************************
**
**		ACTION TABS
**
**********************************************/

@media screen and (min-width: 551px){
	body.skin--responsive #p-cactions li.selected {
	    box-shadow: 0 -2px 8px -4px #000000;
	    border-top: #CC0000 3px solid;
	}
}

@media (prefers-color-scheme: dark){
	body.skin--responsive #p-cactions li.selected {
		background: #282828;
		color: #FFFFFF;
	}
}

body.skin--responsive #p-cactions li.selected a{
	border:none;
	background:#FFFFFF;
	color:#181818;
}

@media (prefers-color-scheme: dark){
	body.skin--responsive #p-cactions li.selected a {
		background: #282828;
		color: #FFFFFF;
	}
}

body.skin--responsive #p-cactions li {
    border: none;
    border-bottom: none;
    background: #282828;
    transition:.1s ease-in-out;
}

@media (prefers-color-scheme: dark){
	body.skin--responsive #p-cactions li {
		background: #505050;
	}
}

body.skin--responsive #p-cactions li:hover{
	border-top:2px #CC0000 solid;
	box-shadow: 0 -2px 8px -4px #000000;
}

body.skin--responsive #p-cactions li a{
	position:relative;
	font-weight:bold;
}

body.skin--responsive #p-cactions li a, body.skin--responsive #p-cactions li a:hover{
	color:#EDEDED;
	background:none;
	border:none;
	box-shadow:none;
}

/**********************************************
**
**		PERSONAL LINKS
**
**********************************************/

body.skin--responsive #p-personal .pBody ul a{
	color:#47B9EA;
}

body.skin--responsive #p-personal .pBody ul {
	height:unset;
    background: #444444;
    border-bottom: 2px solid #CC0000;
    border-left: none;
    border-bottom-left-radius: 0;
    box-shadow: 0 0 8px 0 #000000;
    padding: .25em 1em;
}

@media screen and (min-width: 551px){
	li#pt-userpage, li#pt-anonuserpage {
	    background-position: center left;
	}
}


/**********************************************
**
**		LEFT NAVIGATION
**
**********************************************/
@media screen and (min-width: 551px){
	body.skin--responsive .portlet {
	    border: 0;
	    margin: 0 0.5em;
	}
}

body.skin--responsive #sidebar .pBody {
    box-shadow: 0 0 8px -4px #000000;
    margin: 0.5em 0.2em;
}

body.skin--responsive #sidebar .pBody a{
	color:#47B9EA;
}

@media screen and (min-width: 551px){
	body.skin--responsive .pBody {
	    background-color: #444444;
	    padding: .5em;
	}
	
	body.skin--responsive #p-logo a, body.skin--responsive #p-logo a:hover{
		background-size: contain;
	}
}



/**********************************************
**
**		FOOTER
**
**********************************************/

div#footer {
    background-color: #181818;
    border: none;
    color: #C0C0C0;
    box-shadow: 0 0 4px -1px #000000;
}

div#footer ul a{
	color:#47B9EA;
}