Difference between revisions of "User:Certified nqh/common.css"

Explain xkcd: It's 'cause you're dumb.
Jump to: navigation, search
 
(15 intermediate revisions by the same user not shown)
Line 1: Line 1:
/*
+
/* NQH's totally cool and amazingly radical dark mode */
████████╗    ██╗    ██╗    ██████╗        ██╗              ████╗      ██████╗    ██╗    ██╗
+
/* Licensed CC0-1.0, no rights reserved. */
██╔═════╝    ╚═██╗ ██╬═╝    ██╔═══██╗      ██║            ██╬═══██╗    ╚═██╔═╝    ████╗  ██║
 
██████╗        ╚═██╬═╝      ██████╬═╝      ██║            ████████║      ██║      ██╔═██╗ ██║
 
██╔═══╝        ██╬═██╗      ██╔═══╝        ██║            ██╔═══██║      ██║      ██║ ╚═████║
 
████████╗    ██╬═╝ ╚═██╗    ██║            ████████╗      ██║  ██║    ██████╗    ██║  ╚═██║
 
╚═══════╝    ╚═╝    ╚═╝    ╚═╝            ╚═══════╝      ╚═╝  ╚═╝    ╚═════╝    ╚═╝    ╚═╝         
 
  
██╗    ██╗                    ██╗  ██╗                    ██████╗                    ██████╗
+
/* Sets everything to dark background. */
╚═██╗ ██╬═╝                    ██║ ██╬═╝                  ██╬═════╝                    ██╔═══██╗
+
body * {background-color: #111 !important; color: #DDD !important;}
  ╚═██╬═╝                      ████╬═╝                    ██║                          ██║  ██║
+
div.mw-body, div.mw-body * {background-color: #222 !important;}
  ██╬═██╗                      ██╔═██╗                    ██║                          ██║  ██║
 
██╬═╝ ╚═██╗                    ██║ ╚═██╗                  ╚═██████╗                    ██████╬═╝
 
╚═╝    ╚═╝                    ╚═╝  ╚═╝                    ╚═════╝                    ╚═════╝
 
  
██╗  ██╗ ██╗    ██╗  ████╗  ████████╗ ████████╗ ██████╗  ██████╗ ██████╗  ████╗  ██╗
+
/* Vector */
██║  ██║ ████╗  ██║ ██╬═══██╗ ██╔═════╝ ██╔═════╝ ╚═██╔═╝ ██╬═════╝ ╚═██╔═╝ ██╬═══██╗ ██║
 
██║  ██║ ██╔═██╗ ██║ ██║  ██║ ██████╗  ██████╗    ██║  ██║        ██║  ████████║ ██║
 
██║  ██║ ██║ ╚═████║ ██║  ██║ ██╔═══╝  ██╔═══╝    ██║  ██║        ██║  ██╔═══██║ ██║
 
╚═████╬═╝ ██║  ╚═██║ ╚═████╬═╝ ██║      ██║      ██████╗ ╚═██████╗ ██████╗ ██║  ██║ ████████╗
 
  ╚═══╝  ╚═╝    ╚═╝  ╚═══╝  ╚═╝      ╚═╝      ╚═════╝  ╚═════╝ ╚═════╝ ╚═╝  ╚═╝ ╚═══════╝
 
  
██████╗    ████╗  ██████╗  ██╗  ██╗                ██╗    ██╗  ████╗  ██████╗  ████████╗
+
.mw-wiki-logo {background-color: #00000000 !important; filter: invert(100%);}
██╔═══██╗ ██╬═══██╗ ██╔═══██╗ ██║ ██╬═╝                ████╗ ████║ ██╬═══██╗ ██╔═══██╗ ██╔═════╝
 
██║  ██║ ████████║ ██████╬═╝ ████╬═╝                  ██╔═██╬═██║ ██║  ██║ ██║  ██║ ██████╗
 
██║  ██║ ██╔═══██║ ██╔═══██╗ ██╔═██╗                  ██║ ╚═╝ ██║ ██║  ██║ ██║  ██║ ██╔═══╝
 
██████╬═╝ ██║  ██║ ██║  ██║ ██║ ╚═██╗                ██║    ██║ ╚═████╬═╝ ██████╬═╝ ████████╗       
 
╚═════╝  ╚═╝  ╚═╝ ╚═╝  ╚═╝ ╚═╝  ╚═╝                ╚═╝    ╚═╝  ╚═══╝  ╚═════╝  ╚═══════╝
 
  
BY: SomeoneIGuess
+
/* Monobook */
Developed for the STYLUS extension
 
Can be used on your theme's CSS page, but this will not affect specific pages (namely Special:Preferences)
 
https://add0n.com/stylus.html
 
  
 +
div#column-one > div#p-cactions > div.pBody > ul > li > a {background-color: #222 !important;}
  
CURRENTLY MADE ONLY FOR USE ON VECTOR
+
/* Modern */
OTHER SKINS MAY BE MADE EVENTUALLY, BUT VERY UNLIKELY
 
IF YOU ABSOLUTELY CANNOT USE VECTOR, MONOBOOK IS THE LEAST BROKEN
 
  
WORDS OF CAUTION:
+
div#mw_header, div#mw_header h1#firstHeading {background-color: #000 !important;}
    MAIN PAGE WILL LIKELY APPEAR VERY, VERY BRIGHT
+
div#mw_content {background-color: #222 !important;}
        THESE CANNOT BE CHANGED WITHOUT MAJOR EDITS
 
    DOES NOT AFFECT USERBOXES
 
    LIST MARKERS CANNOT BE CHANGED
 
  
THIS WILL BE UPDATED OCCASIONALLY, SO MAKE SURE YOU HAVE THE LATEST VERSION
+
/* Cologne blue */
  
VERSION: THE FINAL VERSION, REVISION 1
+
/* Diff. */
 +
td.diff-context, td.diff-context * {color: #777 !important; border-color: #333 !important;}
 +
td.diff-deletedline {border-color: #F33 !important;}
 +
td.diff-addedline {border-color: #3F3 !important;}
 +
del.diffchange-inline {color: #F55 !important;}
 +
ins.diffchange-inline {color: #5F5 !important;}
  
PROTECTED UNDER CC-BY-NC 4.0
+
/* Numbers in history view. */
    You may copy, share, edit, and use this code in any way you wish
+
span.mw-plusminus-pos {color: #5F5 !important;}
    You may NOT claim the (original) code was created by anyone other than the original creator (SomeoneIGuess)
+
span.mw-plusminus-neg {color: #F55 !important;}
    You may NOT share this under any license besides CC-BY-NC
+
strong.mw-plusminus-pos {color: #0F0 !important; font-size: 1.2em;}
    You may NOT restrict this code from others in any way
+
strong.mw-plusminus-neg {color: #0F0 !important; font-size: 1.2em;}
    You may NOT use this code in ANY way that involves ANY form of payment
 
    You MUST provide proper credit to the original creator (SomeoneIGuess)
 
    https://creativecommons.org/licenses/by-nc/4.0/deed.en
 
*/
 
  
#mw-content-text p, .mw-body-content h1, .mw-body-content h2, .mw-body-content h3, .mw-body-content h4, .mw-body-content h5, .mw-body-content h6, .mw-content-ltr dd, .mw-content-rtl .mw-content-ltr dd, .mw-body .firstHeading, div#footer ul li, .results-info, .searchresult, li, table, div#mw-panel div.portal h3, .mw-content-ltr .tocnumber, legend, label, #contentSub, #contentSub2, dt, blockquote, .mw-body, .parsoid-body, div.vectorMenu h3 span, .search-types .current a, .postedit, .diff td div, code, pre, .mw-code, .mw-editform #wpTextbox1, .oo-ui-textInputWidget input, .oo-ui-textInputWidget textarea
+
/* Links. */
/* DEFAULT FONT COLOR */
+
a[href$="redlink=1"] {color: #F00 !important; text-decoration: line-through !important;}
{ color: #d1d1d7 !important }
+
a:not([href$="redlink=1"]) {color: #88F !important;}
 
+
a:visited:not([href$="redlink=1"]) {color: #AAF !important;}
.htmlform-tip
+
a:hover:not([href$="redlink=1"]) {color: #AAF !important; text-decoration: underline !important; font-weight: bold !important;}
/* DARKER FONT COLOR
+
a:active:not([href$="redlink=1"]) {color: #FFF !important; text-decoration: underline !important; font-weight: bold !important;}
  DOES NOT AFFECT CERTAIN PARTS OF COMIC PAGES
 
  ONLY USED ON Special:Preferences */
 
{ color: #808080 !important }
 
 
 
table.wikitable > tr > th, table.wikitable > * > tr > th, .navbox th, .navbox-title, .infobox th, .mw_metadata td, .mw_metadata th, #filetoc, .oo-ui-textInputWidget input, .oo-ui-textInputWidget textarea, .mw-editform #wpTextbox1
 
/* WIKITABLE STUFF, ALSO THE EDITOR
 
  PAGE FOR TESTING: 2840 */
 
{ background-color: #1e1e1e !important }
 
 
 
#mw-panel
 
/* DARK BACKGROUND COLOR FOR LEFT BAR OF WEBSITE
 
  Z-index MUST be 1, or else the Explain XKCD logo will be cut off
 
  Heavily reccomended to change the color below to the same color */
 
{ background-color: #2a2a2b; z-index: 1 !important }
 
 
 
 
 
div#mw-head, div#footer #footer-info li, div#footer, body, .mw-editform .editOptions, .mw-search-profile-tabs, .notice_tpl, #catlinks, .client-js #preferences, div.thumbinner, div.vectorMenu li > a, .mw-notification, table.wikitable, table.contributionscores td, code, table.wikitable > * > tr > td, pre, .mw-code, .comic-content, .comic-discussion, .infobox
 
/* DARK BACKGROUND
 
  AFFECTS SIDEBAR, TOP BAR, WIKITABLES, EDITOR, AND MORE */
 
{ background-color: #2a2a2b !important }
 
 
 
.mw-body, div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited, div.vectorTabs span > a, #pagehistory li.selected
 
/* MAIN CONTENT BACKGROUND */
 
{ background-color: #353638 !important }
 
 
 
#toc, .toc, .mw-warning, .toccolours, .navbox-even
 
/* BRIGHT BACKGROUND COLOR */
 
{ background-color: #444 !important }
 
 
 
.mw-body, fieldset
 
/* CHANGES COLOR OF LEFT EDGE OF MAIN CONTENT
 
  Heavily reccomended to change the color below to the same color */
 
{ border-color: #8f93d7 !important }
 
 
 
.tvtrope, .ratwiki
 
{ background: #4d4e4f !important }
 
 
 
div.vectorTabs
 
/* CHANGES BORDER COLOR OF TOP TABS */
 
{ background: #8f93d7 !important }
 
 
 
a, div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited, div.vectorTabs span > a, .mw-body-content a.extiw, .mw-body-content a.extiw:active, .mw-body-content a.external, div#mw-panel div.portal div.body ul li a, div.vectorMenu li a
 
/* LINK */
 
{ color: #4bc1db }
 
 
 
.mw-body-content a.extiw:visited, a:visited
 
/* VISITED LINK */
 
{ color: #ae78ec !important }
 
 
 
#p-personal, a.new, .new:visited, div.vectorTabs li.new a, div.vectorTabs li.new a:visited
 
/* REDLINK */
 
{ color: #ce4949 !important }
 
 
 
.mw-plusminus-pos
 
/* PAGE SIZE INCREASED */
 
{ color: #32a627 !important }
 
 
 
.mw-plusminus-neg
 
/* PAGE SIZE REDUCED */
 
{ color: #c62c2c !important }
 
 
 
#mw-page-base
 
/* THIS MAY SEEM POINTLESS, BUT THIS GETS RID OF UGLY WHITE BARS AROUND CERTAIN PAGES */
 
{ background: #fff0 !important }
 
 
 
div.vectorTabs li.selected a, div.vectorTabs li.selected a:visited, div.vectorTabs span > a, #mw-head
 
/* KEEPS THE TOP TABS VISIBLE AND CLICKABLE */
 
{ z-index: 1 }
 
 
 
#p-logo a, img.tex, .postedit:after
 
/* INVERT COLORS OF EXPLAIN XKCD LOGO AND MATH TERM THINGS AS SEEN IN 2295 */
 
{ filter: invert(1) !important }
 
 
 
#siteSub
 
/* "It's 'cause you're dumb." */
 
{ color: #f9f9f9 !important }
 
 
 
div#mw-panel
 
/* SHORTENS LEFT SIDEBAR SO IT DOESNT GO OVER THE MAIN CONTENT, EVEN ON SPECIAL PAGES */
 
{ width: 10.5em !important }
 
 
 
.warningbox
 
/* MAKES WARNING BOX LESS BRIGHT */
 
{ background-color: #666446 !important; border-color: #4d4a2b !important }
 
 
 
.diff-deletedline
 
/* BORDER OF DELETED LINES IN REVISION DIFF PAGES */
 
{ border-color: #a64848 }
 
 
 
.diff-deletedline .diffchange
 
/* HIGHLIGHT OF DELETED TEXT IN REVISION DIFF PAGES */
 
{ background: #a64848 }
 
 
 
.diff-addedline
 
/* BORDER OF ADDED LINES IN REVISION DIFF PAGES */
 
{ border-color: #267d30 }
 
 
 
.diff-addedline .diffchange
 
/* HIGHLIGHT OF ADDED TEXT IN REVISION DIFF PAGES */
 
{ background: #267d30 }
 
 
 
.diff-context, code
 
/* BORDER OF UNCHANGED LINES IN REVISION DIFF PAGES (AND ALSO CODE SEGMENTS) */
 
{ border-color: #1e1e1e }
 
 
 
.diff-context
 
/* BACKGROUND OF UNCHANGED LINES IN REVISION DIFF PAGES */
 
{ background: #353638 }
 
 
 
/*
 
CHANGELOG (SINCE 10192023-E)
 
 
 
THE FINAL VERSION, REVISION 1: Quick hotfix for Infocards!
 
THE FINAL VERSION, REVISION 0: DISCUSSION TEMPLATE NOW WORKS! ONLY TWO OBJECTS TO CONTEND WITH: THE MAIN PAGE AND LIST BULLETS
 
11022023-A: THE DOUBLE TABLE BUG IS FIXED! HUGE THANKS TO THEUSAF
 
10202023-F: Added support for changing the highlight of TVTropes and Rational Wiki links
 
10202023-E: Editor support
 
10202023-D: Fixed sidebar going over the main content on preferences page for what feels like the 5th time
 
10202023-C: Accidentally added support for CSS pages and large code blocks
 
10202023-B: Added first part of fix for cases as seen in 1461 (currently still works as it did before this version, waiting on a change to a certain template)
 
10202023-A: File page support
 
10192023-G: Added support for <code>
 
10192023-F: Added support for Revision Difference screen
 
10192023-E: Slight change to topmost comment
 
 
 
*/
 

Latest revision as of 20:22, 6 March 2025

/* NQH's totally cool and amazingly radical dark mode */
/* Licensed CC0-1.0, no rights reserved. */

/* Sets everything to dark background. */
body * {background-color: #111 !important; color: #DDD !important;}
div.mw-body, div.mw-body * {background-color: #222 !important;}

/* Vector */

.mw-wiki-logo {background-color: #00000000 !important; filter: invert(100%);}

/* Monobook */

div#column-one > div#p-cactions > div.pBody > ul > li > a {background-color: #222 !important;}

/* Modern */

div#mw_header, div#mw_header h1#firstHeading {background-color: #000 !important;}
div#mw_content {background-color: #222 !important;}

/* Cologne blue */

/* Diff. */
td.diff-context, td.diff-context * {color: #777 !important; border-color: #333 !important;}
td.diff-deletedline {border-color: #F33 !important;}
td.diff-addedline {border-color: #3F3 !important;}
del.diffchange-inline {color: #F55 !important;}
ins.diffchange-inline {color: #5F5 !important;}

/* Numbers in history view. */
span.mw-plusminus-pos {color: #5F5 !important;}
span.mw-plusminus-neg {color: #F55 !important;}
strong.mw-plusminus-pos {color: #0F0 !important; font-size: 1.2em;}
strong.mw-plusminus-neg {color: #0F0 !important; font-size: 1.2em;}

/* Links. */
a[href$="redlink=1"] {color: #F00 !important; text-decoration: line-through !important;}
a:not([href$="redlink=1"]) {color: #88F !important;}
a:visited:not([href$="redlink=1"]) {color: #AAF !important;}
a:hover:not([href$="redlink=1"]) {color: #AAF !important; text-decoration: underline !important; font-weight: bold !important;}
a:active:not([href$="redlink=1"]) {color: #FFF !important; text-decoration: underline !important; font-weight: bold !important;}