MediaWiki:Cologneblue.css

/* 'Wetpaint' modification for 'Cologne Blue' MediaWiki theme v1.1 */ /* intended for use on the Audiovisual Identity Database */ /* -- */ /* copy all of this and paste into your custom CSS for the 'cologne blue' theme, available under 'user preferences > theme'. */ /* if you are looking to add positioning similar to the old site I would recommend you use the code in User:PajamaFrix/cologneblue.js */

body, #toplinks, #article, #article td, #article th, #article p, #quickbar {font-family: Arial, Verdana, Helvetica, sans-serif;}

/* Background color */ body.ns-0, body {background: #252525;}

.image img, p img { max-width: 500px; height: auto; }

/* Header */
 * 1) topbar {background: transparent;}

background: #252525; margin:0; padding:0; height: 200px; margin-bottom: 40px; text-transform: capitalize; /* margin:-10px 0 0; */ min-height:100px; /* padding: 5px; */ line-height:1em; font-size:2.7em; font-family: "Times New Roman", Times, Georgia, serif; position:relative; }
 * 1) sitetitle {

/* Header image */ display: inline-block; background: transparent url("https://i.imgur.com/X7pxhsw.png") no-repeat center; background-size:contain; width: 768px; height: 200px; padding:0 0 0 10px; margin:0; margin-left:8px; font-size:0; vertical-align: bottom; }
 * 1) sitetitle a, #sitetitle a:hover {

/* Navigation bar */ top: 200px; /* needs to be manually adjusted */ background: #666; height: 40px; right: 0; text-transform: capitalize; }
 * 1) toplinks {

font-size: 14px; }   text-decoration: underline; }
 * 1) toplinks a {
 * 1) toplinks a:hover {

.cb-piped-list > li:not(:first-child)::before { content: '⸽'; display: inline-block; margin-right: 10px; } .cb-piped-list > li { float: left; white-space: nowrap; position: relative; display: block; font-weight: bold; line-height: 40px; padding: 0 5px; margin-bottom: 0; }

margin-bottom:40px; }
 * 1) sitetitle, #sitesub, #toplinks {

margin-bottom:10px; }
 * 1) linkcollection {

h1 {font-size: 175%;}

h1, h2, h3, h4, h5, h6 { font-weight: normal; color: black; font-family: Arial, Verdana, Helvetica, sans-serif; }

border: 1px solid #CDCDCD; background: #fff; margin-left: 220px; padding: 10px; margin-right: 10px; }
 * 1) article {

/* Quick bar */ width: 170px; top:315px; background: #fff; font-weight:normal; border: 1px solid #000; font-size: 80%; color: #666; padding: 2.5px 10px 5px 10px; left: 14px; height: 200px; overflow: auto; box-shadow: 0 0 0 1px #666; }
 * 1) quickbar {


 * 1) p-search {display:none;}

list-style-type: square; margin: 0.3em 0 0 0.5em; }
 * 1) quickbar .portlet ul, #quickbar .portlet li {


 * 1) quickbar li {list-style: none !important;}

content: "\2022"; color: #c2e1ff; display: inline-block; position: absolute; width: 1em; margin-left: -1em; margin-top: 0.15em; }	line-height: 1.25em; display: block; margin: 0 -10px 0 -100px; padding: 0.2em 0 0.2em 100px; position: relative; color: #497FB1; text-decoration: none; }
 * 1) quickbar li:before {
 * 1) quickbar li a {

font-weight:normal; font-family: 'AVID Sans'; color: #497FB1; font-size: 13px; margin: 0 -10px 0 -100px; padding: 0.2em 0 0.2em 100px; cursor: default; }
 * 1) quickbar h3 {

background-color: #E3EEF9; color: #DE590A; } a:link, a:visited, .oo-ui-tabOptionWidget:not(.oo-ui-optionWidget-selected).oo-ui-widget-enabled .oo-ui-labelElement-label{ color: #497FB1; text-decoration:none; }
 * 1) quickbar li a:hover, #quickbar h3:hover {

a:hover {color:#FF7F00;text-decoration:underline;}

/* more page formatting */
 * 1) linkcollection, #sitesub {visibility: hidden;}
 * 2) ca-cb-mainpage {margin-left:5px;}

