MediaWiki talk:Timeless.css

Please overwrite MediaWiki:Timeless.css code with this instead

User:Kmdenmark can do you this? It should improve color contrast, and restore the layout and the missing user preferences for mobile users, who currently have to change skins back in Special:SpecialPages. It will also remove the Merriweather font since the new default font is much nicer. There will probably may to be a few more changes after this. Thanks notjusttired (talk) User:JenB Can you copy this code below over to MediaWiki:Timeless.css. notjusttired (talk) 18:11, June 1, 2019 (EDT)

User:Kmdenmark User:Pyrrhus Can one of you update the Timeless.css code to overwrite it with this? Apart from the changes described above, it also includes Portal colors.

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

html {
	background: rgb(0,0,0) !important;
	height: 100%;
	filter: brightness(100%) contrast(100%) grayscale(0%) !important;
	-webkit-filter: brightness(100%) contrast(100%) grayscale(0%) !important;
}
body {
	margin: 0;
	background: #000;
	color: #ccc;
}

/* make orange brighter using low vision colors */
a, a:link, a:active { 
 /* unvisited links */
 color: #E69F00;
}
.current, .current a { 
/* Content types etc on search results */
   color: #E69F00!important;
}
/* wanted pages red color */
a.new, a.new:hover, .new a:hover, a.new:visited, .new a:visited { 
  color: #FF4444;
}
/* stubs lighter than low vision sky blue */
a.stub {
  color: #86d4f9 !important;
}
/* low vision sky blue shade for some headings and visited */
h2, h3, h4, a:visited, a:hover, a.link:visited {
  color: #56b4e9;
}
/* external links rapture blue shade */
.mw-body-content a.external,
 a.external:visited {
 color: #83BFCE;
}

/* caption does site visits */
caption {
color: #ccc;
}
caption big {
 color: #bbb;
 font-weight: normal;
}

/* set dark colors where missing*/
h1 {
 color: #fff;
 text-shadow: 1px 1px 1px #000;
}

#personal .dropdown b {
	font-weight: normal;
}
b, strong {
	text-shadow: 1px 1px 1px #000;
}
div.editOptions {
	border-color: #aaa;
	background: #555;
}
#mw-header-nav-hack {
	border-top: solid 2px #000;
	background: #333;
}
#mw-site-navigation .sidebar-inner {
	background: #333;
        color: #ccc;
	border: 0;
}

#mw-site-navigation .sidebar-chunk {
	border-color: #aaa;
	box-shadow: 1px 1px 1px rgba(0,0,0,0.5);
	border-radius: 2px;
}
/* set dark colors where missing*/
#mw-wrapper, #mw-header, #mw-header-container,
.right-canvas-menu, 
.left-off-canvas-menu,
.off-canvas-list,
.sidebar-chunk,
#mw-content-text,
.toc, #toc,
#p-cactions
{
background-color: #000;
color: #ccc; 
border-color: #aaa;
}
.sidebar-inner {
background-color: #333!important;
color: #ccc;
border-color: #aaa;
}

/* set light colors where missing eg spans */
span, .label  {
  color: #eee;
}

.gallery, .gallerybox, #mw-content-text ul,
table, p, div, table ul, table li
{
	background: #333; 
	color: #ccc; 
        border-color: #000;
}

@media screen and (max-width: 851px) {
#user-tools { 
background-color: #000;
}

#user-tools h2 {
display: block;
}
#user-tools h2 ul {
   background-color: #333;
}

#user-tools { 
position: absolute;
right: 1em;
top: 0;
}

#personal-extra { 
  position: relative;
  left: -12rem;
  top: 0.75rem;
  background-color: transparent;
}
#personal-inner {
  background-color: #333;
}
#pt-notifications-alert,
#pt-notifications-notice { 
filter: invert(100%);
background-color: transparent;
}
} /* end small screen changes */
/**********************************/

