mediawiki-extensions-Syntax.../modules/pygments.wrapper.css
Derk-Jan Hartman 9638ee20c3 Avoid background when the content is narrow
All our highlight content is inside a <pre> block. When this block is
more narrow that the page (due to being pushed aside by floating
context for instance), then the background of this parent element will
extend beyond the contents.

An alternative could be setting overflow:hidden; and then setting
margin:0 on the included <pre> element (which has UA default margins)

Bug: T126010
Change-Id: Id3c9544ea8fa379c7c640afa692d6184ad9c550f
2017-04-27 18:38:55 +02:00

63 lines
1.6 KiB
CSS

.mw-highlight {
/* All supported programming languages are written left-to-right */
/* @noflip */
direction: ltr;
unicode-bidi: embed;
}
.mw-highlight pre {
/* Use a more commonly found tab size of 4 (e.g. as used in CodeEditor)
instead of the browser-default value of 8 */
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
}
/* Avoid displaying double borders for nested 'code' elements.
Before we started using the 'code' tag for inline code snippets,
<code><syntaxhighlight enclose=none ...>...</syntaxhighlight></code>
was a common pattern. Continue supporting it in existing content. */
code code.mw-highlight {
background-color: transparent;
border: 0;
padding: 0;
}
/* The nested pre already has a background. T126010 */
div.mw-hightlight {
background-color: inherit;
}
/*
* Don't show a red border around syntax errors. This behavior may be useful
* in code editors, but it is not useful in a wiki environment, especially
* given the longstanding habit of using an existing, mostly-compatible lexer
* to highlight a language for which no lexer exists.
*/
.mw-highlight .err {
border: 0;
}
/* Highlight background of whole lines, not just text in them */
.mw-highlight .hll {
display: block;
}
/* Make line numbers non copyable */
.mw-highlight .lineno {
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
}
/* To interact better with the 'display: block' above, doesn't affect other uses */
/* @noflip */
.mw-highlight.mw-content-ltr .lineno {
float: left;
}
/* @noflip */
.mw-highlight.mw-content-rtl .lineno {
float: right;
}