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

Explain xkcd: It's 'cause you're dumb.
Jump to: navigation, search
(Undo revision 327013 by Certified nqh (talk))
Line 1: Line 1:
/*
+
/* This style sheet works with all skins. */
████████╗    ██╗    ██╗    ██████╗        ██╗              ████╗      ██████╗    ██╗    ██╗
+
/* Made by NQH */
██╔═════╝    ╚═██╗ ██╬═╝    ██╔═══██╗      ██║            ██╬═══██╗    ╚═██╔═╝    ████╗  ██║
 
██████╗        ╚═██╬═╝      ██████╬═╝      ██║            ████████║      ██║      ██╔═██╗ ██║
 
██╔═══╝        ██╬═██╗      ██╔═══╝        ██║            ██╔═══██║      ██║      ██║ ╚═████║
 
████████╗    ██╬═╝ ╚═██╗    ██║            ████████╗      ██║  ██║    ██████╗    ██║  ╚═██║
 
╚═══════╝    ╚═╝    ╚═╝    ╚═╝            ╚═══════╝      ╚═╝  ╚═╝    ╚═════╝    ╚═╝    ╚═╝         
 
  
██╗    ██╗                    ██╗  ██╗                    ██████╗                    ██████╗
+
/* Set text color and BG color */
╚═██╗ ██╬═╝                    ██║ ██╬═╝                  ██╬═════╝                    ██╔═══██╗
+
:not(body, a) {color: #CCC !important; border-width: 1px !important; border-color: #222 !important;}
  ╚═██╬═╝                      ████╬═╝                    ██║                          ██║  ██║
+
div#mw_content {background-color: #111 !important;}
  ██╬═██╗                      ██╔═██╗                    ██║                          ██║  ██║
+
div.mw-body, div.mw-body * {background-color: #111 !important;}
██╬═╝ ╚═██╗                    ██║ ╚═██╗                  ╚═██████╗                    ██████╬═╝
+
:not(span) {background-color: #020304 !important; font-family: Courier;}
╚═╝    ╚═╝                    ╚═╝  ╚═╝                    ╚═════╝                    ╚═════╝
 
  
██╗  ██╗ ██╗    ██╗  ████╗  ████████╗ ████████╗ ██████╗  ██████╗ ██████╗  ████╗  ██╗
+
/* 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;}
  
██████╗    ████╗  ██████╗  ██╗  ██╗                ██╗    ██╗  ████╗  ██████╗  ████████╗
+
/* History */
██╔═══██╗ ██╬═══██╗ ██╔═══██╗ ██║ ██╬═╝                ████╗ ████║ ██╬═══██╗ ██╔═══██╗ ██╔═════╝
+
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-pos {color: #0F0 !important; font-size: 1.2em;}
╚═════╝  ╚═╝  ╚═╝ ╚═╝  ╚═╝ ╚═╝  ╚═╝                ╚═╝    ╚═╝  ╚═══╝  ╚═════╝  ╚═══════╝
 
  
BY: SomeoneIGuess
+
/* I use Courier font, make the placeholder text in the search box not real. */
Developed for the STYLUS extension
+
input[name="search"]::placeholder {opacity: 0 !important;}
Can be used on your theme's CSS page, but this will not affect specific pages (namely Special:Preferences)
 
https://add0n.com/stylus.html
 
  
UPCOMING FEATURES
+
/* I don't even use Vector. */
    Main Page compatibility (unlikely)
+
.mw-wiki-logo {background-color: white !important; filter: invert(100%);}
    Discussion Template compatibility (unlikely)
 
    Fix background when two tables are next to each other (fix mostly built in, requires Template:Comic to be changed - currently still works as it did before)
 
  
 
+
a[href$="redlink=1"] {text-decoration: line-through !important; color: #922 !important;}
CURRENTLY MADE ONLY FOR USE ON VECTOR
+
a:not([href$="redlink=1"]) {color: #2C2 !important;}
OTHER SKINS MAY BE MADE EVENTUALLY, BUT VERY UNLIKELY
+
a:visited:not([href$="redlink=1"]) {color: #5C5 !important;}
IF YOU ABSOLUTELY CANNOT USE VECTOR, MONOBOOK IS THE LEAST BROKEN
+
a:hover:not([href$="redlink=1"]) {font-weight: bold; text-decoration: underline overline !important;}
 
+
a:active:not([href$="redlink=1"]) {color: #FF0 !important;}
WORDS OF CAUTION:
 
    MAIN PAGE AND DISCUSSION TEMPLATE WILL LIKELY APPEAR VERY, VERY BRIGHT
 
    RATIONAL WIKI AND TVTROPES LINKS WILL HAVE A VERY BRIGHT HIGHLIGHT
 
        THESE CANNOT BE CHANGED WITHOUT MAJOR EDITS TO THE TEMPLATES (sorry)
 
    DOES NOT AFFECT USERBOXES
 
    LIST MARKERS CANNOT BE CHANGED
 
 
 
THIS WILL BE UPDATED OCCASIONALLY, SO MAKE SURE YOU HAVE THE LATEST VERSION
 
 
 
VERSION: 10202023-F
 
 
 
PROTECTED UNDER CC-BY-NC 4.0
 
    You may copy, share, edit, and use this code in any way you wish
 
    You may NOT claim the (original) code was created by anyone other than the original creator (SomeoneIGuess)
 
    You may NOT share this under any license besides CC-BY-NC
 
    You may NOT restrict this code from others in any way
 
    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
 
/* DEFAULT FONT COLOR */
 
{ color: #d1d1d7 !important }
 
 
 
.htmlform-tip
 
/* DARKER FONT COLOR
 
  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, table, pre, .mw-code
 
/* DARK BACKGROUND
 
  AFFECTS SIDEBAR, TOP BAR, WIKITABLES, EDITOR, AND MORE
 
  WILL LIKELY NOT WORK AS INTENDED IF TWO TABLES ARE NEXT TO EACH OTHER (SUCH AS IN 1461)
 
  BUT THIS IS A NECESSARY SACRIFICE FOR NOW, AS OTHERWISE YOU CANNOT CHANGE THE COLOR OF THE BOX THE COMIC IS IN
 
 
 
  ADDENDUM: A FIX FOR THIS CAN BE MADE, BUT ONE MAJOR CHANGE NEEDS TO BE MADE:
 
  A "bodyclass" PARAMETER CAN BE SET FOR THE COMIC TEMPLATE (Template:Comic), WHICH, IF SET TO A FIXED OR DEFAULT VALUE, WILL MAKE IT POSSIBLE TO FIX THIS BUG PERMANENTLY
 
  UNFORTUNATELY, THIS WILL ONLY BE POSSIBLE IF AN ADMIN CHOOSES TO DO IT OR I BECOME AN ADMIN AND MANAGE TO DO IT OR SOMETHING */
 
{ 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)
 
 
 
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
 
 
 
*/
 

Revision as of 14:37, 24 October 2023

/* This style sheet works with all skins. */
/* Made by NQH */

/* Set text color and BG color */
:not(body, a) {color: #CCC !important; border-width: 1px !important; border-color: #222 !important;}
div#mw_content {background-color: #111 !important;}
div.mw-body, div.mw-body * {background-color: #111 !important;}
:not(span) {background-color: #020304 !important; font-family: Courier;}

/* 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;}

/* History */
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-pos {color: #0F0 !important; font-size: 1.2em;}

/* I use Courier font, make the placeholder text in the search box not real. */
input[name="search"]::placeholder {opacity: 0 !important;}

/* I don't even use Vector. */
.mw-wiki-logo {background-color: white !important; filter: invert(100%);}

a[href$="redlink=1"] {text-decoration: line-through !important; color: #922 !important;}
a:not([href$="redlink=1"]) {color: #2C2 !important;}
a:visited:not([href$="redlink=1"]) {color: #5C5 !important;}
a:hover:not([href$="redlink=1"]) {font-weight: bold; text-decoration: underline overline !important;}
a:active:not([href$="redlink=1"]) {color: #FF0 !important;}