font-family: Arial, Verdana, Helvetica, sans-serif; text-align: left; position: relative; height: 80px; margin: 20px 0 10px 0; padding: 0px; font-size: 75%; color: #DDDDDD; }
 * 1) footer {
 * 1) footer li {line-height: 30px;}
 * 2) footer li a {color: #C5DBED;}
 * 3) footer li a:hover {color: #DDDDDD;}

text-indent: -100px; background: #fff; background-image: none; color: #497FB1; text-decoration: none; }
 * 1) pt-notifications-alert .mw-echo-notifications-badge, #pt-notifications-notice .mw-echo-notifications-badge {

text-indent: -100px; background: #E3EEF9; background-image: none; color: #DE590A; text-decoration: underline; }
 * 1) pt-notifications-alert .mw-echo-notifications-badge li a:hover, #pt-notifications-notice .mw-echo-notifications-badge li a:hover{

display: list-item; margin: 0.75em 0.5em 0.75em 6.5px; }
 * 1) p-personal li#pt-notifications-alert, #p-personal li#pt-notifications-notice {


 * 1) pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read::before, #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read::before, #pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read, #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {filter:none;}
 * 2) pt-notifications-alert .mw-echo-notifications-badge, #pt-notifications-notice .mw-echo-notifications-badge {filter:none;}
 * 3) pt-notifications-alert .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read, #pt-notifications-notice .mw-echo-notifications-badge.mw-echo-notifications-badge-all-read {opacity: 1;}
 * 4) pt-uls {display:none;}


 * 1) article p.subtitle, #article p.subpages, #article p.tagline {display:none;}
 * 2) firstHeading {padding-bottom: 5px;margin-bottom: 5px;}
 * 3) siteNotice {visibility: visible;border:none;}

.oo-ui-buttonElement-framed > .oo-ui-buttonElement-button { background: #A9CEEE url(https://i.imgur.com/feC4z6s.png) repeat-x top left; border: solid 1px #979797; color: #333; padding: .3em 1em .3em 1em; margin: 0; cursor: pointer; font-weight: bold; font-size: 90%; overflow: visible; width: auto; } .oo-ui-buttonElement > .oo-ui-buttonElement-button {min-height: 20px;}

.oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover { border-color: #a2a9b1; background-color: #CCC; color: #333; font-weight: normal; }

.oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover{ color: #000; background-color: #A9CEEE; border-color: #a2a9b1; font-weight: bold; }

width:166px; border:1px solid #cdcdcd; margin:0 3px; padding:.1em 0 .1em .2em; vertical-align:bottom; line-height:1.4em; height:1.7em; color:#666; text-align:left }	vertical-align:top; background:transparent url(https://i.imgur.com/1IFH14g.png) no-repeat top; border:none; height:17px; width:17px; margin:.2em 0 0 0; padding:0; color:transparent; cursor:pointer }   font-family: Arial; }   font-weight: normal; font-family: 'Arial'; color: #497FB1; font-size: 13px; margin: 0 -10px 0 -100px; padding: 0.2em 0 0.2em 100px; cursor: default; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button:hover { color: #000; background-color: #A9CEEE; border-color: #a2a9b1; font-weight: bold; font-family: Tahoma; } .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button, .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button:hover { border-color: #a2a9b1; background-color: #CCC; color: #333; font-family: Tahoma; } .oo-ui-buttonElement-frameless.oo-ui-widget-enabled.oo-ui-flaggedElement-destructive > .oo-ui-buttonElement-button { color: #d33; font-family: Tahoma; } .editOptions { background-color: #eaecf0; color: #202122; border: 1px solid #c8ccd1; border-top: 0; padding: 1em 1em 1.5em 1em; margin-bottom: 2em; font-family: Arial; } h1, #firstHeading, .firstHeading, h2, h3, h4, h5, h6 { font-family: 'Arial'; font-weight: 500; } .mw-message-box { font-family: 'Arial'; } .mw-body-content { font-family: 'Arial' !important; letter-spacing: 0.7px; }
 * 1) p-search #searchInput {
 * 1) p-search input.mw-fallbackSearchButton {
 * 1) mw-navigation a {
 * 1) quickbar h3 {