/* orange */
.mw-parser-output a.external {
	color: #ff9900;
}
#searchInput-container {
	background: #333;
}
#simpleSearch {
	border-color: #000;
	border-radius: 3px;
}
/* Dropdown box autocomplete must not be navy */
/* Search results suggestion box */
.suggestions-results,
 .suggestions-special {
    background-color: #000;
    border: solid 1px #aaa!important;
    color: #ccc;                        
}

div#simpleSearch,
.suggestions-special .special-label,
.suggestions-result,
.suggestions-special .special-query {
    color: #ccc!important;   
    background-color: #333!important;
}
#searchButton {
  border-color: transparent!important;
}

.mw-notification {
	background: #000;
	border-color: #333;
	border-radius: 5px;
	color: #999;
}
.mw-wiki-logo {
  background-size: contain;
}
#p-logo-text a, #p-logo-text {
  background-color: #000;
  color: #eeeeee;
  font-family: Oswald, sans-serif;
  font-style: italic;
  font-variant: small-caps;
}
#p-logo-text a::before { 
  content: "#";
  font-family: Oswald, sans-serif;
  font-style: italic;
  font-variant: normal;
  margin-right: -0.3em;
}

/* Dropdown box autocomplete must not be navy */
/* Search results suggestion box */
.suggestions-results,
 .suggestions-special {
    background-color: #000;
    border: solid 1px #aaa!important;
    color: #ccc;                        
}

/* addthis colors */
.addthis_default_style {
background-color: #000 !important;
border-color: #000;
color: #ccc;
}
#mw-header {
	width: 100%;
	max-width: 100%;
	padding: 0;
	position: static;
}
@media screen and (max-width: 850px) {
#menus-cover {
	background: #000;
}
}

#mw-content-block {
 background: #000;
 border-bottom: #000 solid 2px;
 border: none;
}

	
#footer-container, 
#footer-bottom, #mw-footer {
 background-color: #000;
 border: none;
}

 #mw-content-container {
border-bottom: #E7453A 5px solid;
background: #333;
}
.mw-body {
border: none;
color: #ccc;
}

#mw-site-navigation {
	background: #000;
}
#mw-content {
	background: #333;
	border: solid #000;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-bottomright: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}
#mw-page-header-links li.selected a {
	color: #999900;
}
#mw-related-navigation .sidebar-chunk {
	border: outset #333;
	box-shadow: 2px 2px 1px rgba(0,0,0,0.5);
	border-radius: 3px;
}

.color-left, .color-right {
background-color: #333;
}
.color-left-container, 
.color-right-container, 
.color-middle-container,
.color-middle {
background-color: #E7453A;
color: #333;
overflow: hidden;
}
.color-bar {
background: #E7453A ;
}


/* Table background colors and allow scroll off side */
table { 
    background-color: #333;
    color: #ccc;
    border-color: #000;
    overflow-x: auto;
}
th {
    background-color: #333;
    color: #ccc;
    border-color: #000;
}
tr, td {
    background-color: #333;
    color: #ccc; 
    border-color: #000;
}

/* Tabular tables - used on main page  */
table.wikitable {
  border-color: #000 !important;
  color: #ccc;
  text-align: center;
  background-color: #000;
  text-shadow: 2px 2px 4px #000;
}
.wikitable tr {
  background-color: #333;
  border-color: #000;
  color: #eee;
}
.wikitable > * > tr > th {
  background-color: #454544!important;
  border-color: #000;
  color: #fff!important;
}

.wikitable tr, .wikitable tr td {
  background-color: #333;
  border-color: #000 !important;
  color: #ccc;
}

/* JQuery white sort arrows  */
table.jquery-tablesorter th.headerSort {
    filter: invert(100%);
}
table.jquery-tablesorter th.headerSortUp {
    filter: invert(100%);
}
table.jquery-tablesorter th.headerSortDown {
    filter: invert(100%);
}
@media screen and (max-width: 1099px) and (min-width: 851px) {
#mw-related-navigation .sidebar-chunk {
	border-color: #333;
	box-shadow: 2px 2px 1px rgba(0,0,0,0.5);
}
}

