Difference between revisions of "MediaWiki:Monobook.css"
(26 intermediate revisions by 2 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 */ | ||
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; | |||
} | |||
} | |||
body | @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; | |||
} | |||
} | } | ||
#p- | 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: # | color:#EDEDED; | ||
background: none; | background:none; | ||
border:none; | |||
box-shadow:none; | |||
} | } | ||
/********************************************** | |||
** | |||
** PERSONAL LINKS | |||
color: # | ** | ||
**********************************************/ | |||
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; | |||
} | } | ||
#p- | |||
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; | |||
} | } |
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; }