mirror of
https://gerrit.wikimedia.org/r/mediawiki/extensions/SyntaxHighlight_GeSHi
synced 2024-12-18 17:22:43 +00:00
006e6c6f0f
Make the wrapper div for code block create a block formatting context. This changes how floated content is laid out: previously the wrapper was taking 100% width and tried to wrap text around the floated content, now its width is limited by the width of floated content. This way absolutely positioned elements inside the code block (like the copy buttons) won't overlap the floated content. We've had this problem before when adding line numbers (T272853), and the workaround we used there won't work for the copy buttons. It also lets us remove the background-color override, previously needed to avoid it leaking outside the code block (T126010). Bug: T40932 Change-Id: I7f51ea78d7fcf07358c6ee45275b2bae2e1cbeb8
36 lines
878 B
Plaintext
36 lines
878 B
Plaintext
@import 'mediawiki.skin.variables.less';
|
|
|
|
/**
|
|
* Adapted from https://www.mediawiki.org/wiki/MediaWiki:Gadget-site-tpl-copy.css
|
|
* Original author: Krinkle
|
|
*/
|
|
|
|
/**
|
|
* https://doc.wikimedia.org/oojs-ui/master/demos/ (2023-11-13)
|
|
* https://design.wikimedia.org/style-guide/components/buttons.html
|
|
*/
|
|
.mw-highlight-copy--bound button {
|
|
position: absolute;
|
|
top: -1em;
|
|
right: -0.9em;
|
|
box-sizing: border-box;
|
|
padding: 5px 7px;
|
|
border-radius: 2px;
|
|
background: @background-color-base;
|
|
color: @color-progressive;
|
|
border: 1px solid @border-color-muted;
|
|
|
|
&:hover {
|
|
cursor: pointer;
|
|
color: @color-progressive--hover;
|
|
background: @background-color-interactive-subtle;
|
|
border-color: @border-color-progressive--hover;
|
|
}
|
|
|
|
&:active {
|
|
color: @color-progressive--active;
|
|
background: @background-color-interactive;
|
|
border-color: @border-color-progressive--active;
|
|
}
|
|
}
|