#personal h2 {
	text-shadow: 1px 1px 0 #333;
}
#personal .dropdown {
 background: #333! important;
	border-color: #000;
}

/* transparent images need white background */
img { 
color: white;
background-color: #333;
border: 0;
}
/* Images - transparent images need white background */
.mw-body img {
    border: 1px solid #000;
    background-color: #FFF;
}

/* gallery image border */
.thumb, .image { 
margin: 0.5rem auto; 
background-color: #333 !important;
border: 1px solid #000 !important;
} 
/* class=transparent available for template icons */
.transparent
{
	background: #transparent;
}

hr {
    border-color: #000;
    background-color: #333;
}

/* bullet points within Portal gallery or Portal table sections */
ul.gallery, .gallerybox > div, td > ul, td > p, td div, div div {
color: #ccc; 
background-color: #333;
border-color: #333;
}

/* Visual editor colors */
.oo-ui-toolbar-bar {
 background: #000;
 color: #000;
 border: 0;
}

.oo-ui-clippableElement-clippable {
 background: #333;
 color: #fff;
}

/* Cite button text */ 
 .oo-ui-tool-title,
 .oo-ui-tool-accel  {
  color: #fff!important ;
}
.oo-ui-tool, .oo-ui-tool-link
 {
  background: #000;
  color: #fff!important;
}
.oo-ui-toolbar-bar {
 border: transparent ;
}
.oo-ui-buttonElement-button {
  background-color: #444; 
  color: #eee;
  border-color: #000;
}
/* end of visual editor colors  */

.codeEditor-status {
	color: #555;
}
.oo-ui-labelElement-label {
	text-shadow: 1px 2px #333;
}
#wpSave {
	text-shadow: 1px 1px 1px #000 !important
}
#mw-footer-container {
	background: #000;
}
fieldset {
  background: #333! important;
  border-color: #000;
}
input {
	background: #333;
	border-color: #000!important;
	border-radius: 2px;
	color: #ccc;
}
.mw-ui-button.mw-ui-progressive, .mw-ui-button.mw-ui-progressive:active, .mw-ui-button.mw-ui-progressive.mw-ui-checked, input[type='submit'], input[type='button'], button {
	border-color: #333!important;
	text-shadow: 0 0 0 #000 !important;
}
.oo-ui-flaggedElement-destructive {
	background: #000;
	border-color: #444;
	color: #FF4444 !important;
}
.oo-ui-flaggedElement-destructive:hover {
	background: #333;
	color: #CC0000 !important;
}
#searchInput {
	border: 0!important;
}
.oo-ui-textInputWidget input, .oo-ui-textInputWidget textarea {
	background-color: #333;
	color: #ccc;
}
#pagehistory li.selected {
	background-color: #555;
}
.warningbox {
	background: #333;
}
.mw-body-text {
  color: #ccc;
}
.mw-indicators {
/* symbols need filter */
 background-color: transparent!important;
 filter: invert(100%);
 border: none;
}

#mw-indicator-mw-helplink a {
 color: #000!important;
}
#mw-indicator-mw-helplink {
 background: inherit!important;
}
.mw-changeslist-legend {
 background: transparent;
 color: #ccc!important;
}

.mw-changeslist-legend-plusminus {
 color: #ccc;
}
.mw-plusminus-null { 
color: #bbb;
 } 
/* green */
.mw-plusminus-pos {
 color: #33aa33;
 }
