Wikipedia:Wikipedia Signpost/Templates/external.css

/* This is the stylesheet used at signpost.news. It does a lot of stuff that would look like garbage or straight-up not work on Wikipedia.

See also Wikipedia:Wikipedia_Signpost/Templates/master.css which is what's used onwiki.

Generally speaking, we should try to eliminate inline styling in Signpost stuff -- instead of styles, elements should be written to have classes, and those classes should be styled in master, invoked with TemplateStyles. When migrating inline styling here, also put it in master.css, so that the styles work on signpost.news and on Wikipedia. They may require some adaptation to look good there, but that can be done after they're moved to the master stylesheet. When migrating something into here, it's extremely helpful to note where it came from, and what template uses the class. Otherwise, this stylesheet risks turning into a monstrosity over the course of years/decades.

/* New stuff, 2023-08-24 */ a, a:visited, .a, .a:visited { color: #72777d; text-decoration: none; }

.signpost-sidebar-navigation, .signpost-snippet-download, .signpostshare, .mw-editsection { display:none; }

.mw-inputbox-centered { display: flex; justify-content: center; }

.talkquote, blockquote { background-color: #e0ddc2 !important; }

.talkquote { border-left: 3px solid #c7c5ad !important; } /* 2023-08-24, for archives */

.signpost-headline, .signpost-headline a, .signpost-headline a:visited { font-family: 'Goblin One', serif; text-shadow: 0 -1px 0 #eee; color: #777; font-weight: bold; font-size: 55% !important; }

.signpost-segment, .signpost-segment a, .signpost-segment a:visited { font-family: 'Goblin One', serif !important; text-shadow: 0 -1px 0 #eee; color: #777; font-weight: bold; font-size: 110% !important; }

.signpost-subheadline, .signpost-subheadline a, .signpost-subheadline a:visited { font-family: 'Yeseva One', serif; color: black; text-decoration: none; font-weight: bold; clear: both; text-decoration: none; }

.signpost-signpost-article-title, .signpost-signpost-article-title a, .signpost-signpost-article-title a:visited { /* Is this a real class? Huh? */   font-size: 120%; font-family: 'Yeseva One', serif !important; color: black; text-decoration: none; font-weight: bold; clear: both; text-decoration: none; }

.signpost-article-title, .signpost-article-title a, .signpost-article-title a:visited { /* Article titles on actual article pages, afaik */ font-size: 250%; margin: 0.3em; margin-left: 0.1em; font-family: 'Yeseva One', serif !important; color: black; text-decoration: none; font-weight: bold; clear: both; text-decoration: none; }

.signpost-segment { /* AFAIK this is just for the "news and notes" etc at the top of articles */ margin-top: 1em; }

.mw-headline, .mw-headline a, .mw-headline a:visited { font-family: 'Yeseva One', serif !important; color: black; text-decoration: none; font-weight: bold; clear: both; text-decoration: none; }

.signpost-author { font-family: 'Anybody'; }

/* from Wikipedia:Wikipedia Signpost/Templates/Signpost-header/styles.css */ body { background-color: #f7f2d5; text-decoration: none; }

.mw-parser-output { background-color: #f7f2d5; }

.signpost-header { box-sizing: border-box; padding: 1em 2vw; border-bottom: 3px double #999; border-top: 3px double #bbb; background-color: #f7f2d5 !important; }

.signpost-header-heading { margin: 1em 0; text-align: center; }

.signpost-header-subheadings { font-family: Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif; font-size: 100%; background-color: transparent; border: none; color: #666; margin-left: auto; margin-right: auto; text-align: center; }

.signpost-header-subheadings:after { content: ""; display: table; clear: both; }

.signpost-header-volume, .signpost-header-volume a, .signpost-header-volume a:visited { font-family: 'Stint Ultra Expanded', serif; text-transform: uppercase; width: 33%; float: left; text-align: left; margin-top: 3px; font-weight: bold; color: #666666; }

.signpost-header-issue, .signpost-header-issue a, .signpost-header-issue a:visited { font-family: 'Stint Ultra Expanded', serif; text-transform: uppercase; width: 33%; float: right; text-align: right; margin-top: 3px; font-weight: bold; color: #666666; }

.signpost-header-date { font-family: 'Stint Ultra Expanded', serif; white-space: nowrap; line-height: 120%; font-size: 155%; color: #333; }

/* from Template:Signpost/snippet/styles.css */

.signpost-snippet { page-break-inside: avoid; break-inside: avoid; clear: both; padding: 7px 0; }

.signpost-snippet > div { font-family: 'Times New Roman', Georgia, Palatino, 'Palatino Linotype', Times, serif; border-bottom: 1px solid #aaa; margin-bottom: 5px; font-size: 140%; line-height: 1.4; }

.signpost-snippet-department { font-family: 'Goblin One', serif; text-shadow: 0 -1px 0 #eee; color: #f7f2d5 !important; font-weight: bold; font-size: 55%; }

.signpost-snippet-title, .signpost-snippet-title a, .signpost-snippet-title a:visited { font-family: 'Yeseva One', serif; color: black; text-decoration: none; font-weight: bold; clear: both; text-decoration: none; }

.signpost-snippet-hook { font-family: 'Newsreader'; font-size: 100%; font-weight: bold; }

.signpost-snippet-continued, .signpost-snippet-continued a, .signpost-snippet-continued a:visited { font-size: 80%; white-space: nowrap; color: #72777d; text-decoration: none; font-family: 'Yeseva One'; }

.signpost-snippet-download, .signpost-snippet-download a, .signpost-snippet-download a:visited { font-size: 80%; text-shadow: 0px -1px 0px #EEE; color: #72777d; text-decoration: none; font-family: 'Yeseva One'; }

/* from Wikipedia:Wikipedia Signpost/Template:Signpost-footer/styles.css */

.signpost-footer { padding-top: 2em; } .signpost-issue-navigation, .signpost-ticker, .signpost-linkbar { box-sizing: border-box; clear: both; font-family: Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif; width: 100%; } .signpost-issue-navigation { font-size: 116%; display: flex; flex-direction: row; flex-wrap: wrap; font-style: italic; gap: 1em; justify-content: space-between; padding: 0 2vw; /* Use margin, as we do not want this element to claim vert. space when empty */ margin: 0.5em 0; } .signpost-issue-nav-casing { font-size: 80%; text-transform: uppercase; } .signpost-ticker { border-top: 3px double #BBB; color: #333; font-size: 110%; padding: 5px 2vw; text-align: center; text-transform: uppercase; } .signpost-linkbar { border-top: 1px solid #999; padding: 3px 2vw; } .signpost-linkbar > div { color: #444; display: flex; flex-flow: row wrap; flex-wrap: wrap; justify-content: center; font-size: 90%; margin: 0 auto; max-width: 80em; text-align: center; } .signpost-linkbar > div > div { /* Inline fallback for non flex browsers */ display: inline-block; flex: 1 1 auto; min-width: 6em; }

/* from Template:Signpost-main-page-body-begin/styles.css*/

.signpost-main-page-body { box-sizing: border-box; column-width: 15em; column-gap: 5em; max-width: 70em; margin: 15px auto; padding: 0 2vw; }

/* New */

.signpost-subheadline { font-weight: bold; clear: both; text-decoration: none; }

.signpost-subheadline a, .signpost-subheadline a:visited { color: black; text-decoration: none; } /* New, 2023 Dec 3 */ .signpost-inthisissue { float: right; margin:      3em; padding:     1em; padding-left: 2em; border: 1px solid #72777d; } .ext-discussiontools-init-replylink-reply, .ext-discussiontools-init-replylink-bracket, .ext-discussiontools-init-replylink-bracket { display: none; } .signpost-article-footer { max-width: 80em; /* This is what the style for signpost-article is */ margin: 0 auto; } .wp-signpost-article-header-2 { max-width: 80em; /* This is what the style for signpost-article is */ margin: 0 auto; } .signpost-comments-disclaimer { /* background-color: rgba(0, 0, 0, 0.1); */ } .signpost-sidebar { width: 300px; float: right; clear: right; padding-left: 20px; margin-right: 1em; }

.wikitable { outline: 2px solid #72777d; }

.wikitable th { background: rgba(0, 0, 0, 0.1); } .wikitable th, .wikitable td { outline: 1px solid #72777d; padding: 0.1em; }

/* Jacked from Wikipedia:Wikipedia Signpost/Templates/Article list maker/Pretty item/Tag/styles.css, 2023-12-03 */

.wp-signpost-alm-pretty-item { font-size: 150%; line-height: 150%; padding-bottom: 15px; padding-right: 20px; color: #333; width: 20em; box-sizing: border-box; }

.wp-signpost-alm-pretty-item-subpage { font-family: 'Goblin One', serif; text-shadow: 0 -1px 0 #eee; color: #777; text-transform: uppercase; font-size: 50% !important; font-weight: bold; }

.wp-signpost-alm-pretty-item-subpage::after { /* Grotesque hack, please murder me if you have to fix this later */ content: "\A"; white-space: pre; }

.wp-signpost-alm-pretty-item-title a { font-family: 'Yeseva One', serif !important; color: black !important; font-weight: bold; }

.wp-signpost-alm-pretty-item-date { font-family: 'Anybody'; }

.signpost-tagpage-headline { text-align: center; display: block; font-size: 300%; padding: 0.5em; display: none; }

.signpost-tagpage-container { width: 80%; margin: 0 auto; }

.gallerybox { display: inline-block; } .mw-gallery-packed { display: block; margin: 2px; padding: 2px; text-align: center; } .gallerytext { font-family: 'Anybody'; }

.signpost-comments-add, .signpost-comments-add-big { font-family: 'Stint Ultra Expanded', serif; float:right; } .signpost-comments-empty { font-family: 'Stint Ultra Expanded', serif; }

.signpost-comments-disclaimer { font-family: 'Anybody'; }

.signpost-succession { font-family: 'Goblin One', serif; }

.signpost-header-date{ display:block; }

.signpost-linkbar { font-family: 'Stint Ultra Expanded', serif; } .mw-halign-center { text-align: center; } .center { text-align: center; }

/* From Template:Signpost/Crossword/styles.css, 2023-12-11 and 2024-07-04 */

.signpost-crossword { outline: 4px solid rgb(64, 64, 64); border: 1px solid rgba(64, 64, 64, 1); border-collapse: collapse; margin: 1em 0; } .signpost-crossword-cell { padding: 0; margin: 0; border: 0; height: 2.5em; width: 2.5em; background:rgba(255, 255, 255, 1); outline: 1px solid rgba(64, 64, 64, 1); vertical-align: top; } .signpost-crossword-null { padding: 0; margin: 0; border: 0; height: 2.5em; width: 2.5em; background:rgba(64, 64, 64, 1); outline: 1px solid rgba(64, 64, 64, 1); } .signpost-crossword-bgtext-wrap { position: relative; padding-left: 1.5px; } .signpost-crossword-bgtext-span { font-size: 70%; vertical-align: top; } .signpost-crossword-inputbox { position: absolute; top: 0; left: 0; outline: 1px solid rgba(64, 64, 64, 1); } .signpost-crossword-inputbox .commentboxInput{ height: 2.5em; width: 2.5em; color: rgba(0, 0, 0, 1); background: rgba(255, 255, 255, 0.5); text-transform: uppercase; } .signpost-crossword-inputbox .cdx-button--action-progressive { display: none; }

.signpost-crossword-cluetable { border-collapse: collapse; }

.signpost-crossword-cluetable tr { border-bottom: 0.1em solid rgba(128, 128, 128, 0.3); vertical-align: top; }

.signpost-crossword-cluetable-answer, .signpost-crossword-cluetable-answer a { font-family: monospace; color: #000; background-color: #000; }

/* From pretty-item */

.wp-signpost-alm-pretty-item-subhead { font-size: 90%; font-weight: lighter; }

/* from Wikipedia:Wikipedia Signpost/Templates/Filler image-v2 */ .signpost-fillerimage { clear:both; padding:5px; padding-top:10px; width:290px; font-size:0.85em; color:#4D4D4D; line-height:1.35em; }

.signpost-sidebar-fillerimage { width:300px; float:right; clear:right; padding-left:20px; } /* From Wikipedia:Wikipedia Signpost/Templates/Inline_image */ .signpost-inline-image { } /* Note: signpost-inline-image-caption still has inline stuff in the template, beacuse it parses values out of params. These are: text-align:; This could be fixed. */ .signpost-inline-image-caption { clear:left; max-width:780px; padding:5px; padding-top:0px; margin-left:10px; font-size:0.85em; color:#4D4D4D; line-height:1.35em; }

/* From Wikipedia:Signpost/Templates/Signpost-article-comments-end/commentspage 2024-07-06 */ .signpost-commentspage1 { text-align:center; margin-bottom:40px; font-family:Georgia, Palatino, Palatino Linotype, Times, Times New Roman, serif; font-size:140%; } .signpost-commentspage2 { font-size:80%; font-variant:small-caps; }