.mw-plusminus-neg {
	color: #FF0000;
}
.autocomment {
  color: #ccc; 
} 
#mw-footer-container a:hover {
	color: #00ffff;
}
#mw-footer-container a:visited {
	color: #56b4e9;
}
.diff-addedline .diffchange {
	background: #ff4444;
}
.oo-ui-buttonElement.oo-ui-labelElement > input.oo-ui-buttonElement-button, .oo-ui-buttonElement.oo-ui-labelElement > .oo-ui-buttonElement-button > .oo-ui-labelElement-label {
	text-shadow: 0 0 0 #000 !important;
}
.oo-ui-labelElement-label {
	text-shadow: 0 0 0 #000
}
.oo-ui-panelLayout-expanded {
	background: #333;
}
.oo-ui-messageDialog-message {
	color: #999;
}
.oo-ui-buttonElement-frameless.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
	color: #999;
}
.oo-ui-messageDialog-actions-horizontal .oo-ui-actionWidget {
	border-right: 1px solid #000
}
.oo-ui-dialog-content > .oo-ui-window-body {
	outline: 1px solid #000;
}
.oo-ui-messageDialog-content > .oo-ui-window-foot {
	outline: 1px solid #000;
}

textarea[style] {
	background: #000 !important;
	color: #fff;
}
pre, .mw-code {
	background: #222;
	color: #B0B0B0;
	border: 1px solid #444;
}
.oo-ui-iconWidget.oo-ui-iconElement.oo-ui-iconElement-icon {
	background-color: #999;
	border: 1px solid #333;
}

/* search results had defaulted to black, and dark green for date, size under results  */
.searchResults {
  background-color: #333;
  color: #aaa;
}
.results-info, .mw-search-result-data {
  color: #aaa;
}
.shortcutbox { 
 background: #222;
} 

/* Portal box colors */
.boxbackground {
 background: #333!important;
 color: #ccc!important;
 border-color: #222!important;
 border-width: 2px;
}

.boxtitlecolor {
 color: #eee!important;
}

/* Color code snippets incl for errors  */
code { 
    background-color: transparent; 
    color: #000; 
    font-weight:bold;
}
.error code { 
    color: #FF4444; 
}

/* wikieditor controls */
.wikiEditor-ui .wikiEditor-ui-view {
	border: 1px solid #000;
}
.wikiEditor-ui .wikiEditor-ui-top {
	border-bottom: 1px solid #000;
}
.wikiEditor-ui,
.wikiEditor-section-main
 {
    background-color: #333!important;
   filter: none;
   color: #ccc ;
  }

/* wikieditor code, bold and italics */
.group-codeeditor-main,
.group.group-format,
.group-size, .group-format span,
.group-insert span
 {
  background-color: #fff!important;
  color: #333!important;
  filter: invert(100%)!important;
}

/* wikieditor background and icons without text */
.group {
  background-color: #000!important;
  color: #fff!important;  
}

.wikiEditor-ui-toolbar div.tabs a:link,
.wikiEditor-ui-toolbar div.tabs a:visited,
.section-characters div.index div {
 background-color: #000;
 color: #fff;
 filter: none!important;
}

.wikiEditor-ui-toolbar,
.toolbar, .sections, .tabs, .tab {
 background-color: #000!important;
 color: #000!important;
 border-color: #000;
}

.oo-ui-widget {
 background: #333;
 color: #eee;
}
/* wikieditor tools end */

/* Recent changes title area */
fieldset {
 background-color: #333;
 color: #fff;
 border-color: #333;
}

/* add to existing mobile section margins */
#mw-body, #mw-content {
 padding-left: 1px;
 padding-right: 1px;
}
legend {
    border-color: #000;
    color: #ccc!important;
    background-color: #333!important;
}
legend a {
    .current: #eee!important;
    :link: #eee!important;
    :visited: #eee!important;
}
/* License images */
.layouttemplate tr td img,
.layouttemplate tr td p img {
 filter: invert(100%);
 background: transparent;
 border-color: transparent;
}

.suggestions-query, .suggestions-special {
 background-color: #222!important;
}

/* end of dark CSS Oct 15 2019*/